Gratis værktøj: Tilgængelighed

WCAG 2.2-tjek af din hjemmeside

Se, hvor din hjemmeside står på hvert af de 55 succeskriterier i WCAG 2.2 niveau A og AA. Hvert kriterium får én af fire statusser, så du kan se, hvad de automatiske test dækkede, og hvad et menneske stadig skal tjekke.

Gratis. Tester op til fem vigtige sider på cirka et minut.

Det tjekker værktøjet

  • Alle kriterier på niveau A og AA

    Alle 55 kriterier, 31 på niveau A og 24 på niveau AA, i WCAG-rækkefølge med nummer og navn. 4.1.1 Parsing er udeladt, fordi WCAG 2.2 betegner det som forældet.

  • Automatiske resultater koblet til kriterierne

    Reglerne i axe-core kører på den side, du indtaster, og op til fire andre vigtige sider, og hvert resultat knyttes til de succeskriterier, som reglen tester. Et kriterium fejler, når en af dets regler fejler på en af de testede sider.

  • Resultater fra tastaturtesten

    En Tab-test med 40 tryk på den første side bidrager til 2.1.2 No Keyboard Trap og, som en heuristik vist til gennemgang, til 2.4.7 Focus Visible.

  • Uafklarede resultater holdes for sig

    Når en regel ikke kan nå frem til en afgørelse, for eksempel ved tekst over et billede, viser dens kriterier Skal gennemgås i stedet for bestået eller fejlet.

  • Synlige huller i stedet for en score

    Kriterier, som ingen automatisk regel dækker, markeres som Manuelt tjek (Manual check). Intet bliver regnet sammen til en procentsats, der ville skjule, hvad der ikke blev testet.

Det kan det ikke tjekke

  • Afgøre kriterier, der kræver menneskelig vurdering, for eksempel 1.4.10 Reflow, 1.4.11 Non-text Contrast, kriterierne under 1.2 om undertekster og synstolkning og 3.3.1 til 3.3.4 om fejl i formularer.
  • Gøre »Ingen automatiske fejl (No automated failures)« til et bestået. En regel, der kørte og bestod, dækker kun det, som netop den regel tester.
  • Udarbejde en erklæring om overensstemmelse, en tilgængelighedserklæring eller en VPAT. Overensstemmelse vurderes af mennesker ud fra hele sider og komplette forløb.
  • Teste niveau AAA eller sider ud over de fem i scanningen.
  • Nå trinene bag et login eller i et checkout-forløb, hvor kriterier som 3.3.7 Redundant Entry og 3.3.8 Accessible Authentication typisk gælder.

Hvorfor det er vigtigt

WCAG er formuleret som succeskriterier, og det er sådan, auditører, indkøbere og tilgængelighedserklæringer beskriver en hjemmeside. En liste over fejlende regler fortæller dig, hvad du skal rette. Et overblik over kriterierne fortæller dig, hvad du allerede kan sige om hjemmesiden, og hvad du endnu ikke kan sige.

Automatiske værktøjer berører under halvdelen af kriterierne på niveau A og AA: axe-core kobler sine regler til omkring 25 af de 55. For resten findes der ingen pålidelig automatisk test. Software kan ikke afgøre, om en fejlmeddelelse foreslår en rettelse (3.3.3), eller om en side stadig fungerer ved en bredde på 320 CSS-pixels (1.4.10). Når de står som manuelle tjek, kan du se, hvor der stadig skal testes.

Selv et kriterium uden automatiske fejl kan fejle. Reglerne for 1.1.1 Non-text Content tjekker, at et billede har alt-tekst; de kan ikke se, at alt="IMG_2041.jpg" er ubrugelig for en person, der ikke kan se billedet.

Sådan læser du resultaterne

Fejlet
Mindst én automatisk regel knyttet til dette kriterium fejlede på en testet side. Det er et sikkert problem; tilgængelighedstjekket viser elementerne og siderne bag det.
Skal gennemgås
Et automatisk tjek markerede noget, det ikke kunne afgøre, for eksempel kontrasten for tekst på en farveovergang. Et menneske skal se på elementet.
Ingen automatiske fejl
Mindst én regel i axe-core, der er knyttet til kriteriet, kørte og bestod. Det er ikke det samme som overensstemmelse: reglerne dækker kun en del af det, kriteriet kræver.
Ikke udløst
Der findes automatiske regler for dette kriterium, men intet på de testede sider gav dem noget at tjekke, for eksempel ingen video til reglerne om undertekster eller ingen formularer til reglerne om labels. Test det manuelt, hvis din hjemmeside har den slags indhold andre steder.
Manuelt tjek
Ingen automatisk regel dækker dette kriterium, så scanningen siger hverken det ene eller det andet om det. Test det manuelt.
Niveau A og niveau AA
Niveau A er minimum. Politikker og krav, der henviser til WCAG, nævner som regel niveau AA, som omfatter alle kriterier på niveau A.

Sådan retter du de mest almindelige problemer

  • 4.1.2 Name, Role, Value fejlede

    Specialbyggede kontroller lavet af div- eller span-elementer (menuer, faner, foldemenuer, til/fra-knapper) fortæller ikke hjælpemidler, hvad de er, eller om de er åbne. Brug en native <button>, hvor det er muligt, giv den et navn, og sæt aria-expanded eller aria-pressed, så dens tilstand bliver læst op.

  • 1.3.1 Info and Relationships fejlede

    Strukturen skal ligge i markuppen, ikke kun i stylingen. Brug rigtige h2- og h3-elementer i stedet for afsnit med fed skrift, ul eller ol til lister, th med scope til tabeloverskrifter og labels eller fieldset med legend til grupper af formularfelter.

  • 3.1.1 Language of Page fejlede

    Tilføj en lang-attribut til html-elementet, for eksempel <html lang="en">. WordPress-temaer skriver den normalt ud med language_attributes(); i et Shopify-tema bruger du <html lang="{{ request.locale.iso_code }}"> i layout/theme.liquid.

  • 2.5.8 Target Size (Minimum) fejlede

    Små ikoner og tætpakkede links er svære at ramme med en finger. Gør hver klikflade mindst 24 × 24 CSS-pixels, eller giv små klikflader så meget afstand, at en cirkel på 24 px centreret på hver af dem ikke overlapper en anden klikflade. Padding gør klikfladen større uden at ændre ikonet.

  • Sådan kommer du igennem de manuelle tjek

    Start med de hurtige. Til 1.4.10 Reflow zoomer du et 1280 px bredt browservindue til 400 % og tjekker, at intet kræver vandret scrolling. Til 2.4.7 og 2.4.11 tabber du gennem siden og tjekker, at fokus altid er synligt og aldrig gemmer sig bag en fastgjort header eller et cookiebanner. Til 3.3.1 sender du en formular med fejl og ser, om fejlene er tydeligt beskrevet i tekst.

Spørgsmål om værktøjet

Hvad er nyt på niveau A og AA i WCAG 2.2?

Der er kommet seks nye kriterier: 2.4.11 Focus Not Obscured (Minimum), 2.5.7 Dragging Movements, 2.5.8 Target Size (Minimum), 3.2.6 Consistent Help, 3.3.7 Redundant Entry og 3.3.8 Accessible Authentication (Minimum). WCAG 2.2 tilføjer også tre kriterier på niveau AAA og fjerner 4.1.1 Parsing.

Hvorfor står 4.1.1 Parsing ikke på listen?

WCAG 2.2 betegner 4.1.1 Parsing som forældet og fjerner det, fordi browsere og hjælpemidler ikke længere er afhængige af de markupfejl, det dækkede. W3C bemærker, at det for WCAG 2.0 og 2.1 nu betragtes som altid opfyldt for HTML-indhold.

Hvis jeg lever op til WCAG 2.2, dækker det så også WCAG 2.1?

Ja. WCAG 2.2 er bagudkompatibel: indhold, der lever op til 2.2, lever også op til 2.1 og 2.0. En test mod 2.2 dækker derfor også de ældre versioner, som mange politikker stadig henviser til.

Kan jeg bruge det til at skrive en tilgængelighedserklæring eller en VPAT?

Det er et udgangspunkt, ikke en rapport om overensstemmelse. En erklæring eller en VPAT kræver, at alle kriterier bliver vurderet, de fleste af et menneske; listerne Manuelt tjek (Manual check) og Skal gennemgås viser, hvilke der stadig mangler det.

Hvorfor står der »Manuelt tjek« ved så mange kriterier?

Fordi der ikke findes nogen automatisk regel for dem. Spørgsmål som om en tidsgrænse kan forlænges, om hjælp vises samme sted på hver side, eller om et login kræver en hukommelsestest, afhænger af, hvordan folk bruger hjemmesiden, og ikke af markup, som en regel kan læse.

Kilder

Relaterede værktøjer

Tilgængelighedsrapport ($174, engangsbetaling) bygger videre på den fulde gratis scanning og tilføjer flere sider, ændringen til hvert fund, en PDF og gentests, så du kan bekræfte dine rettelser.

Om Tilgængelighedsrapport