Typografi tips og teknikker

God typografi går ofte ubemerket, fordi den rett og slett gir mening. Elementer i god typografi inkluderer konsistens, hierarki og justering. Med vår patenterte Typografiske font, OBOS Tekst, kommer en mulighet til å kalibrere vår typografiske tankegang med noen beste praksiser.

I OBOS har vi følgt Dyslexia style guide for å gjøre leseopplevelsen god for alle, også dem med lese og lærevansker.

Tracking / Kerning

OBOS Tekst krever god plass for å puste komfortabelt i tekst og overskrifter. Den er lettere i utseendet og mer lesbar når den har riktig avstand.

kerning_0

Kerning_1

Kerning_2

Om en skal gjøre lesbarheten bedre for personer med dysleksi og lærevansker, så kan avstanden mellom bokstavene (kerning) økes med 35%. (Eksempelet under med heading-m hvor kerning er satt til 1.5px)

Dysleksi

Venstrestilt linjeføring

Venstrestilt linjeføring skaper sterke justeringer som øyet kan følge, noe som bidrar til lesbarhet og organisering. Det er vår standard for all typografi på tvers av OBOS fordi den er funksjonell, moderne, tidløs og den mest effektive innen informasjonsdesign og lesbarhet.

Venstrestilt linjeføring

Leading

Å velge riktig linjeavstand er svært viktig for lesekvaliteten og typografiens effektivitet. Den bør aldri være for åpen eller for stram, da dette gjør lesingen vanskelig og ubehagelig for leseren. Vi har satt 1.5 eller 150% i linjeavstand for å gjøre teksten lesbar for alle. 1.3 for analoge medium.

Linjeavstand

Versaler

Skriv innhold med stor forbokstav. Titteltekster kan brukes i riktige titler, produktnavn og tjenestenavn. Unngå bruk av store bokstaver i typografien din, spesielt i avsnitt eller tekst.

Tegnsetting

Bruk av avstand og visse typografiske virkemidler er viktig for forståelse og korrekt lesing. De typografiske detaljene i korrekt tegnsetting hjelper til med tolkning, inndeling av tekst i setninger og leddsetninger, og er avgjørende for å tydeliggjøre betydningen av setninger.

Horunge og “rags”, “ragged edge”

Se alltid etter muligheter til å forbedre “rags” eller ujevnheter i høyre marg. Vær oppmerksom på horunger, og juster linjelengdene sammen med en skribent for å løse vanskelige brudd som kan påvirke lesekvaliteten.

Horunger og rags

Alignment

Venstrejuster teksten i forhold til annen tekst når det er mulig. Dette skaper en sterk vertikal justering med teksten, noe som gir lesbarhet, organisering og klarhet for brukeren. Her finnes det også unntak med bilder og andre komponenter.

Komfortabel lesing

Linjelengden er basert på antall tegn eller ord per linje og bestemmes av mengden tekst som brukes. Det er viktig å ikke lage lange tekstlinjer for en leser. Korte og effektive linjelengder er lettere å lese. 60-70 tegn per linje er optimal, den lengste linjen vi har i OBOS er 83 tegn bred. Minste bør ikke være under 30.
Tips er å bruke "Line length" plugin i Figma og tilpasse til layout griden.

Line length

Stablede overskrifter

Stable overskrifter på to eller til og med tre linjer i stedet for å holde dem på én lang linje. Dette bidrar til å skape en kompakt leseenhet for overskriften, og kan bidra til å kontrollere eller unngå overlappende tekst.