HTML-Barrierefreiheitsprüfung

Die meisten schnellen Barrierefreiheits-Checks sind entweder ein oberflächlicher Stichwortscan oder ein unüberschaubares, schwergewichtiges Framework, dem man als Blackbox vertrauen muss. Dieses Tool geht einen dritten Weg: Es parst das eingefügte HTML mit dem browser-eigenen DOMParser – kein axe-core, keine externe Barrierefreiheits-Bibliothek, keine Downloads – und durchläuft den entstandenen DOM-Baum mit einem Satz handgeschriebener Prüfungen, die reale, häufige WCAG-2.1-Fehlerquellen abbilden. Damit ist die Logik vollständig nachvollziehbar und das Audit läuft komplett in Ihrem Browser: Das eingefügte Markup und alle getesteten Farbpaare werden niemals hochgeladen oder irgendwohin gesendet.

Die Prüfungen decken die Fehler ab, die in echten Seiten am häufigsten auftauchen: <img>-Elemente gänzlich ohne Alt-Attribut (ein echter WCAG-Verstoß, im Unterschied zum bewusst leeren alt="" für dekorative Bilder, das korrekterweise nicht beanstandet wird), Formularsteuerelemente ohne Möglichkeit für assistive Technologien, deren Zweck zu erkennen (geprüft wird jeder reale Pfad zu einer Beschriftung – ein passendes <label for>, Umschließung durch ein <label> oder ein aria-label-/aria-labelledby-Attribut), unvermittelte Überschriftenebenen-Sprünge (von <h1> direkt zu <h3> oder ein Dokument ohne oder mit mehr als einem <h1>), Links ohne href oder mit nichtssagenden, kontextlosen Texten wie ‚Hier klicken‘ oder ‚Weiterlesen‘ sowie ein fehlendes lang-Attribut, wenn ein vollständiges HTML-Dokument (nicht nur ein Fragment) eingefügt wird.

Das herausragende Element ist die korrekte Kontrastberechnung und keine oberflächliche ‚sieht lesbar aus‘-Heuristik. Für jedes Element mit inline color und background-color liest das Tool beide Werte, löst sie über die CSS-Engine des Browsers zu echten RGB-Werten auf (sodass hex, rgb(), hsl() und benannte Farben wie ‚tomato‘ identisch funktionieren) und berechnet die exakte relative WCAG-Luminanz für jede – L = 0,2126×R + 0,7152×G + 0,0722×B, wobei jeder Kanal zuvor mit der echten sRGB-Transferkurve gammakorrigiert wurde – bevor sie in die offizielle Kontrastverhältnisformel (helleres L + 0,05) / (dunkleres L + 0,05) zusammengeführt werden. Die eigene font-size und font-weight des Elements entscheiden, ob die strengeren Schwellwerte für normalen Text oder die milderen für großen Text (18pt+ oder 14pt+ fett) gelten, und das Ergebnis wird gleichzeitig gegen alle vier echten WCAG-Werte geprüft: 4,5:1 und 3:1 für AA, 7:1 und 4,5:1 für AAA – nie zusammengefasst in ein einziges, unechtes Gut/Schlecht-Urteil.

Dies ist eine bewusst ehrliche, pragmatische Teilmenge eines vollständigen Barrierefreiheits-Audits und kein Zertifizierungswerkzeug: Es bewertet keine JavaScript-gesteuerte Interaktivität, keine ARIA-Widget-Muster außerhalb der grundlegenden Beschriftung, keine Tastaturfokusreihenfolge und nichts, was ein tatsächliches Rendern und Ausführen der Seite erfordert. Betrachten Sie es als schnellen ersten Durchlauf, der einige der häufigsten und folgenreichsten WCAG-Verstöße aufdeckt – fehlende Alt-Texte, unbeschriftete Felder, gebrochene Überschriftenhierarchie, kontrastarmen Text und nichtssagende Links – bevor eine Seite live geht, zusätzlich zu (nicht anstelle von) einer vollständigen manuellen Prüfung oder einem dedizierten Audit-Tool für alles, was in Produktion geht.