{n} av {total} bilder utan alt-attribut

Bilder som laddas in via JavaScript ingår inte här.

• <img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="3072" height="1726">
• <img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="4032" height="2266">
• <img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="1672" height="940">
• <img src="data:image/svg+xml;base64,PD94bWwgdmVyc2" width="300" height="250">

Det här bör du göra: Ge varje <img> ett alt: kort beskrivning för meningsbärande bilder, alt="" för rent dekorativa.

{n} formulärfält utan igenkännbar märkning

Kontrollera om det finns ett aria-label som satts via JavaScript.

• <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">

Det här bör du göra: Koppla varje fält till ett <label for>-element eller ange aria-label / aria-labelledby. Enbart en placeholder räcker inte.

{n} CSS-regel{nPlural} med möjligen för låg textkontrast

Krävs: 4,5:1 (normal) respektive 3:1 (stor text). Vid ”antagen sidbakgrund” kunde den faktiska bakgrunden inte fastställas säkert — kontrollera i webbläsaren vid tveksamhet. Hittat bland annat: {examples}

.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

Det här bör du göra: Gör textfärgen mörkare eller bakgrunden ljusare tills respektive minimivärde uppnås. Använd aldrig färg som enda särskiljande kännetecken.

{n} länk(ar) utan igenkännbart namn i HTML-koden

Tomma länkar eller bara en ikon/bild utan alt. Ett aria-label som satts via JavaScript känns inte igen här.

• <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

Det här bör du göra: Lägg till synlig länktext, eller använd aria-label eller en bild med alt för ikonlänkar.

{n} knapp(ar) utan namn i HTML-koden

Knappar utan text och utan aria-label är stumma för skärmläsare — om inte namnet sätts via JavaScript.

• <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">

Det här bör du göra: Lägg till knapptext eller ange aria-label.

Ingen <h1>-rubrik i den levererade HTML-koden

Varje sida bör börja med exakt en h1. På sidor som byggs upp via JavaScript kan h1 uppstå först i webbläsaren — kontrollera då i den renderade DOM:en.

body

Det här bör du göra: Infoga en meningsfull <h1> som första rubrik (helst redan på serversidan).

{n} dubbletta id-attribut

t.ex. {examples}. Bryter label-for- och aria-kopplingar.

[id]

Det här bör du göra: Tilldela unika id.