1. Lav et overblik over det, I allerede har
Saml logoets versioner, farvekoder, skrifttyper, billeder og eksisterende designmanual. Notér ved hvert materiale, hvor det kommer fra, hvem der vedligeholder det, og om brugen på hjemmesiden er afklaret. Filer med navne som “logo-ny-final-2” er et tegn på, at I bør vælge en tydelig, fælles kilde, før udviklingen begynder.
Del materialet i tre grupper: noget der skal bevares, noget der kan tilpasses, og noget der mangler. Logoets form kan være fast, mens regler for billedbeskæring endnu ikke findes. Det er en konkret designopgave, ikke nødvendigvis en grund til at starte forfra med hele identiteten.
Et tænkt konsulentfirma har en trykt manual med en lys accentfarve og store, smalle overskrifter. På hjemmesiden skal firmaet også vise lange ydelsesnavne, formularetiketter og hjælpetekst. Her skal identiteten omsættes til flere størrelser og roller, ikke blot kopieres fra brochurens forside.
Hvis selve retningen stadig er uklar, bør I først bruge hovedguiden om visuelt udtryk. Denne artikel tager udgangspunkt i, at I har materialer eller en retning, som skal fungere i en digital hverdag.
2. Oversæt materialer til roller og elementer
En digital designregel bør forklare, hvornår et element bruges. “Blå” er en farve. “Primær kontaktknap” er en opgave. Når rollen er fastlagt, kan farve, tekststørrelse og afstand følge en fælles beslutning på tværs af siden. Det gør det lettere at ændre udtrykket uden at gennemgå tilfældige enkeltvalg overalt.
Start med de dele, der optræder ofte: navigation, overskrifter, almindelige links, primære og sekundære knapper, indholdskort og formularfelter. Vis både normal tilstand og relevante ændringer som fokus og fejl. Brug samme betegnelse til samme funktion, så “Kontakt” ikke uden grund skifter mellem flere navne.
Brug samme navn og genkendelige symboler til den samme handling på hele hjemmesiden. Hvis en knap hedder “Book en samtale” ét sted, bør den ikke pludselig hedde “Start” et andet sted, hvis den gør det samme. Det gør siden lettere at finde rundt på. Se også vejledningen om genkendelige funktioner på tværs af sider.
| Element | Regel, der bør aftales | Eksempel, der bør gemmes |
|---|---|---|
| Kontaktknap | Samme rolle, navn og genkendelige udtryk | Normal visning og tastaturfokus |
| Servicekort | Fast rækkefølge af titel, forklaring og link | Kort og lang titel |
| Formular | Etiket, hjælp og fejl har faste pladser | Felt med og uden fejl |
| Billede | Motivtype og beskæring passer til rollen | Desktop og mobil |
Afklar farverollerne med guiden til farver på hjemmesiden. Gem især tilladte tekst- og baggrundskombinationer, så en ny underside ikke kræver en ny vurdering af de samme grundvalg.
3. Test reglerne med uperfekt indhold
En designmanual bliver først nyttig, når eksemplerne ligner det indhold, I faktisk skal publicere. Brug en lang overskrift, et kort afsnit, en side uden billede og et kort med mere tekst end de øvrige. Det viser, om komponenterne kan rumme hverdagen, eller om redaktøren konstant skal tilpasse teksten til et skrøbeligt layout.
Vis også en side på mobil. Skal billedet beskæres anderledes? Hvad sker der, når to knapper ikke kan stå ved siden af hinanden? Hvilket indhold kommer først, når kolonner bliver til én? Disse beslutninger er en del af identitetens anvendelse på web, ikke blot tekniske detaljer til sidst.
For billeder bør reglerne handle om både stil og sandhedsværdi. Et procesfoto skal vise den relevante opgave, mens et dekorativt motiv har en anden funktion. I artiklen om egne billeder og stockfotos finder du en motivplan, som kan indgå i manualen.
Undgå at skabe en undtagelse, hver gang en side er lidt anderledes. Spørg først, om en eksisterende komponent kan rumme behovet. Omvendt skal et reelt nyt behov ikke presses ind i en forkert skabelon. Notér, hvorfor en ny variant er nødvendig, og hvor den må bruges.
4. Gør manualen nem at holde opdateret
En lille virksomhed behøver ikke begynde med et omfattende bibliotek. Et kort dokument med de vigtigste regler og fungerende eksempler kan være tilstrækkeligt. Det afgørende er, at dokumentet svarer til hjemmesiden og kan findes af dem, der arbejder på den.
- Udpeg én person, der samler ændringer og spørgsmål.
- Gem godkendte materialer ét fælles sted.
- Beskriv roller og brugssituationer sammen med farver og mål.
- Vis eksempler med rigtigt indhold i flere skærmstørrelser.
- Opdatér reglerne, når en ny komponent eller variant godkendes.
Prøv til sidst at lave en ny serviceside ud fra materialet. Hvis redaktøren må opfinde nye typografiske regler eller gætte på knappernes betydning, mangler der sandsynligvis et eksempel. Hvis siden kan bygges med klare valg og få spørgsmål, er manualen på vej til at blive et praktisk arbejdsredskab.
Designet kan hjælpe med at omsætte den eksisterende identitet til en hjemmeside med sammenhæng mellem indhold, design og udvikling. Et overblik over jeres nuværende materialer er et godt udgangspunkt for den samtale.
