Accessibility: Websites zugänglich und barrierefrei gestalten

Am 23.09.2019 ist eine neue europäische Richtlinie für barrierefreie Websites in Kraft getreten. Für uns ist das ein Anlass, Sie über dieses Thema zu informieren. Was macht eine Website barrierefrei? Wen betrifft die Richtlinie? Und wieso betrifft Barrierefreiheit nicht nur Menschen mit Behinderung? Wie kann man Accessibility im ersten Schritt einfach messen?

Frau mit zugehaltenen Augen

Zusammenfassung

Die neue Richtlinie der EU für barrierefreie Internetanwendungen gilt "nur" für öffentliche Auftraggeber. Dabei sollte Barrierefreiheit im Internet eigentlich für alle Gestalter von Internetseiten und Internetanwendungen eine Selbstverständlichkeit sein. Leider ist das Thema noch nicht ein Schwerpunkt in den (digitalen) Marketing- und Vertriebsabteilungen. Dabei bringt Barrierefreiheit höheren Kundennutzen, wirkt positiv für SEO und sorgt damit automatisch für mehr Umsatz und Kundenzufriedenheit.

Was bedeutet barrierefreies Gestalten?

Der Begriff der Barrierefreiheit wird bezüglich der Gestaltung von Internetseiten und Software auch als Accessibility oder kurz A11Y (11 für die 11 fehlenden Buchstaben) bezeichnet. Barrierefreie Webseiten und Anwendungen sollen möglichst einfach zugänglich sein. Dies bezieht sich auf die Lesbarkeit und Verständlichkeit und die Bedienbarkeit der Internetseite. Während man bei Barrierefreiheit zunächst an Menschen mit Behinderung denkt, bezieht sie sich insbesondere bei Software und im Internet auf alle Menschen.

Eigentlich kann man bezüglich der Webseiten 'nur' von Barrierearmut sprechen, denn ganz barrierefrei lassen sich interaktive Anwendungen im Internet nicht gestalten.

Neue Technik: oftmals ein Rückschritt

Bei der Neugestaltung von Häusern – insbesondere öffentlichen Gebäuden und Einrichtungen – wird auf Stufen am Eingang häufig schon verzichtet. Es gibt mindestens Rollstuhlrampen. Es gibt Fahrstühle und bei Türen wird auf eine bündige Türschwelle geachtet. Das, was wir aus der Architektur kennen, ist im Internet und bei Software noch nicht angekommen. Noch schlimmer: Oftmals führen neue technische Möglichkeiten im Internet dazu, dass die Barrierefreiheit einer Anwendung schlechter wird. So stören z.B. stark bewegte, animierte Inhalte die Wahrnehmung und können sogar epileptische Anfälle auslösen.

Grundsätze der Barrierefreiheit

Das Thema könnte sicher ein ganzes (dickes) Buch füllen, daher listen wir hier die wichtigsten Grundlagen der barrierefreien Gestaltung im Internet auf.

Wichtig ist, dass sich die Barrierefreiheit nicht nur auf Menschen mit körperlichen Einschränkungen bezieht, sondern auch mit technischen Einschränkungen: Dazu gehören z.B. unterschiedliche Endgeräte und eine langsame Internetverbindung. Auch für Suchmaschinen und Webcrawler soll eine Website accessible sein.

Hier die wichtigsten Punkte:

  • gut strukturierter Text, einfache Sprache und Nutzung gegliederter Überschriften

  • Skalierbarkeit der Schriftgröße

  • starke, ausreichende Kontraste

  • sinnvolle Linktexte verwenden: also nicht "hier klicken", sondern die Folgen/Inhalt des Links möglichst genau beschreiben

  • Nutzung von alternativem, beschreibendem Text zu Grafiken (Nutzung des alt-Attributs) – jedoch nicht bei rein grafischen Elementen (hier ein leeres alt-Attribut)

  • Vermeidung von Farbe als einzigem Transportmittel für Informationen

  • blinkende oder animierte Texte vermeiden

  • Inhalte nicht zeitlich begrenzt anzeigen – die Benutzer sollen bestimmen, wie lange ein Inhalt sichtbar ist

  • Bedienbarkeit der Website/Anwendung mit der Tastatur

  • Nutzung von leichter Sprache

  • richtige Kodierung von Umlauten

  • Vermeidung der grundlosen Nutzung multimedialer, technisch aufwendiger und animierter interaktiver Inhalte und Benutzeroberflächen (solche Techniken sollte man nur verwenden, wenn sie Barrieren abbauen – oftmals führen sie jedoch zur Ausgrenzung)

  • Verwendung von gültigem HTML, Trennung von Layout und Information/Text mittels korrekter Verwendung von CSS

  • Nutzung von Tabellen für Gestaltungsraster vermeiden, Tabellen nur für tabellarische Inhalte nutzen

Zusätzliche Möglichkeiten für mehr Accessibility

  • Nutzung von Gebärdensprache-Videos

  • spezielle Version der Website in einfacher Sprache ("Einfache Sprache" ist ein Fachbegriff für einen extrem simplen, niedrigschwelligen Sprachgebrauch)

Für wen gilt die neue Europäische Richtlinie?

In Deutschland gilt die BITV 2.0 (Barrierefreie-Informationstechnik-Verordnung). Seit September 2019 gilt eine neue Richtlinie der EU (EU-2016/2102). Diese Richtlinie gilt für Internet- und Intranetanwendungen öffentlicher Institutionen/Unternehmen oder Organisationen, die Aufgaben im Allgemeininteresse wahrnehmen (z.B. Krankenkassen oder geförderte Kulturanbieter).

Als privates Unternehmen sind Sie also nicht verpflichtet, die Grundsätze für barrierefreie Anwendungen einzuhalten oder auf nicht-barrierefreie Inhalte hinzuweisen. Aber: Wenn Sie dies tun, dann tun Sie dies für alle Menschen mit Beschränkungen, z.B. auch ältere Mitbürger, für Nutzer von Mobilgeräten und auch für die bessere Platzierung Ihrer Internetseite in Suchmaschinen (SEO).

Testen Sie doch einmal Ihre Website auf Barrierefreiheit

Wenn Sie Google Chrome als Internetbrowser verwenden, haben Sie ein Werkzeug für den Test der Performance von Internetseiten zur Hand.

Gehen Sie wie folgt vor:

  1. Rufen Sie eine Seite mit dem Google Chrome-Browser auf. Nehmen Sie doch einfach unsere Seite https://lfda.de.
  2. Wählen Sie im Menü: Anzeigen/Entwickler/Entwicklertools
  3. Im rechten Bereich sehen Sie nun HTML und CSS Code-Informationen. Wählen Sie oben im Menü der Entwicklertools "Audits" aus. In vielen Fällen müssen Sie dazu mehr vom Menü anzeigen, indem Sie das Menü mit Klick auf das Symbol ">>" erweitern. Sie erreichen so das Werkzeug "Lighthouse".
  4. Sie können nun simulierte Abrufe der Seite für mobile Geräte oder Desktop-Computer ausführen. Hierbei wird auch eine reduzierte Geschwindigkeit simuliert (z.B. 4G, langsamer Prozessor).
  5. Sie erhalten ein Ergebnis mit Werten für die Geschwindigkeit (Performance), Barrierefreiheit (Accessibility), Einhaltung von Standards (Best Practice) und der Suchmaschinenfreundlichkeit (SEO).

Google stellt auch eine Online-Version von Lighthouse zur Verfügung, die jedoch einen geringeren Funktionsumfang bietet und ungenauere Ergebnisse liefert..

Es ist natürlich spannend zu sehen, wie unterschiedliche Seiten hier abschneiden. Populäre Seiten wie Magazine schneiden oft deshalb nicht gut ab, weil Werbeeinblendungen oder animierte Hero-Slider die Seite stark verlangsamen oder nicht gut lesbar machen.

Performance-Tests mit Lighthouse/Chrome

lighthouse perfomance adidas.de

adidas.de

lighthouse performance spiegel.de

spiegel.de

lighthouse performance lfda.de

lfda.de

lighthouse performance statistik-nord.de

statistik-nord.de (LfdA-Kunde)

Unser Plädoyer für Barrierefreiheit.

Accessibility ist für uns bei LfdA "Standard". Wir gestalten alle Internetseiten so, dass sie die Anforderungen für ein barrierefreies Internet einhalten. Manchmal stehen Design- oder Gestaltungswünsche der Kunden dagegen. Natürlich ist auch eine gewisse Sorgfalt bei der Inhaltspflege wichtig für die Barrierefreiheit.

Wir freuen uns über das Vertrauen unserer Kunden und hoffen, dass wir noch viele weitere Internetanwendungen schaffen werden, die für alle Menschen bestmöglich erreichbar und bedienbar und damit – nicht zuletzt – auch erfolgreich sind.

Kontaktieren Sie uns