Onderdelen CSS-sjablonen

Onderdelen-CSS-templates voor catalogi vol vergelijkbare artikelen

Twee productkaarten in een onderdelencatalogus kunnen er identiek uitzien en toch iets heel anders betekenen. Het ene artikel wordt vanmiddag verzonden, het tweede is een speciale bestelling met een wachttijd van zes weken, en het derde is niet meer leverbaar ten gunste van een nieuwere versie. Styling maakt dat verschil zichtbaar voordat iemand klikt, en onderdelen-CSS-templates bieden leveranciers een reeks visuele regels voor dit soort onderscheid.

Voorraadstatus op identieke kaarten

Voorraadcondities veranderen sneller dan productfoto's, dus doen de bijbehorende signalen het meeste dagelijkse werk.

Een aantal van die condities verdient een eigen behandeling:

• Op voorraad, lage voorraad en nabestelling, onderscheiden door iets sterkers dan alleen kleur.
• Speciale bestelartikelen, waarbij de levertijd naast de prijs hoort te staan.
• Uit productie genomen componenten die verwijzen naar het vervangende onderdeel.
• Een bevestigde pasvorm voor de geselecteerde machine en een waarschuwing wanneer het onderdeel niet past.

Distributeurs die OEM- en aftermarket-lijnen naast elkaar aanbieden, hebben nog een extra signaal nodig, omdat het prijsverschil vragen oproept die een klein label sneller beantwoordt dan een hele alinea.

Lange codes gemakkelijk leesbaar maken

Een onderdeelnummer is de echte naam van het product en verdient daarom meer visueel gewicht dan de omringende tekst. Een niet-proportioneel lettertype, ruimere spatiëring en een duidelijk contrast maken een code van negentien tekens eenvoudiger hardop voor te lezen en te vergelijken met het versleten exemplaar op de werkbank. Specificatietabellen verdienen dezelfde aandacht, met uitgelijnde eenheden, subtiele rijscheidingen en kolombreedtes die over de hele lijst gelijk blijven.

Nicepage dekt het meeste hiervan af via de visuele bedieningselementen, en Custom CSS Code regelt wat overblijft. De documentatie over aangepaste CSS legt uit hoe regels worden toegevoegd en klassen aan elementen worden toegewezen, zodat catalogusspecifieke elementen zoals pasvorm-badges, vergelijkingsrijen of filter-chips gescheiden blijven van het algemene visuele systeem.

Smalle schermen vereisen minder kolommen

Op telefoons bezwijkt de styling van een catalogus vaak. Een code van twintig tekens breekt halverwege af en verandert in twee betekenisloze delen, een specificatietabel drukt de prijs uit beeld en vier kaarten op een rij maken niets meer leesbaar. Gecontroleerde tekstafbreking, een tabel die horizontaal scrolt en een aantal kaarten dat afneemt naarmate het scherm smaller wordt, lossen het leeuwendeel op.

Het is verstandig om deze uitzonderingen strikt te begrenzen, want een regel die bedoeld is voor één productgroep met ongebruikelijk lange beschrijvingen hoort niet elke kaart in de catalogus aan te passen. Styling die een groeiende catalogus overleeft, is meestal de nuchtere soort: één visuele taal voor herhaalde items, plus een korte lijst met uitzonderingen die elk hun waarde bewijzen.