Barrierefreiheit: Eine Million kaputte Webseiten - und wie man sie repariert

Die meistgenutzten Webseiten haben erhebliche Probleme mit Barrierefreiheit. Dabei lässt sich das leicht verhindern - mit den Entwicklerwerkzeugen der Browser.

Eine Anleitung von Christian Heilmann veröffentlicht am
Viele Webseiten sind nicht barrierefrei.
Viele Webseiten sind nicht barrierefrei. (Bild: Pixabay / Montage: Golem.de)

Jedes Jahr veröffentlicht Webaim.org (kurz für: web accessibility in mind) einen Report über die Barrierefreiheit der 1.000.000 am meisten besuchten Webseiten. Und jedes Jahr ist das Ergebnis enttäuschend. Viele Webseiten können nicht von allen Menschen gleichermaßen benutzt werden, unabhängig von ihren technischen oder körperlichen Möglichkeiten. Dabei ist es nicht schwer, Probleme mit Barrierefreiheit in Produkten bereits bei der Erstellung zu erkennen und zu beheben - mit den Entwicklerwerkzeugen in Browsern.

Inhalt:
  1. Barrierefreiheit: Eine Million kaputte Webseiten - und wie man sie repariert
  2. Probleme bei der Barrierefreiheit erkennen
  3. Fehlerbehebung während der Entwicklung

Der Report berichtet, dass auf den untersuchten Seiten insgesamt 50.829.406 Fehler gefunden wurden. Das heißt, die durchschnittliche Webseite hat 51 Fehler. Zwar sind das 1,1 Prozent weniger Fehler als im Jahr zuvor, allerdings sind die Seiten auch komplexer geworden. Im Durchschnitt bestehen die getesteten Webseiten aus 955 Elementen, 5,3 Prozent davon sind nicht barrierefrei.

Ihnen fehlen beispielsweise ausreichende Kontraste zwischen Vorder- und Hintergrund, Alternativtexte bei Bildern für die Vorlesefunktion oder erklärende Labels für die Eingabefelder in Formularen. Das bedeutet, dass zum Beispiel Menschen mit bestimmten Behinderungen in jedem zwanzigsten Element auf der Seite stecken bleiben können.

Wann immer wir von Barrierefreiheit sprechen, ist es wichtig, sich vor Augen zu führen, dass Behinderung kein binärer Zustand ist, sondern dass es jeden irgendwann einmal betreffen kann. Eine gut lesbare Schrift ist nicht nur für Menschen mit Sehbehinderungen wichtig, sondern auch, wenn man versucht, in der Sonne etwas auf seinem Handy zu lesen. Untertitel sind wichtig für Menschen, die schlecht hören können, aber auch sehr praktisch, um in einer lauten Kneipe zu verstehen, um was es gerade auf dem Fernseher geht. Barrierefreiheit ist nicht nur oft eine gesetzliche Vorgabe, sondern einfach sinnvoll. Wer niemanden ausgrenzt, kann auch viel mehr Nutzer erreichen.

Stellenmarkt
  1. DevOps Engineer (m/w/d)
    iS Software GmbH, Regensburg
  2. Systemspecialist (Linux, DB2-LUW, PL1) (m/w/d)
    Allianz Technology SE, Unterföhring (bei München)
Detailsuche

Am enttäuschendsten ist, dass die Fehler in den Seiten leicht zu beheben oder sogar zu vermeiden sind.

Der Report geht in seinem Bericht sehr ins Detail, doch hier sind die größten Probleme kurz zusammengefasst:

  • 83,9 Prozent der Seiten haben Texte und interaktive Elemente ohne ausreichende Kontraste.
  • 55,4 Prozent haben keinen Alternativtext für Bilder.
  • 50,1 Prozent haben Verknüpfungen ohne Text.
  • 46,1 Prozent enthalten Formularfelder ohne Beschreibung.
  • 27,2 Prozent enthalten Knöpfe ohne Text.
  • 22,3 Prozent haben die Seitensprache nicht definiert.

Vieles davon sollte eigentlich selbstverständlich sein, doch es kann natürlich passieren, dass etwas übersehen wird. Schauen wir uns einmal an, wie uns die Entwicklerwerkzeuge, die mit Browsern mitgeliefert werden, helfen können, diese Probleme zu erkennen und zu vermeiden.

Handbuch für Softwareentwickler: Das Standardwerk für professionelles Software Engineering

Entwicklerwerkzeuge zum Überprüfen der Barrierefreiheit

Im Folgenden erläutern wir, wie Entwicklerwerkzeuge helfen können, barrierefreie Produkte zu erstellen. Als Beispiel zeigen wir die Werkzeuge des Microsoft-Edge-Browsers, der automatisch mit jedem Windows-Rechner geliefert wird, aber auch für Mac und Linux heruntergeladen werden kann. Andere Browser, die ebenfalls auf Chromium aufbauen, wie Google Chrome oder Brave, haben fast die gleichen Entwicklerwerkzeuge und auch die von Firefox und Safari sind ähnlich aufgebaut.

Die besten Werkzeuge zur Überprüfung der Barrierefreiheit sind das Inspect-Tool und die Probleme-Auflistung. Die offizielle Dokumentation der Entwicklerwerkzeuge hat eine Referenz, welches Problem mit welchem Werkzeug erkannt und bearbeitet werden kann. Außerdem gibt es einen detaillierten Artikel, der durch alle Probleme einer Demonstrationsseite geht. Hier eine kurze Übersicht, wie man die im Webaim-Report bemängelten Probleme erkennen kann.

Bitte aktivieren Sie Javascript.
Oder nutzen Sie das Golem-pur-Angebot
und lesen Golem.de
  • ohne Werbung
  • mit ausgeschaltetem Javascript
  • mit RSS-Volltext-Feed
Probleme bei der Barrierefreiheit erkennen 
  1. 1
  2. 2
  3. 3
  4.  


Potrimpo 04. Jun 2022

Gendern Mode? Ich hätte gern mein Frollein zurück. Barrierefreiheit ist offensichtlich...

lala1 03. Jun 2022

auch bei Sonnenschein auf dem Handy die Webseite konsumieren zu können. (denkt mal drüber...

mnementh 03. Jun 2022

Natürlich habe ich einen Adblocker, weil Werbung ist aggressiv, gefährlich und zerstört...

Honigdieb 03. Jun 2022

Weil alles, was nicht den Werten der neuen, lauten Minderheit entspricht, automatisch...



Aktuell auf der Startseite von Golem.de
Führung in der IT
Über das Unentbehrlichsein

Wie ich als Chef zum wandelnden Lexikon wurde und dabei meinen Spaß an der Arbeit verlor - und wie ich versuche, es besser zu machen.
Ein Erfahrungsbericht von @SoFuckingAgile

Führung in der IT: Über das Unentbehrlichsein
Artikel
  1. FTTC: Nachfrage für Vectoring der Telekom steigt um 60 Prozent
    FTTC
    Nachfrage für Vectoring der Telekom steigt um 60 Prozent

    Die Telekom sieht sich mit dem kupferbasierten Anschluss erfolgreich. Im Jahresvergleich hat sich der Kundenbestand um 1,3 Millionen auf 5,4 Millionen erhöht.

  2. Sensorfehler: Spinne legt Rendsburger Schwebefähre lahm
    Sensorfehler
    Spinne legt Rendsburger Schwebefähre lahm

    Ein Krabbeltier hat ein wichtiges Verkehrsmittel zur Überquerung des Nord-Ostsee-Kanals gestoppt - indem es ein Netz über einem Sensor gesponnen hat.

  3. Financial Modeling World Cup: Excel-E-Sport im Fernsehen
    Financial Modeling World Cup
    Excel-E-Sport im Fernsehen

    Ein TV-Sender in den USA übertrug erstmals die Ausscheidung der Excel-Weltmeisterschaft.

Du willst dich mit Golem.de beruflich verändern oder weiterbilden?
Zum Stellenmarkt
Zur Akademie
Zum Coaching
  • Schnäppchen, Rabatte und Top-Angebote
    Die besten Deals des Tages
    Daily Deals • PS5 bestellbar Neuer MM-Flyer • MindStar (Gigabyte RTX 3070 Ti 699€, XFX RX 6950 XT 999€) • eBay Re-Store -50% • AVM Fritz-Box günstig wie nie • Top-SSDs 1TB/2TB (PS5) zu Hammerpreisen • MSI-Sale: Gaming-Laptops/PCs -30% • Der beste Gaming-PC für 2.000€ [Werbung]
    •  /