# Toegankelijkheidsproblemen waarop we testen Elke pagina legt één probleem uit dat onze geautomatiseerde tests vinden: wat het betekent, met welk WCAG-criterium het samenhangt, hoe je het oplost op elke site, in Shopify en in WooCommerce, en hoe je de oplossing controleert. ## Toegankelijkheidsproblemen - [Een met ARIA verborgen element mag niet focusbaar zijn en geen focusbare elementen bevatten](https://www.fixreports.com/nl/issues/aria-hidden-focus): WCAG 4.1.2 · Niveau A. Focusbare elementen zijn verborgen voor schermlezers, maar zijn nog wel met het toetsenbord te bereiken. (ARIA-attributen en -rollen) - [Het autocomplete-attribuut moet correct worden gebruikt](https://www.fixreports.com/nl/issues/autocomplete-valid): WCAG 1.3.5 · Niveau AA. Een formulierveld gebruikt een autocomplete-waarde die browsers niet herkennen. (Formuliervelden zonder label) - [Knoppen moeten herkenbare tekst hebben](https://www.fixreports.com/nl/issues/button-name): WCAG 4.1.2 · Niveau A. Sommige knoppen hebben geen toegankelijke naam, waardoor gebruikers van een schermlezer alleen ‘knop’ horen. (Links en knoppen zonder naam) - [Elementen moeten voldoen aan de minimale drempelwaarden voor kleurcontrast](https://www.fixreports.com/nl/issues/color-contrast): WCAG 1.4.3 · Niveau AA. Sommige tekst steekt niet genoeg af tegen de achtergrond om leesbaar te zijn voor slechtziende mensen. (Te weinig kleurcontrast) - [Documenten moeten een -element hebben als hulp bij het navigeren](https://www.fixreports.com/nl/issues/document-title): WCAG 2.4.2 · Niveau A. Een pagina heeft geen titel, waardoor gebruikers niet weten op welke pagina ze zijn. (Paginatitels) - [Id’s die in ARIA en labels worden gebruikt, moeten uniek zijn](https://www.fixreports.com/nl/issues/duplicate-id-aria): WCAG 4.1.2 · Niveau A. Meerdere elementen delen een id die iets labelt of beschrijft, waardoor hulptechnologie misschien het verkeerde label voorleest. (ARIA-attributen en -rollen) - [Frames moeten een toegankelijke naam hebben](https://www.fixreports.com/nl/issues/frame-title): WCAG 4.1.2 · Niveau A. Een ingesloten frame (vaak een kaart, video of app-widget) heeft geen titel, waardoor gebruikers van een schermlezer niet weten wat erin staat. (Paginastructuur, koppen en landmarks) - [Kopniveaus zouden steeds maar met één moeten oplopen](https://www.fixreports.com/nl/issues/heading-order): Best practice voor toegankelijkheid. Kopniveaus worden overgeslagen (bijvoorbeeld van H2 naar H4), waardoor de paginastructuur verwarrend is voor gebruikers van een schermlezer. (Paginastructuur, koppen en landmarks) - [Het <html>-element moet een lang-attribuut hebben](https://www.fixreports.com/nl/issues/html-has-lang): WCAG 3.1.1 · Niveau A. De pagina geeft haar taal niet op, waardoor schermlezers haar misschien met de verkeerde uitspraak voorlezen. (Taal van de pagina) - [Het <html>-element moet een geldige waarde voor het lang-attribuut hebben](https://www.fixreports.com/nl/issues/html-lang-valid): WCAG 3.1.1 · Niveau A. De taalcode van de pagina is ongeldig, waardoor schermlezers niet de juiste stem kunnen kiezen. (Taal van de pagina) - [Afbeeldingen moeten een tekstalternatief hebben](https://www.fixreports.com/nl/issues/image-alt): WCAG 1.1.1 · Niveau A. Afbeeldingen missen een tekstalternatief, waardoor gebruikers van een schermlezer niet weten wat ze tonen. (Afbeeldingen zonder tekstalternatief) - [Invoerknoppen moeten herkenbare tekst hebben](https://www.fixreports.com/nl/issues/input-button-name): WCAG 4.1.2 · Niveau A. Een invoerknop heeft geen tekst, waardoor schermlezers niet kunnen zeggen wat hij doet. (Formuliervelden zonder label) - [Afbeeldingsknoppen moeten een tekstalternatief hebben](https://www.fixreports.com/nl/issues/input-image-alt): WCAG 1.1.1, 4.1.2 · Niveau A. Een afbeeldingsknop heeft geen alt-tekst, waardoor schermlezers niet kunnen zeggen wat hij doet. (Afbeeldingen zonder tekstalternatief) - [Formulierelementen moeten een label hebben](https://www.fixreports.com/nl/issues/label): WCAG 4.1.2 · Niveau A. Sommige formuliervelden hebben geen label, waardoor gebruikers van een schermlezer niet weten wat ze moeten invullen. (Formuliervelden zonder label) - [Een document zou één main-landmark moeten hebben](https://www.fixreports.com/nl/issues/landmark-one-main): Best practice voor toegankelijkheid. De pagina heeft geen main-landmark, waardoor gebruikers van een schermlezer niet direct naar de inhoud kunnen springen. (Paginastructuur, koppen en landmarks) - [Links moeten te onderscheiden zijn zonder afhankelijk te zijn van kleur](https://www.fixreports.com/nl/issues/link-in-text-block): WCAG 1.4.1 · Niveau A. Links in alinea’s vallen alleen op door hun kleur, waardoor mensen die het kleurverschil niet zien ze missen. (Te weinig kleurcontrast) - [Links moeten herkenbare tekst hebben](https://www.fixreports.com/nl/issues/link-name): WCAG 2.4.4, 4.1.2 · Niveau A. Sommige links hebben geen tekst die een schermlezer kan voorlezen, vaak links met alleen een icoon, zoals social-media-iconen of het winkelwagenicoon. (Links en knoppen zonder naam) - [Zoomen en schalen mogen niet zijn uitgeschakeld](https://www.fixreports.com/nl/issues/meta-viewport): WCAG 1.4.4 · Niveau AA. De pagina blokkeert knijpzoomen op mobiel. (Zoomen en reflow) - [Een pagina zou een kop van niveau 1 moeten bevatten](https://www.fixreports.com/nl/issues/page-has-heading-one): Best practice voor toegankelijkheid. De pagina heeft geen kop op het hoogste niveau. (Paginastructuur, koppen en landmarks) - [Alle content van de pagina zou binnen landmarks moeten staan](https://www.fixreports.com/nl/issues/region): Best practice voor toegankelijkheid. Sommige content staat niet in een landmark van de pagina (header, nav, main of footer). (Paginastructuur, koppen en landmarks) - [Elementen met [role="img"] of [role="image"] moeten een tekstalternatief hebben](https://www.fixreports.com/nl/issues/role-img-alt): WCAG 1.1.1 · Niveau A. Een element dat als afbeelding wordt gepresenteerd, heeft geen tekstalternatief. (Afbeeldingen zonder tekstalternatief) - [Een scrollbaar gebied moet met het toetsenbord bereikbaar zijn](https://www.fixreports.com/nl/issues/scrollable-region-focusable): WCAG 2.1.1 · Niveau A. Een scrollbaar gebied is niet met het toetsenbord te bereiken, waardoor toetsenbordgebruikers het niet kunnen scrollen. (Toetsenbordtoegang en focus) - [Een keuzelijst (select-element) moet een toegankelijke naam hebben](https://www.fixreports.com/nl/issues/select-name): WCAG 4.1.2 · Niveau A. Een keuzelijst (vaak een sorteer- of variantkiezer) heeft geen label. (Formuliervelden zonder label) - [<svg>-elementen met de rol img of image moeten een tekstalternatief hebben](https://www.fixreports.com/nl/issues/svg-img-alt): WCAG 1.1.1 · Niveau A. Een SVG-afbeelding die informatie overbrengt, heeft geen tekstalternatief. (Afbeeldingen zonder tekstalternatief) - [Alle aanraakdoelen moeten 24px groot zijn of voldoende ruimte laten](https://www.fixreports.com/nl/issues/target-size): WCAG 2.5.8 · Niveau AA. Sommige aanraakdoelen zijn kleiner dan 24 bij 24 pixels en staan te dicht bij elkaar, waardoor ze op een telefoon moeilijk te raken zijn. (Toetsenbordtoegang en focus)