Front-end style guide

Een front-end style guide is een verzameling van componenten die als bouwstenen in online publicaties worden ingezet. Hierin wordt bepaald wat de gebruiker op zijn scherm te zien krijgt (front-end). Front-end style guides zorgen enerzijds voor een consistente eenduidige gebruikerservaring en anderzijds voor een efficiënt en snel ontwerpproces. Andere benamingen zijn componentenbibliotheek of design systems.

Hoe voldoe je aan deze eis?

Een front-end style guide heeft zowel een vormgevings- als technisch aspect. De vormgeving bevat huisstijlbouwstenen zoals het logo, kleurgebruik, fontkeuze en beeldtaal. Die worden in componenten vastgelegd zoals een header en een footer. Het interactieve deel zoals gedrag van linkjes, zoekbalk, formulierelementen et cetera wordt onzichtbaar technisch in codetaal gestopt.

Front-end style guides worden ontworpen door front-end designers en UX (User Experience) designers. Zij leggen de vormgeving en interactie vast in zogenaamde componenten. Die componenten dienen als een blokkendoos om een online publicatiemiddel mee op te bouwen. Front-end style guides vormen altijd de basis voor het creëren van nieuwe ontwerpen. De huisstijlkleuren en webfonts zitten in de componenten verwerkt. Tezamen tonen zij de interface (front-end) die de gebruiker te zien krijgt bij het bezoeken van een website, magazine, app et cetera. Door deze componenten bij gebruikers te testen draagt het ook bij aan de gebruiksvriendelijkheid van het online communicatiemiddel.

Is dit verplicht?

Dit is geen verplichting, maar wordt aanbevolen. Het helpt om de consistente ervaring voor de gebruiker te bewaken en maakt doorontwikkeling efficiënt door hergebruik van bestaande elementen/componenten. Daarmee schept het ook goede condities om aan de toegankelijkheidsvoorwaarden te voldoen die wel verplicht zijn.