Den forenklede guide til webtilgængelighed: Forståelse af WCAG

Hvis din organisation har et website, skal det være tilgængeligt for personer med handicap. Etisk set har du et ansvar for at imødekomme så mange brugere som muligt – og der er ikke nogen god grund til at ignorere en stor del af dem. Det gælder for alle offentlige og private websites, uanset om du driver en virksomhed, skole, offentlig myndighed eller en hvilken som helst anden institution.

Ifølge Verdenssundhedsorganisationen (WHO) lever mere end 1 milliard mennesker på verdensplan med mindst ét handicap. Det er muligvis en undervurdering. Centers for Disease Control and Prevention (CDC) anslår, at 26 % af USA’s voksne befolkning har et handicap, og det tal forventes at stige på grund af den demografiske udvikling.

Målet med digital tilgængelighed er at give så mange mennesker som muligt en bedre oplevelse til. Det omfatter mennesker med en bred vifte af handicap, fx:

• Døve brugere og personer med hørehandicap
• Personer med synshandicap
• Personer med neurokognitive forstyrrelser
• Personer med fysiske handicap
• Personer med psykiske lidelser

Hvordan kan et website favne alle disse brugere – og hvordan tester du dit indhold for at sikre, at du er på rette spor?

Den gode nyhed: Der findes en regelbog. Web Content Accessibility Guidelines (WCAG) er udgivet af World Wide Web Consortium (W3C), en international organisation, der også laver standarder for programmeringssprogene HTML og CSS. Nedenfor forklarer vi, hvordan du ved at følge WCAG kan få hjælp til at nå ud til flere mennesker – og bedre kan overholde Americans with Disabilities Act (ADA) og andre love.

WCAG’s rolle i overholdelse af tilgængelighed

Mange love om handicappedes rettigheder citerer WCAG direkte, og andre (fx den amerikanske regerings egne Revised Section 508 Standards) inkorporerer retningslinjerne som reference. Vi kommer mere ind på disse love om et øjeblik; først forklarer vi kort, hvordan WCAG er opbygget.

WCAG består af bestået- ikke-bestået-udsagn kaldet succeskriterier, der kan bruges til at teste indhold for digital tilgængelighed. Retningslinjerne er designet til at kunne anvendes på stort set alle typer onlineindhold, herunder mobile apps og webrelaterede dokumenter (fx Adobe PDF-filer).

Succeskriterierne er organiseret i tre niveauer af overensstemmelse. “Overensstemmelse” betyder, at man frivilligt følger retningslinjerne. Her er de tre niveauer af overensstemmelse med WCAG’s succeskriterier:

• Level A omfatter de vigtigste (og mindst strenge) krav.
• Level AA omfatter andre kriterier. De fleste websites bør sigte efter niveau AA-overensstemmelse.
• Level AAA omfatter de strengeste krav. Nogle former for indhold kan muligvis ikke opfylde alle level AAA-succeskriterierne.

Hvert level indeholder alle succeskriterierne fra det foregående niveau. Med andre ord, for at overholde WCAG Level AA skal du også følge alle kravene i WCAG Level A.

International lovgivning om tilgængelighed

Flere og flere lande har indført love om tilgængelighed: Selv hvis din virksomhed ikke har kontorer i et land, men er aktiv der, skal du overholde den gældende lovgivning om tilgængelighed.

Alle disse love foreskriver, at både offentlige og private websites skal være tilgængelige for brugere med handicap:

• Det europæiske direktiv (EU) 2016/2102 om tilgængelighed om tilgængeligheden af offentlige organers websites og mobilapplikationer har været gældende siden den 26. oktober 2016. Den europæiske lov om tilgængelighed (European Accessibility Act, EAA), som kommer til at gælde i hele EU fra juni 2025, har til formål at forbedre markedsmekanismerne for tilgængelige produkter og services ved at fjerne de barrierer, der er opstået som følge af divergerende regler i de forskellige medlemsstater. Denne EU-lovgivning, såvel som Europa-Parlamentets direktiv om tilgængelighed af websites, kræver, at offentlige og private websites er tilgængelige for brugere med handicap. I Danmark giver webtilgængelighedsloven dig mulighed for at kontrollere tilgængeligheden af et website og dets indhold i henhold til internationale standarder for digital tilgængelighed, også kendt som WCAG. Graden af tilgængelighed for et website beregnes ved at auditere det i forhold til kriterier, der er baseret på WCAG.
• I USA gælder Americans with Disabilities Act (ADA).
• I Canada kræver AODA (Accessibility for Ontarians with Disabilities Act), at alle offentlige websites opfylder størstedelen af WCAG 2.0 Level AA succeskriterierne.
• I Australien har regeringen i henhold til DDA (Disability Discrimination Act), der svarer til ADA, identificeret WCAG niveau AA som standarden for en rimelig overholdelse.
• I Sydkorea kræver Disability Protection Act, at man overholder de koreanske retningslinjer for tilgængelighed af webindhold, som er næsten identiske med WCAG 2.0 Level AA succeskriterier.

Denne liste er ikke udtømmende. Mens disse love (og de sanktioner, de pålægger) varierer fra land til land, er WCAG kun en simpel ramme for at forbedre den digitale overholdelse af reglerne.

Den indeholder også et stærkt værktøj til at skabe inkluderende forretningsindhold: tilgængelige websites rangerer generelt bedre i søgeresultaterne og giver alle brugere med handicap en bedre oplevelse.

Overholdelse af WCAG betyder ganske enkelt at følge bedste praksis inden for design af webindhold og tage hensyn til handicappede brugeres oplevelse af dit indhold.

Derfor er digital tilgængelighed godt for forretningen

Som vi har forklaret ovenfor, er digital tilgængelighed et juridisk imperativ. Men det er bestemt ikke den eneste grund til at sørge for, at dit website, dit produkt eller din service er tilgængelig.

Jo mere tilgængelig dit site er, jo større er dit marked!

Det siger sig selv, at hvis mennesker med handicap kan få adgang til dit website, når du også ud til disse mennesker.

Hvis du sørger for, at dit website er WCAG-kompatibelt, er din rækkevidde meget større. Som social ansvarlig virksomhed ønsker man naturligvis at være tilgængelig for alle. Men mennesker uden handicap nyder også godt af bedre tilgængelighed.

Det hjælper dig med at dine kunder bliver ved med at være tilfredse og loyale.

WCAG 101: De fire grundlæggende principper for tilgængelighed

Nu, hvor vi har forklaret, hvorfor WCAG er vigtig, så lad os se på, hvordan den fungerer. Ved første øjekast kan WCAG virke overvældende – men den er opdelt i små, logiske retningslinjer, der er organiseret efter fire overordnede principper. Ved at gribe hvert af disse elementer an en efter en, kan du undgå forvirring og løbende forbedre tilgængeligheden.

Som vi har gjort opmærksom på, kan handicap påvirke folk på meget forskellige måder. Nogle mennesker med synshandicap bruger software til skærmlæsning, mens andre bruger en skærmforstørrer. Personer med neurokognitive lidelser kan ændre deres browserindstillinger for at se indhold i en bestemt skrifttype, mens personer med fysiske handicap måske foretrækker kun at bruge et tastatur til navigation.

Handicap påvirker mennesker på mange forskellige måder. Så hvordan kan et enkelt sæt standarder forbedre oplevelsen for stort set alle brugere med handicap?

WCAG’s succeskriterier er organiseret omkring fire grundlæggende principper, som skaber et stærkt fundament for tilgængeligt design. Ved at anvende disse principper, når du designer dit website (eller mobile apps eller ethvert andet digitalt produkt), skaber du bedre indhold.

Du bør ikke ignorere principperne for tilgængelighed. De er afgørende for at forstå og anvende WCAG’s anbefalinger. Når din virksomhed forpligter sig til disse principper, kan du opbygge en bæredygtig strategi.

Du kan huske de fire principper for tilgængelighed med huskereglen “POUR:” Indhold skal være opfatteligt (Percievable), brugbart (Operable), forståeligt (Understandable) og robust (Robust). Nedenfor giver vi WCAG’s definition af alle principperne sammen med vores fortolkning.

1. Opfattelig (Perceivable)

“Information og komponenter på brugergrænsefladen skal kunne præsenteres for brugerne på måder, de kan opfatte.”

Det betyder, at dit indhold ikke må være afhængigt af en enkelt type sanseopfattelse. Hvis dit website fx indeholder en video uden undertekster eller lydbeskrivelser, er den video ikke opfattelig for personer med synshandicap.

2. Brugbart (Operable)

“Komponenterne på brugergrænsefladen og navigationen skal kunne betjenes.”

Personer skal kunne betjene dit website, uanset hvilke metoder de vælger at bruge. Fx bruger mange mennesker et tastatur til at surfe på internettet (de bruger ikke en mus).

Hvis dit website ikke er tilgængelig for tastaturbrugere, er den ikke brugbar for disse brugere. Det kræver en interaktion, som de ikke kan udføre. Se eksempler på brugbar tastaturnavigation i vores guide til tastaturtilgængelighed for værktøjet ReadSpeaker webReader.

3. Forståeligt (Understandable)

“Information og betjening af brugergrænsefladen skal være forståelig.”

Lad os antage, at dit website er tilgængelig med et tastatur, men takket være noget fancy JavaScript skal brugerne trykke på Enter-tasten i stedet for Tab-tasten for at scrolle ned på siden.

Det er ikke godt for tilgængeligheden, fordi det ikke er det, brugerne forventer. Hvis du ikke giver klare instruktioner til brugeren, kan de ikke forstå, hvordan de skal betjene interfacet. I bedste fald bliver disse mennesker frustrerede over dit website – i værste fald kan du forhindre dem i at genvinde kontrollen over deres computer, indtil de gætter den rigtige kommando.

4. Robust

“Indholdet skal være robust nok til, at det kan fortolkes pålideligt af en bred vifte af brugeragenter, herunder hjælpemidler.”

Teknologiske hjælpemidler (AT) er hardware- og softwareenheder, der gør det muligt for mennesker med handicap at bruge internettet mere effektivt. Et almindeligt eksempel er skærmlæsningssoftware, som konverterer tekst til menneskelig tale ved hjælp af tekst-til-tale-teknologi (TTS) – og det er blot ét eksempel på denne teknologis mange anvendelsesmuligheder.

Indholdet er robust, hvis det bruger korrekt kode og opmærkning. Hvis dit website fx bruger semantisk HTML og WAI-ARIA (Web Accessibility Initiative – Accessible Rich Internet Applications) korrekt på en kompleks JavaScript-side, giver du dem, der bruger skærmlæsere, en bedre oplevelse. Der er også en god chance for, at dit website fungerer godt for folk, der bruger andre typer hjælpemidler – herunder teknologier, der endnu ikke er bredt tilgængelige.

Sådan anvender du WCAG på websites og mobile apps

Den bedste måde at bruge WCAG på er at henvise til retningslinjerne regelmæssigt, når du designer og udvikler dit indhold. Hvis du venter med at tænke på tilgængelighed, til dit website er publiceret, kommer du til at bruge mere tid (og flere penge) på at løse problemer. Når det er sagt, er der nogle enkle trin, du kan gennemgå for at forbedre tilgængeligheden for websites, der allerede er kørende – og mindst én stor fejl, du skal undgå.

Som vi nævnte tidligere i artiklen, er alle WCAG-succeskriterierne skrevet som en simpel bestået- ikke-bestået-erklæring. Lad os kigge på flere succeskriterier – og almindelige fejl, der kan gøre, at dit indhold ikke lever op til kravene.

WCAG 2.1 Succeskriterie 1.1.1: Ikke-tekst indhold (Non-Text Content)

“Alt ikke-tekst indhold, der præsenteres for brugeren, har et tekstalternativ, der opfylder det samme formål.”

Det allerførste WCAG-kriterie kræver et tekstalternativ til alt indhold, der ikke er tekst, med begrænsede undtagelser. Det er især vigtigt for billeder: Alle billeder skal indeholde alternativ tekst (også kaldet “alt text” eller “image alt tags”), der beskriver deres formål og funktion.

Manglende tekstalternativer er ofte citeret i retssager om webtilgængelighed, herunder Robles v. Domino’s Pizza LLC, en skelsættende sag, der bl.a. fastslog, at ADA gælder for onlineindhold.

For at opfylde dette kriterie skal du blot inkludere alternativ tekst til billeder, grafer, animationer og andre typer visuelt indhold.

WCAG 2.1 Succeskriterie 1.4.3: Kontrast (minimum) (Contrast (Minimum))

“Den visuelle præsentation af tekst og billeder med tekst har et kontrastforhold på mindst 4,5:1 […] Tekst i stor skala og billeder med tekst i stor skala har et kontrastforhold på mindst 3:1.”

Kontrastforholdet er forskellen i luminans (eller lys) mellem teksten og dens baggrund. Tekst med lav kontrast kan være svær at læse for nogle brugere, især for personer med farvesynsproblemer og andre synshandicap.

Farvekontrastproblemer er meget almindelige – men med lidt omtanke kan du nemt undgå denne fejl. Webdesignere bør teste kontrastforholdet mellem alle farvepar ved hjælp af gratis onlineværktøjer som a11y® Color Contrast Accessibility Validator.

WCAG 2.1 Succeskriterie 1.3.1: Info og relationer (Info And Relationships)

“Information, struktur og relationer, der formidles gennem præsentation, kan bestemmes programmatisk eller er tilgængelige i tekst.”

Programmatisk bestemt betyder, at informationen er tilgængelig for software. Hvis du fx har en webformular med obligatoriske felter, skal brugerne forstå, at felterne er obligatoriske. Hvis de ikke kan sende formularen afsted, fordi de mangler et af disse felter, skal deres software kunne fortælle dem hvorfor. Du kan kommunikere denne information til visuelle brugere ved at skitsere feltet med rødt, men folk, der ikke kan opfatte visuel information, har brug for en anden ledetråd. Der er en enkel måde at give den information på: Markér de obligatoriske felter med en stjerne, og inkluder derefter “obligatoriske felter markeret med en stjerne” i instruktionerne på formularen.

WCAG 2.1 Succeskriterie 2.4.4: Linkets formål (i kontekst) Link Purpose (In Context)

“Formålet med alle links kan bestemmes ud fra linkteksten alene eller ud fra linkteksten sammen med den programmatisk bestemte linkkontekst, undtagen hvis formålet med linket ville være tvetydigt for brugere generelt.”

Sagt forenklet skal folk kunne se på et hyperlink – eller høre ankerteksten med en skærmlæser – og afgøre, hvordan det fungerer. Hvis din linktekst lyder “klik her” eller “læs mere”, giver du ikke brugerne nok information. Linkteksten skal være beskrivende: Ikke “læs mere”, men “læs mere om X, Y eller Z.” Hvis vi fx linker til en artikel om kunstig intelligens i undervisningen, kan linkteksten ganske enkelt lyde “AI i undervisningen.” Det giver brugerne nok information til at beslutte, om de vil følge linket.

WCAG 2.1 Succeskriterie 1.2.2: Undertekster (forudindspillede) Captions (Prerecorded)

“Der leveres undertekster til alt forudindspillet lydindhold i synkroniserede medier, undtagen når mediet er et mediealternativ til tekst og er tydeligt mærket som sådan.”

Dette krav refererer generelt til multimedier – videoer, præsentationer og andet indhold, der kombinerer lyd og video.

Tekster gør det muligt for folk at forstå dine medier, selv om de ikke kan (eller vælger ikke at) høre lyden. Ved at bruge undertekster når du ud til et meget bredere publikum: En Facebook-undersøgelse viste, at videoannoncer med undertekster øger videoens visningstid med gennemsnitligt 12 %.

Det er blot nogle få eksempler på de næsten 80 succeskriterier, der findes i WCAG version 2.1. (Vi forklarer WCAG-versionerne i næste afsnit). Men uanset hvilket kriterie du ser på, er den bedste måde at afgøre succes på den samme: test af tilgængelighed.

Test af indhold for WCAG-overensstemmelse

Hvis et website af sig selv følger alle WCAG Level A- og AA-succeskriterier, anses det generelt for at være tilgængeligt for de fleste mennesker. For at finde ud af, om dit indhold overholder WCAG, skal du teste det op mod retningslinjerne – ofte.

Der kommer nye succeskriterier, med hver eneste nye WCAG-version, og derfor anbefaler W3C at teste indhold i forhold til de seneste officielle anbefalinger for optimal tilgængelighed.

Så hvilken version af WCAG skal du overholde? Det afhænger helt sikkert af, hvornår du læser dette, men når vi udgiver det (i februar 2023), er den gældende version WCAG 2.1, og WCAG 2.2 forventes at udkomme senere på året. Alle versioner af WCAG 2 er bagudkompatible. Det betyder, at WCAG 2.2 indeholder alle succeskriterierne fra WCAG 2.1.

I mellemtiden er WCAG 3.0 på et tidligt udkaststadie, mens vi publicerer, på en ubestemt frigivelsesdato sat “år” ude i fremtiden. Ifølge forfatterne introducerer WCAG 3 nye scoringsmekanismer, så den ikke er bagudkompatibel med WCAG 2.

To måder at teste WCAG-overensstemmelse på

WCAG 2.1 indeholder i alt 78 succeskriterier, og WCAG 2.2 forventes at introducere 9 nye succeskriterier. Hvordan kan du teste dit indhold i forhold til snesevis af krav?

De fleste eksperter inden for digital tilgængelighed anbefaler at bruge en kombination af to teknikker:

• Automatiserede audits bruger kunstig intelligens (AI) til at teste for visse WCAG-fejl. AI-test er billig og hurtig, men ikke så grundig som manuel test.
• Manuel test udføres af uddannede tilgængelighedseksperter. Ideelt set bør manuelle tests håndteres af personer med handicap eller stor erfaring med skærmlæsningssoftware og andre hjælpemidler.

Selvom automatiseret test er billigt, er det ikke perfekt: Nogle succeskriterier kræver menneskelig vurdering. Fx kan et AI-værktøj fortælle dig, om dine billeder har alternativ tekst – men det kan ikke bedømme, om din alt-tekst beskriver billedet præcist.

Når du bruger begge teknikker, kan du teste dit indhold grundigt, mens du holder dit budget intakt. Nedenfor giver vi et par ekstra tips til at teste dit indhold.

• Overlad ikke WCAG-test til en enkelt person eller et enkelt team. Det er ikke bæredygtigt; hvis personen stopper i din organisation, skal du starte forfra.
• Sørg for, at alle forstår målene for tilgængelighed. Alle medlemmer i dit team kan spille en rolle: Designerne skal vælge passende farvekombinationer; udviklerne skal skrive ren, AT-venlig kode; og indholdsforfatterne skal bruge underoverskrifter og lister (som denne) for at gøre indholdet læsbart.
• Test dine produkter ofte. Start med at teste i de første udviklingsfaser.
• Publicer en erklæring om tilgængelighed, der beskriver de skridt, du har taget, og dine langsigtede mål. Inkluder kontaktoplysninger, og lyt til den feedback, du får fra dine brugere.

Det er altid en god idé at være transparent i forhold til din indsats med tilgængelighed. Hvis du hyrer en tredjepart til at teste tilgængeligheden, skal du dele resultaterne frit. Her er fx ReadSpeakers seneste Accessibility Audit fra konsulentfirmaet ILUNION Accesibilidad S.A.

Og et andet eksempel: Her er den seneste tilgængelighedserklæring (Statement of Accessibility) vedr. ReadSpeakers webReader TTS-løsning.

Hvis du har planer om at tilbyde produkter eller services til amerikanske føderale agenturer, skal du også indsende en frivillig produkttilgængelighedsskabelon (Voluntary Product Accessibility Template, VPAT®). Dette dokument viser, at der er overensstemmelse med de føderale sektion 508-standarder for tilgængelighed. Er du nysgerrig for at se, hvordan det ser ud? Her er VPAT til webReader.

Det første skridt for at løse et tilgængelighedsproblem At forstå formålet

Når du læser WCAG igennem og tester dit indhold, finder du nok snesevis af problemer, som du skal løse, før du publicerer dit website eller et andet digitalt produkt.

Men nogle gange kan det at løse et problem afsløre en helt ny barriere for tilgængelighed. Det kan fx være nødvendigt at tilføje alternativ tekst til dine billeder; hvis dine beskrivelser ikke er nøjagtige – eller hvis de er ekstremt lange – forbedrer du faktisk ikke tilgængeligheden.

WCAG giver en vejledning i at adressere alle de succeskriterier, som du kan finde i WCAG 2.1 Understanding-dokumentationen. Når du omhyggeligt går ind i alle problemerne, forstår du formålet med alle kravene.

Før du løser en barriere for tilgængelighed, skal du stille dig selv et par hurtige spørgsmål:

• Hvorfor er det et problem?
• Hvordan påvirker det brugerne?
• Hvad er den bedste måde at løse problemet på?
• Hvordan vil det at løse problemet påvirke resten af mit indhold?

WCAG er mest effektiv, hvis du prioriterer digital tilgængelighed.
Når du stiller spørgsmål, hjælper du dig selv med at forstå hensigten med kravene (og undgå at rette de samme problemer igen og igen)..

Derfor er WCAG mere end en simpel tjekliste

Det er korrekt, at du kan forbedre den digitale compliance, når du opfylder alle WCAG Level A/AA succeskriterierne. Men målet med digital tilgængelighed er at give alle den bedst mulige oplevelse, og ikke at tjekke bokse af på en liste over standarder. For at skabe virkelig tilgængeligt digitalt indhold skal tilgængelighed være et styrende princip, der påvirker alle designbeslutninger, du træffer. Det er en stor forpligtelse.

Hvorfor skal du tage det ekstra skridt? Tilgængelighed er til gavn for alle – også folk, der ikke er handicappede eller har en tilstand, der påvirker deres internetadfærd. Igen og igen har vi set teknologier, der sætter tilgængelighed først, blive standardfunktioner for alle slags brugere.

Fx blev visning i højkontrast (“dunkel visning”) oprindeligt designet til at gøre tekst mere læselig for personer, der har farvesynsfejl, men de vandt hurtigt indpas hos millioner af brugere, der foretrækker en mørkere æstetik. Lukkede undertekster blev udviklet til personer med høretab, men mange mennesker – herunder 70% af generation Z-seerne—– foretrækker simpelthen at forbruge videoindhold med undertekster. Mere generelt anvendte kun 5% af de studerende i en undersøgelse teknologiske hjælpemidler på grund af et handicap, men det var 18 % af de studerende, der anså sådanne værktøjer for “nødvendige”.

Tekst-til-tale (Text to Speech, TTS) er nok det bedste eksempel på en forbedring af den digitale tilgængelighed, som har stor betydning for alle.

De første TTS-systemer blev udviklet til at stille skriftligt indhold til rådighed for mennesker med synshandicap, men nu er det en væsentlig del af det teknologiske landskab: Hvis du har talt med Alexa, Siri eller en anden vokal assistent i dag, har du brugt TTS. Skærmlæsningssoftware bruger også TTS, og feedback fra handicappede har hjulpet udbyderne med at skabe TTS stemmer med en nøjagtig og realistisk feedback.

Hos ReadSpeaker er vi forpligtet til at levere TTS-teknologi til alle. Det betyder at finde nye muligheder for at skabe engagerende onlineoplevelser.

Vi er også klar over, at digital tilgængelighed ikke slutter med WCAG. Når organisationer håndterer tilgængelighed som en kerneværdi og søger efter måder at udvide deres indhold på, får de rigtige brugere – og det gør virksomheder også. Folk er mere tilbøjelige til at støtte brands med stærke værdier, og over tid giver tilgængelighed et enormt Return on Investment (ROI). Hvis du har forpligtet dig til tilgængelighed, kan TTS fra ReadSpeaker hjælpe din virksomhed med at tage de næste skridt.