Gecontroleerd op 24-9-2026 · https://www.heise.de/
5 kritieke drempeln · daarnaast 2 te controleren.
Sinds de laatste scan: geen wijziging.
Hoe komt de score tot stand? (100 startpunten)
| 40 van 519 afbeeldingen zonder alt-attribuut | -18 |
| 4 formulierveld(en) zonder herkenbaar label | -18 |
| 16 link(s) zonder herkenbare naam in de HTML | -18 |
| 6 knop(pen) zonder naam in de HTML | -18 |
| 5 CSS-regeln met mogelijk te weinig tekstcontrast | -18 |
| Geen <h1>-kop in de geleverde HTML | -7 |
| 6 dubbele id-attributen | -7 |
| Resultaat | 0 / 100 |
Waarneembaar
40 van 519 afbeeldingen zonder alt-attribuut
Afbeeldingen die via JavaScript worden nageladen, zijn hier niet meegenomen.
<img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="3377" height="1898"><img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="1920" height="1079"><img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="3200" height="1798"><img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="300" height="250">
Dit zou je moeten doen: Elke <img> een alt geven: korte beschrijving bij betekenisdragende afbeeldingen, alt="" bij zuiver decoratieve.
4 formulierveld(en) zonder herkenbaar label
Controleer of er een via JavaScript ingesteld aria-label bestaat.
<input type="text" name="q" placeholder="Suchen"><input type="text" name="q" placeholder="Suchen"><select name="in"><input type="text" name="fs" placeholder="Im Preisvergleich suchen">
Dit zou je moeten doen: Elk veld verbinden met een <label for>-element of aria-label / aria-labelledby instellen. Alleen een placeholder is niet genoeg.
5 CSS-regeln met mogelijk te weinig tekstcontrast
Nodig: 4,5:1 (normaal) of 3:1 (grote tekst). Bij „aangenomen paginaachtergrond” kon de werkelijke achtergrond niet met zekerheid worden bepaald — controleer bij twijfel in de browser. Onder meer gevonden: `.dark a-gift-link dialog`: #e0e0e0 auf #fff (Vorfahren-Hintergrund) = 1.32:1 · `.a-android-native-app-prompt__close-banner`: #323232 auf rgba(0,0,0,0) = 1.64:1 · `a-opt-in[is-active] .opt-in__footnote`: #959595 auf #ffffff (Standard) (Seitenhintergrund, angenommen) = 3.00:1 · `.a-android-native-app-prompt__load-app`: #fff auf #27a209 = 3.36:1 · `a-topic .topic-label`: #fff auf #ed3725 = 4.06:1
.dark a-gift-link dialog, .a-android-native-app-prompt__close-banner, a-opt-in[is-active] .opt-in__footnote, .a-android-native-app-prompt__load-app, a-topic .topic-label
Dit zou je moeten doen: De tekstkleur donkerder maken of de achtergrond lichter maken tot de betreffende minimumwaarde is bereikt. Kleur nooit als enig onderscheidend kenmerk gebruiken.
Bedienbaar
16 link(s) zonder herkenbare naam in de HTML
Lege links of alleen een icoon/afbeelding zonder alt. Een via JavaScript ingesteld aria-label wordt hier niet herkend.
<a-click-performance><a name="topnavi.ho.magazine-nav.ct" class="hover:bg-brand dark:hover:<a name="topnavi.ho.magazine-nav.ix" class="hover:bg-brand-alternative<a name="topnavi.ho.magazine-nav.foto" class="hover:bg-brand dark:hove
Dit zou je moeten doen: Zichtbare linktekst toevoegen, of bij icoonlinks aria-label of een afbeelding met alt gebruiken.
6 knop(pen) zonder naam in de HTML
Knoppen zonder tekst en zonder aria-label zijn stom voor schermlezers — tenzij de naam via JavaScript wordt ingesteld.
<button class="scroll-left text-ho-text"><button class="scroll-right text-ho-text"><button class="scroll-left text-ho-text"><button class="scroll-right text-ho-text">
Dit zou je moeten doen: Knoptekst toevoegen of aria-label instellen.
Geen <h1>-kop in de geleverde HTML
Elke pagina zou met precies één h1 moeten beginnen. Bij pagina's die via JavaScript worden opgebouwd, kan de h1 pas in de browser ontstaan — controleer dan in de gerenderde DOM.
body
Dit zou je moeten doen: Een betekenisvolle <h1> als eerste kop invoegen (zo mogelijk al serverzijdig).
Robuust
6 dubbele id-attributen
bijv. heisetopnavi_search, HEI_M_Incontent-2-label, HEI_M_Incontent-2, circle. Breekt label-for- en aria-koppelingen.
[id]
Dit zou je moeten doen: Id's uniek toekennen.
Volgende stappen
- 40 van 519 afbeeldingen zonder alt-attribuut. Elke <img> een alt geven: korte beschrijving bij betekenisdragende afbeeldingen, alt="" bij zuiver decoratieve.
- 4 formulierveld(en) zonder herkenbaar label. Elk veld verbinden met een <label for>-element of aria-label / aria-labelledby instellen. Alleen een placeholder is niet genoeg.
- 16 link(s) zonder herkenbare naam in de HTML. Zichtbare linktekst toevoegen, of bij icoonlinks aria-label of een afbeelding met alt gebruiken.
- 6 knop(pen) zonder naam in de HTML. Knoptekst toevoegen of aria-label instellen.
- 5 CSS-regeln met mogelijk te weinig tekstcontrast. De tekstkleur donkerder maken of de achtergrond lichter maken tot de betreffende minimumwaarde is bereikt. Kleur nooit als enig onderscheidend kenmerk gebruiken.
Wekelijkse herscan, JS-gerenderd, e-mail bij nieuwe drempels — komt binnenkort.
Toegankelijkheidsverklaring maken →
Methode & grenzen
Op 24-9-2026 is de HTML gecontroleerd die www.heise.de bij het eerste bezoek zonder inloggen levert, plus maximaal vier gekoppelde CSS-bestanden van hetzelfde domein. Gecontroleerd: kleurcontrast (uit de CSS), tekstalternatieven, formulierlabels, namen van bedieningselementen, koppenstructuur, paginatitel en -taal, zoomblokkering, dubbele id's, positieve tabindex-waarden, landmarks.
Niet gecontroleerd: alles wat via JavaScript ontstaat, toetsenbordbediening, zichtbare focus, focusvolgorde, schermlezeraankondiging, inhoud achter een login, subpagina's. De automatische test vindt ruwweg 20–35 % van de WCAG-schendingen — de rest vereist een handmatige controle. Momentopname, geen juridisch oordeel.
Overlay-widgets (toegankelijkheidsknoppen die contrast of lettertype wijzigen) maken een site niet conform — de gevonden barrières moeten in de broncode worden opgelost. Waarom overlays niet helpen