Hva og hvorfor?
Hva er universell utforming og hvorfor er det viktig?
Universell utforming skal sikre at alle, uavhengig av funksjonsevne, kan delta aktivt i samfunnet. Vi kan alle oppleve funksjonsnedsettelser i løpet av livet, selv om de for noen er forbigående, som for eksempel om vi brekker armen eller får nedsatt hørsel i en periode.
Evnen til å klare seg selv og delta aktivt i samfunnet er en viktig del av menneskeverdet og en grunnleggende menneskerettighet. Universell utforming er én måte å fremme inkludering og likestilling på. Telemark fylkeskommune har en forpliktelse til å fremme og bidra til dette, slik at løsningene våre inkluderer alle.
I likestillings- og diskrimineringsloven defineres universell utforming slik:
«Med universell utforming menes utforming eller tilrettelegging av hovedløsningen i de fysiske forholdene, slik at virksomhetens alminnelige funksjoner kan benyttes av flest mulig, uavhengig av funksjonsnedsettelse.»
- Lov om likestilling og forbud mot diskriminering § 17
UU-tilsynet forklarer universell utforming på en enkel måte
Hvis du vil få en bedre forståelse av hva universell utforming er og hvorfor det er viktig, kan du se den korte videoen: www.uutilsynet.no/veiledning/intro-til-universell-utforming.
Hvordan skal vi sørge for universell utforming?
Telemark fylkeskommunes visuelle kommunikasjon skal være inkluderende og sørge for at vi når ut til alle. Dette innebærer at alt materiell som vi lager skal ivareta uu-kravene til typografi og punktstørrelser, fargebruk og kontraster, samt teksting og hastighet på voice og bilder ved utvikling av film og animasjoner – slik at alle kan lese eller høre dem.
Vår visuelle identitet og malverk er utviklet og gjennomgått for at vi skal imøtekomme kravene til universell utforming, henhold til norsk lov og forskrift, EUs web-direktiv og WCAG 2.1-standarden (Web Content Accessibility Guidelines).
Viktige hensyn er god lesbarhet, konsekvent utforming og god kontrast.
Mer informasjon om WCAG 2.1-standarden finner du på UU-tilsynets nettsider.
God lesbarhet
- Jevne bokstavtykkelser
- Godt separerte tegn som lett skilles fra hverandre
- Stor nok punktstørrelse
- God linjeavstand
- Gjentakende struktur
- PDF-er skal tilgjengeliggjøres med riktig språk, leserekkefølge og alternativ tekst på bilder.
Profilfonten Nunito og bruken av den i malene samsvarer med disse kravene.
Konsekvent utforming
- Konsekvent utforming skaper forutsigbarhet for brukeren.
- Minst mulig variasjon på typografiske stiler og virkemidler.
- Benytt lik struktur hver gang innhold av samme type gjentas.
- Logisk inndeling av tekst øker tilgjengeligheten.
Profilen hensyntar konsekvent oppbygging gjennom maler og tekstlige nivåer i malene.
God kontrast
- God kontrast sikrer god lesbarhet, både på skjerm og trykk.
- All fargebruk i profilen er innenfor kontrastkravene til WCAG 2.1-standarden. Derfor har profilens fargepalett en oversikt over kontrastmåling av alle fargene, se illustrasjon nedenfor.
- Forskjellen mellom lyse og mørke fargetoner kan overdrives for å øke kontrasten.
Profilens fargepalett og bruk av tekstfarger i malene er avsjekket mot dette.
EUs webdirektiv om universell utforming av offentlige nettsteder og mobilapplikasjoner har vært førende for vår profil. Alle fargene i fargepaletten har tatt hensyn til denne standarden for å sikre god kontrast mellom tekst og bakgrunnsfarge uavhengig av medie.
I figuren under ser vi at alle farger fra fargepaletten kan brukes som bakgrunn på valører opp til 40 % av hovedfargene.
Vi bruker som hovedregel svart tekst, og om du ønsker en farget bakgrunn bak teksten skal fargetonen på bakgrunnen være maks 40 % for å sikre synlighet og god nok lesbarhet. I digitale løsninger anbefales fargetone på 20–30 % på fargede elementer med svart tekst. Hvit tekst kan brukes på navigasjonsfargen Vann når den står i 100 %. Tekst kan i design også ha navigasjonsfargen Vann, men da må teksten være 18 pt eller mer.
Godkjente kontrastkrav
- Nivå AAA = består alle kontrastkrav* uansett skriftstørrelse og vekting.
- Nivå AA = består kontrastkravet for stor tekst; 14 pt bold eller 18 pt normal og større.
- Nivå AA+ = består minimum kontrastkravet anbefalt for standardtekst.
* Kontrastkravene er definert av WCAG 2.1-standarden (Web Content Accessibility Guidelines), som er anbefalinger for universell utforming vedtatt av W3C (World Wide Web Consortium).
Om malene våre
Malene våre tar hensyn til universell utforming gjennom bruk av høy kontrast og et godt hierarki på overskrifter og brødtekst. Designet er rent og uten forstyrrende elementer.
Malene har:
- Rene og tydelige skrifttyper – som hovedregel sort på hvit bakgrunn.
- Office-malene bruker Calibri. InDesign-malene bruker Nunito/Nunito Sans.
- Definerte bakgrunnsfarger er lyse og sørger for at tekst er godt synlig.
- Store hovedtitler – og god struktur for undertitler.
- Brødteksten* har en god størrelse tilpasset formålet, med leservennlig avstand mellom linjene.
Bruk av malene våre sørger for et godt utgangspunkt. Husk at du fortsatt er ansvarlig for at det endelige dokumentet blir universelt utformet. Hvis du er usikker på om noe av materiellet du har laget ivaretar kravene til universell utforming, kan du finne mer informasjon på UU-tilsynets nettsider:
* Det er ingen absolutt anbefalt størrelse på brødtekst i layout og trykksaker. Blindeforbundet anbefaler generelt en brødtekst på 11–12 punkt. Opplevelse av størrelse på brødtekst varierer ut ifra skrifttypens utførelse. Vår profilfont er en jevn og tydelig skrifttype som har god bredde i tegnene. Standard størrelse for brødtekst i våre maler er 12 pt.
Tips til deg som bruker Word og PowerPoint
Tekst og språk
- Bruk alltid fonten som er forhåndsdefinert i malene: Calibri brukes både i overskrifter og løpende tekst.
- Ikke knip eller spre bokstavene i teksten for å få bedre plass, hold deg i normal modus.
- Venstrestilt tekst er lettere å lese, så bruk fast venstremarg og la høyremargen være fleksibel, slik det er lagt opp i malene. Unngå midtstilt tekst.
- Unngå blokkbokstaver. Selv om STORE bokstaver er lettere å se isolert sett, blir lesbarheten nedsatt hvis dette brukes i større tekstmengder.
- Unngå mye bruk av kursiv. Kursiv kan fungere på noen få ord, men er vanskelig å lese i større tekstmengder.
- Unngå understreking av tekst, det kan gi inntrykk av at det er satt inn en kobling/lenke.
- Lenker skal ha en beskrivende lenketekst, slik at det er lett å forstå hva som er målet med lenken. Skriv heller «les mer på vår nettside» som lenketekst, i stedet for «klikk her».
- Gjennomgående og konsekvent bruk av stiler, overskrifter og gode kontraster bidrar til et godt tilgjengelig dokument. Bruk de definerte stilene og fargene i malene våre, så er du på god vei.
- Skriv kortere. Overfylte maler virker mot sin hensikt. Legg heller til ekstra sider.
- Bruk et klart språk. Les mer om klarspråk og skriveråd her.
Bilder og grafikk
- Bilder og illustrasjoner skal ha en alternativ tekst som beskriver innholdet. Dette gjør at de som ikke kan se bildet fortsatt kan få med seg hva det dreier seg om.
- Unngå å legge tekst direkte på bilder.
- Pass på at videoer i presentasjonen er tekstet.
- Bilder og grafikk som kun brukes som dekorasjon, skal markeres som dekorativ. Dette gjør du dette ved å markere bildet, høyreklikke og velge «Vis alternativ tekst», og huk av boksen for «Marker som dekorativ».
Grafer, diagram og tabeller
- Unngå bruk av tabeller så langt det lar seg gjøre. Disse er det generelt vanskelig å lese og trenger avansert behandling for å kunne leses opp i riktig og forståelig rekkefølge.
- Hvis du må bruke tabeller, bruk enkle oppsett med overskriftsrad og innholdsrader.
- Ikke slå sammen celler, da kan ikke en skjermleser lese innholdet i riktig rekkefølge.
- Bruk helst standardfargen(e) som kommer opp når du oppretter en ny tabell/diagram/graf/SmartArt og lignende. Skal du bytte farge, må du sørge for å bruke fargekontrast og skriftstørrelser som oppfyller krav til universell utforming (WCAG-standarden).
- Skal du lime inn graf/diagram fra Excel, må du sørge for at innholdet blir leselig ved å justere tekststørrelse og farge.
- Bruk gjerne tykke kantlinjer i diagrammer/grafer.
Pass på at informasjonen i grafene ikke utelukkende presenteres med farge. - Ledetekst i diagrammer bør være koblet til hvert enkelt element.
Riktig leserekkefølge
- Test dokumentet ditt med tilgjengelighetskontrollen på fanen «Se gjennom» i Word og PowerPoint, den er god hjelp.
- Kontroller at leserekkefølge blir riktig, slik at for eksempel en bildetekst ikke leses før en overskrift.
- Her er noen nyttige lenker på Microsofts nettsider:
Tillegg til deg som er designer
Om tekst og språk
- Bruk alltid fontene som er forhåndsdefinert i malene. De er rene og har lik tykkelse i streken (ukomplisert), tydelig og gode å lese. Tallene forveksles ikke med bokstaver og hopper ikke på linjen.
- Sørg for at flaten/siden ikke blir for tettpakket med tekst og annet innhold. Bruk luft som et bevisst designgrep. Det gir god lesbarhet.
- Bruk kolonner slik at tekstlinjer ikke blir for lange (maks 80–90 tegn).
- «Større tekst er bedre, men ikke alltid best». Stor tekst gjør budskap synlig, men mister sin funksjon om det brukes for mye, og blir vanskelig å lese når teksten er lang.
- Skal du bruke tekst oppå bilder må bakgrunnen være rolig og egnet til å sikre god kontrast og lesbarhet.
- Materialvalg påvirker lesbarheten på trykksaker – blanke overflater gjør tekst vanskelig å lese.
Riktig leserekkefølge
- I InDesign er det rekkefølgen på elementene i layers som styrer leserekkefølgen. Et godt tips er å jobbe riktig allerede der, da blir Acrobat brukt til kun å kontrollere leserekkefølgen. Les om verktøyet for leserekkefølge for PDF i Adobe Acrobat Pro på Adobes nettsider.
- Det er flere ting å tenke på når universelt utformede PDF’er skal lages fra InDesign. Se flere tips fra Adobe om å opprette tilgjengelige PDF-dokumenter.