Grafisk manual webb – guide

Grafisk manual för webb – guide

När ni skapar en ny grafisk profil är det viktigt att ni har digital kommunikation och webben som utgångspunkt. Även om varumärket i fråga arbetar mycket med fysisk grafik. Webben är navet i all kommunikation med helt egna förutsättningar och behöver en egen variant av den grafiska manualen. Här är några punkter som är viktiga att tänka på vid produktion av en grafisk manual för webb. Vi kan hjälpa er!

Detaljrikedomen i en grafisk manual varierar beroende på hur hårt ni vill styra upp den kommunikation ni producerar. I dokumentationen är det är bra att tillhandahålla alla måsten som ett minimum. Som typsnitt med storleksangivelser, färger och regler för hur ni får lov att använda logotypen. Men att övriga regler har tolkningsutrymme för att kunna skapa levande, kreativ och effektiv kommunikation. Här kan ni läsa mer om varför en tydlig grafisk profil är så viktig att ha.

Med vem och vad vill ni kommunicera genom webbprofilen?

Något man ofta glömmer bort i de här sammanhangen är att kort beskriva i manualen vad varumärket står för och vill kommunicera till sina olika målgrupper. Sammanfatta kort de strategier ni arbetat fram i er varumärkesplattform och kommunikationsplattform eller hänvisa till var man kan ta del av dem. Så att webbprofilen ni skapar är byggd för att kunna uppnå era kommunikationsmål. Syftet med er webbplats, era budskap och vilka målgrupper ni vill nå, behöver vara glasklart innan ni påbörjar arbete med struktur, funktion och design.

Innehåll i en grafisk manual för webb

Webben har fler dimensioner än en platt grafisk yta och behöver därför innehålla andra element för att kunna designa upplevelsen maximalt t ex:

• Informationsdesign: Olika typer av ingångar/hur besökaren hittar på sidan. T ex:
  • Guidemoduler, direktingångar, navigationspuffar, snabblänkar.
• Interaktionsdesign: Hur man som besökare ska agera och använda informationen.
• Layout: Webbplatsens maxstorlek, grid och olika komponenter/moduler:
  • Textblock, primärpuffar med bild, sekundärpuffar, formulär etc.
• Logotypen: Hur den får användas. En logotyp eller symbol som kan inneslutas i en kvadrat är optimalt. En animerad version av logon är också bra att ha för digital kommunikation.
• Typsnitten ni väljer bör från början vara typsnitt som passar för digitala kanaler. Ange stil, storlek och avstånd från H1 ner till styckeformat. Om ni använder Google fonts, tänk då på att GDPR-säkra användningen. Annars riskerar ni att bryta mot GDPR genom att era användares IP-adresser skickas vidare till tredje part när de använder er webbplats. Er tekniska partner kan hjälpa er att lösa detta.
• Färgerna ni väljer ska ha bra kontrastvärden för god läsbarhet och synlighet. Speciellt när det gäller färgkombinationer av text och grafik som ligger på färgade bakgrundsplattor. Ni kan kontrollera färgkombinationernas kontrastvärde på: https://webaim.org/resources/contrastchecker/
  • Beskriv hur er färgpalett får användas. T ex med utvalda färgkombinationer, bakgrundsfärg, signalfärger och call to action-färg.
• Bildmanér: Är foto eller illustrationer ert huvudmanér? Anpassa bildmanéret för sociala medier för en mer autentisk känsla. Hur ser era ikoner och infografik ut?
• Favikon och avatarer för sociala medier.
• Om varumärket är en myndighet behöver tillgänglighetsstandard anges enligt WCAG. Detta är inte ett krav för privata företag men ni bör alltid sträva efter en webbplats med god tillgänglighet.

Grafiska riktlinjer för övrig digital kommunikation

• Riktlinjer för rörligt innehåll: Hur ska ni visa logon på film, ikoner och andra grafiska element? Filmallar kanalanpassade för sociala medier kan vara bra att ha för smidig och snabb produktion av rörligt innehåll.
• Ljud: Skapa en ljudlogo, urval av ljudeffekter, musik och vilket språk och dialekt har er voice over? Det är viktigt att era målgrupper känner igen ert varumärke bara genom att höra det.
• Anpassningar och riktlinjer för sociala medier.
• Profilerade bakgrunder ni kan använda på olika mötesplattformar.
• Presentationsmaterial: Användarvänlig powerpointmall (eller liknande program) där säljingången är stöttad av det övergripande varumärkesbudskapet och erbjudandet.

Sammanfattning Grafisk manual för webb

När ni skapar en ny grafisk profil ska den utgå ifrån webben eller åtminstone redovisa digital kommunikation som en av de primära delarna av den grafiska manualen. Webbens dimensioner är många fler än en platt grafisk yta och för att kunna designa upplevelsen maximalt behöver manualen innehålla andra element. Till exempel: informationsdesign, interaktionsdesign, en färgpalett med bra kontrastvärden, typsnitt med storleksangivelser från H1 ner till styckenivå och hur företagets logga får lov att användas.

Byråteket är en strategisk kommunikationsbyrå i Malmö. Vårt erbjudande sträcker sig från strategi till taktik och produktion av material för både tryck, film, webb och andra digitala kanaler. Och vi jobbar med såväl varumärkesarbete som marknadskommunikation tillsammans med våra uppdragsgivare. Kontakta oss gärna så berättar vi mer och lyssnar in oss på era behov.