Anleitungen: die 55 Barrieren, nach denen wir suchen, und wie sie behoben werden

Jede Barriere in verständlicher Sprache erklärt: wen sie ausschließt, was sie kostet und wie sie behoben wird — mit dem Code davor und danach.

• Bilder ohne Alternativtext

  Kritisch · WCAG 1.1.1

  Einige Bilder haben kein alt-Attribut.

• Formularfelder ohne Beschriftung

  Kritisch · WCAG 1.3.1

  Einige Formularfelder haben keinen zugänglichen Namen: kein <label>, kein aria-label, kein aria-labelledby.

• Grafische Schaltfläche ohne Alternativtext

  Kritisch · WCAG 1.1.1

  Es gibt ein <input type="image"> ohne alt.

• Links ohne Namen

  Kritisch · WCAG 2.4.4

  Einige Links haben keinen sichtbaren Text und keinen zugänglichen Namen.

• Schaltflächen ohne Namen

  Kritisch · WCAG 4.1.2

  Einige Schaltflächen haben keinen sichtbaren Text und keinen zugänglichen Namen.

• Alternativtext ohne Informationsgehalt

  Schwerwiegend · WCAG 1.1.1

  Einige Bilder haben als Alternativtext einen Dateinamen, einen Code oder ein allgemeines Wort wie „Bild“ oder „Foto“.

• Anklickbares Element, per Tastatur nicht erreichbar

  Schwerwiegend · WCAG 2.1.1

  Es gibt ein <{tag}> mit einem Klick-Handler, aber ohne Rolle und ohne Platz in der Tabulatorreihenfolge.

• ARIA-Verweis auf eine id, die es nicht gibt

  Schwerwiegend · WCAG 4.1.2

  Das Attribut {attr} verweist auf die ids {ids}, die auf der Seite nicht vorhanden sind.

• Bereich einer Bildkarte ohne Namen

  Schwerwiegend · WCAG 1.1.1

  In einer Bildkarte gibt es ein <area> ohne Alternativtext.

• Bewegter Inhalt, der sich nicht anhalten lässt

  Schwerwiegend · WCAG 2.2.2

  Die Seite verwendet <marquee> oder <blink>.

• Datentabelle ohne Kopfzellen

  Schwerwiegend · WCAG 1.3.1

  Es gibt eine Tabelle mit Daten, aber ohne <th>-Zellen.

• Der Platzhalter übernimmt die Aufgabe der Beschriftung

  Schwerwiegend · WCAG 3.3.2

  Einige Felder beziehen ihren einzigen zugänglichen Namen aus dem placeholder-Attribut.

• Die Fokusanzeige ist abgeschaltet

  Schwerwiegend · WCAG 2.4.7

  Das CSS entfernt die Fokusumrandung ({selector}), ohne etwas Sichtbares an ihre Stelle zu setzen.

• Die Seite hat keine Überschriften

  Schwerwiegend · WCAG 1.3.1

  Es gibt umfangreichen Inhalt, aber überhaupt keine Überschriften.

• Die Seite verhindert das Vergrößern

  Schwerwiegend · WCAG 1.4.4

  Das viewport-Tag blockiert den Zoom ({value}).

• Eingebetteter Rahmen ohne Titel

  Schwerwiegend · WCAG 4.1.2

  Es gibt ein <iframe> ohne title-Attribut.

• Element als dekorativ ausgezeichnet, tatsächlich aber interaktiv

  Schwerwiegend · WCAG 4.1.2

  Ein Element mit role="presentation" oder role="none" kann den Fokus erhalten oder hat einen Namen.

• Element mit interaktiver Rolle, aber ohne Namen

  Schwerwiegend · WCAG 4.1.2

  Ein Element hat role="{role}" und keinen zugänglichen Namen.

• Inhalt für Screenreader ausgeblendet, aber per Tastatur erreichbar

  Schwerwiegend · WCAG 4.1.2

  Ein Element mit aria-hidden="true" enthält Elemente, die den Fokus erhalten können.

• Keine Barrierefreiheitserklärung gefunden

  Schwerwiegend

  Auf dieser Seite haben wir keinen Verweis auf Informationen zur Barrierefreiheit gefunden.

• Links ohne Ziel, per JavaScript gesteuert

  Schwerwiegend · WCAG 2.1.1

  Es gibt <a>-Elemente ohne href, die dennoch auf Klicks reagieren.

• Seitentitel fehlt oder ist leer

  Schwerwiegend · WCAG 2.4.2

  Die Seite hat kein <title>, oder es ist zu kurz, um sie zu identifizieren.

• Sprache des Dokuments fehlt

  Schwerwiegend · WCAG 3.1.1

  Das <html>-Element gibt keine gültige Sprache an.

• Ton, der von selbst abspielt

  Schwerwiegend · WCAG 1.4.2

  Es gibt ein <{tag}> mit autoplay und ohne Stummschaltung.

• Video ohne Untertitel

  Schwerwiegend · WCAG 1.2.2

  Es gibt ein <video> ohne Untertitelspur.

• Zeitgesteuerte automatische Weiterleitung

  Schwerwiegend · WCAG 2.2.1

  Die Seite leitet sich nach einer Wartezeit selbst weiter ({content}).

• Zu geringer Farbkontrast

  Schwerwiegend · WCAG 1.4.3

  Es gibt Text in {fontSize} mit einem Kontrastverhältnis von {ratio} zum Hintergrund, während die Norm {required} verlangt.

• Audio ohne auffindbares Transkript

  Mittel · WCAG 1.2.1

  Auf der Seite gibt es ein <audio>-Element. Ob ein Transkript existiert, können wir nicht automatisch prüfen.

• Bedeutungstragendes SVG-Symbol ohne Namen

  Mittel · WCAG 1.1.1

  Es gibt ein SVG, das als Grafik ausgezeichnet ist (role="img") oder auf andere Weise einen Namen haben sollte, aber keinen zugänglichen Namen hat.

• Bereich für den Hauptinhalt fehlt

  Mittel · WCAG 1.3.1

  Die Seite hat kein <main> — oder mehr als eines.

• Das title-Attribut übernimmt die Aufgabe der Beschriftung

  Mittel · WCAG 4.1.2

  Einige Bedienelemente beziehen ihren einzigen Namen aus dem title-Attribut.

• Die Erklärung nennt keinen Weg, eine Barriere zu melden

  Mittel

  Wir haben Ihre Barrierefreiheitserklärung gefunden, aber keinen klaren Kanal, um ein Problem zu melden.

• Ein Barrierefreiheits-Overlay ist installiert

  Mittel

  Diese Seite lädt ein Barrierefreiheits-Overlay von {vendor}.

• Eingebetteter Inhalt ohne Namen und ohne Ersatzinhalt

  Mittel · WCAG 1.1.1

  Es gibt ein <object> oder <embed> ohne zugänglichen Namen und ohne Ersatzinhalt darin.

• Felder für persönliche Daten ohne autocomplete

  Mittel · WCAG 1.3.5

  Einige Felder, die gängige persönliche Daten abfragen (E-Mail, Telefon, Anschrift), haben kein autocomplete-Attribut.

• Hauptüberschrift fehlt oder ist mehrfach vorhanden

  Mittel · WCAG 1.3.1

  Die Seite hat keine h1 — oder mehrere.

• Leere Überschriften

  Mittel · WCAG 1.3.1

  Einige Überschriften enthalten keinen Text.

• Links mit nichtssagendem Text

  Mittel · WCAG 2.4.4

  Einige Links lauten „weiterlesen“, „hier klicken“, „mehr erfahren“ oder ähnlich.

• Nicht existierende ARIA-Rolle

  Mittel · WCAG 4.1.2

  Ein Element hat role="{role}", was keine gültige Rolle ist.

• Nicht existierendes ARIA-Attribut

  Mittel · WCAG 4.1.2

  Ein Element hat das Attribut {attr}, das nicht Teil der Spezifikation ist.

• Optionsgruppe ohne Gruppenbeschriftung

  Mittel · WCAG 1.3.1

  Zusammengehörige Kontrollkästchen oder Optionsfelder stehen nicht in einem <fieldset> mit <legend>.

• Pflichtfeld nur optisch gekennzeichnet

  Mittel · WCAG 3.3.2

  Die Beschriftung weist das Feld als Pflichtfeld aus (mit Sternchen oder in Worten), das Feld selbst erklärt aber weder required noch aria-required.

• Positiver tabindex-Wert

  Mittel · WCAG 2.4.3

  Einige Elemente verwenden tabindex="{value}".

• Sprunglink zum Inhalt fehlt

  Mittel · WCAG 2.4.1

  Die Seite hat eine umfangreiche Navigation, aber keinen Link, um sie zu überspringen.

• Überschriftenebenen übersprungen

  Mittel · WCAG 1.3.1

  Die Seite springt von einer Überschriftenebene zur nächsten und lässt die dazwischenliegenden aus (h{from} auf h{to}).

• Bereichsauszeichnungen fehlen

  Gering · WCAG 1.3.1

  Die Seite zeichnet einige ihrer Hauptbereiche nicht aus: {missing}.

• Doppelte ids

  Gering · WCAG 4.1.1

  Die id „{id}“ kommt {count}-mal vor.

• Doppelte Tastenkürzel

  Gering · WCAG 2.1.1

  Das Tastenkürzel „{key}“ ist {count} Elementen zugewiesen.

• Extrem kleiner Text

  Gering · WCAG 1.4.4

  Es gibt Text unter 10 px ({fontSize}).

• Links, die die vollständige Adresse anzeigen

  Gering · WCAG 2.4.4

  Einige Links verwenden eine lange Adresse als sichtbaren Text.

• Links, die ohne Hinweis ein neues Fenster öffnen

  Gering · WCAG 3.2.5

  Einige Links verwenden target="_blank", ohne darauf hinzuweisen, dass sich ein neuer Tab öffnet.

• Listenpunkte außerhalb einer Liste

  Gering · WCAG 1.3.1

  Es gibt <li>-Elemente, deren übergeordnetes Element weder <ul> noch <ol> ist.

• Nicht ausgezeichneter Text in einer anderen Sprache

  Gering · WCAG 3.1.2

  Einige Links verweisen auf eine andere Sprache (hreflang="{hreflang}"), ohne die Sprache ihres eigenen Textes anzugeben.

• Redundanter Alternativtext

  Gering

  Einige Bilder haben einen Alternativtext, der danebenstehenden Text wiederholt oder mit „Bild von“ beginnt.

• Tabelle ohne Titel

  Gering · WCAG 1.3.1

  Es gibt eine Datentabelle ohne <caption> und ohne zugänglichen Namen.