4 Tips til at skrive tilgængelige og brugervenlige indlæg

Det er ikke alle mennesker, der kan navigere uhindret rundt på nettet. Hver 10. af alle mennesker har en nedsat funktionsevne. De kan ikke få det samme ud af internettet, som flertallet kan.

Hvordan kan vi inkludere mennesker med en nedsat funktion? Hvad er bedre end at spørge en, der prøver barrierne på sin egen krop hver eneste dag?

Stein Erik Skotkjerra er CEO for Inklusio, der er en konsulentvirksomhed der rådgiver omkring digital inklusion og webtilgængelighed. Og så er han selv helt blind. Det betyder, at han ikke navigerer på nettet som flertallet. Han fortæller:

“Som blind bruger jeg en skærmlæser til at tolke og læse for mig hvad der står på min skærm – uanset om det er på mobilen eller laptoppen. Skærmlæseren læser ikke hele skærmen hele tiden, men forsøger at læse det, der er mest relevant for mig. Så kan jeg selv bruge tastaturet, både med tab, shift-tab, piletaster osv, og med skærmlæserens egne genveje, til at navigere rundt på en webside.”

Det er mennesker som Stein Erik, det vil gavne, hvis du lægger lidt ekstra krudt i at gøre dine sider og indlæg tilgængelige. Og hvordan skriver du så tilgængelige sider og indlæg?

1. Keep it simple

Ligesom i de fleste andre sammenhænge er reglen “keep it simple” (KISS) et godt udgangspunkt for at gøre dine indlæg og sider tilgængelige for alle.

Undersøgelser viser f.eks. at komplekst layout er en af de største barrierer for svagtseende, når de navigerer på internettet. Vores hjerner er helt generelt bedre til at opfatte og forstå indhold, der er overskueligt og ryddeligt. Det er nok også noget mange vil nikke genkendende til – uanset hvor godt eller dårligt vores syn måtte være.

Så hvad er det lige du skal gøre for at gøre dit indhold enkelt?

  1. Tag en udskrift af den side du arbejder med. Med menu, footer og det hele.
  2. Sæt en ring rundt om alt, der hører sammen. Dvs. rundt menu, rundt søgefelt med tilhørende, runde knapper osv. Hvis der er grupperinger af andre elementer, så markerer du også dem.
  3. Gennemgå alle de cirkler du nu har tegnet. Vurder om de er helt nødvendige for at brugeren skal kunne gennemføre det hun eller han kom for? Det kunne f.eks. være at læse dit blogindlæg, købe din bog eller lignende.
  4. Fjern så alt indhold der ikke har en decideret nytte i forhold til at løse brugerens hovedopgave.

Hvis du står tilbage med, at alt er nødvendigt for at løse de en til to vigtigste opgaver på siden, så har du enten været rigtig dygtig, eller også har du ikke prioriteret hårdt nok.

2. Sørg for god læsbarhed

En let læsbar skrifttype (font) og en god komtrast mellem din baggrund og din tekst er godt for alle brugere. Men for brugere med synshandicap er det nødvendigt. For ellers kan de slet ikke læse hvad der står på din hjemmeside.

Hvad der udgør en let læsbar skrifttype handler rigtig meget om sund fornuft. Så brug din sunde fornuft og find en eller to skrifttyper, som du selv synes er let at læse. De skal ikke give ondt i hovedet eller skære i dine øjne.

Når det kommer til kontraster, er kravene lidt mere præcise og målbare. Du skal sørge for at have en kontrast mellem din baggrund og teksten på mindst 4,5:1. Der findes masser af værktøjer som kan teste dette. Her er nogle gode:

https://webaim.org/resources/contrastchecker/

https://siteimprove.com/en/accessibility/color-contrast-checker/

https://developer.paciellogroup.com/resources/contrastanalyser/

3. Brug alternative tekster på billeder

Du har måske hørt om alternative tekster? Eller alt-tekster? Det er nemlig det, mange tænker på når de tænker på at gøre internettet tilgængeligt for personer med handicap.

Der er mennesker, der er afhængige af alt-tekster. Her taler vi selvfølgelig om blinde. Fordi de kan rent faktisk ikke se hvad dine billeder indeholder.

Men vi har også andre grupper, der vinder:

Det er dem med dårlig båndbredde, her kan de hurtigt se, hvad billedet handler om, før det toner frem på skærmen.

Og vigtigst af alt…. Google. Hvis du giver dine billeder alternative tekster, vil Google også vide hvad de indeholder. Og det gør så det nemmere for folk at finde din webside eller dit blogindlæg, når de søger. Win!

Hver gang du uploader et billede til dit publiceringssystem (CMS) som f.eks. WordPress, skal du huske at tilføje en alternativ tekst til billedet.

Sådan skriver du alt-tekster:

  1. Hvis billedet ikke indeholder andet end pynt og dekorationer skal du lade feltet stå tomt. Hvis du selv skriver din HTML, skal der stå alt=””
  2. Indeholder billedet noget, der giver mening? Så skal du formidle det til dem, der ikke kan se billedet. Er du i tvivl? Den nemmeste måde at teste dette på er ved at slå billeder fra i din browser, og selv vurdere om du ville kunne opfange meningen med billede

Link: Brug denne officielle guide til at vurdere dine alt-tekster.

4. Brug tekst på links der giver mening

Når du tilføjer et link til dit blogindlæg, skal du markere den tekst der skal fungere som link. Ideelt set skal det være muligt at forstå hvor man ender hvis man klikker dit link kun ud fra den tekst du markerer som linktekst. Du kan selv teste det ved at se, om du kan forstå hvad der ville ske hvis du klikker på det link, du har skrevet.

Dårlige eksempler på linktekst er:
“Her”
“Dette link”
“Sådan”

Få alle med

Og hvis du holder fast i dine gamle vaner og gør som du plejer? Så har du praktisk taget tabt de mange, der ikke får noget ud af din hjemmeside, slutter Stein Erik Skotkjerra.

“Hvis jeg kommer til en onlineløsning, som ikke er tilgængelig, betyder det jo, at jeg ikke kan løse den opgave jeg kom for. Dvs. at jeg ikke kan købe produktet af den webshop jeg havde tænkt, at jeg ikke kan ansøge online eller få adgang til den information jeg har brug for”, fortæller Stein Erik og slutter:

“Det kan være både meget frustrerende og upraktisk, men jeg er hurtig til at finde et andet website der fungerer bedre, og jeg vil altid heller lægge mine penge hos nogen der har et website jeg kan bruge. Og jeg tror der er mange der har det som mig.”

Hvis du skal ændre én vane, så er det en god idé, at du tilføjer disse tips til din checkliste.

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top