Barrierefreiheit bei Websites: Was ist das und warum ist es so wichtig?

Bisher gibt es  nur wenige barrierefreie Websites. In diesem Artikel befassen wir uns mit der Zugänglichekit im Web und  gehen der Frage nach, warum es sich lohnt, eine Website barrierefrei zu gestalten.

Das Internet ist ein globales und allgegenwärtiges Phänomen, das alle Bereiche unseres Lebens durchdringt. Denke mal darüber nach: Kannst du dir dein Leben ohne Internet vorstellen? Ich kann nur mutmaßen, es sei für dich vorstellbar. Ich gehöre selber jener Generation an, die in ihrer Kindheit keine Gadgets hatte (außer vielleicht der chinesischen Armbanduhr). Aber es ist nicht zu bestreiten, dass die Welt ohne Internet ganz anders aussehen würde.  

Das Netz verbindet Menschen auf der ganzen Welt und macht es möglich, sich an Informationen zu gelangen, auf dem Laufenden zu sein, Dateien zu speichern, Reisen zu planen und sogar sich um die Gesundheit zu kümmern. Allerdings wird ein barrierefreier Zugang nicht immer gewährleistet.

Es wird gesagt, dass das Web alles toleriert und jeder ins Internet gehen kann, um etwas zu lernen. Das hört sich gut an, aber entspricht nicht der Wirklichkeit. Es gibt viele Websites, die für Menschen mit Beeinträchtigungen nicht zugänglich sind. Diesmal möchten wir uns mit der Barrierefreiheit auseinandersetzen, warum sie so essentiell ist und wie du deine Website vollständig barrierefrei zugänglich machen kannst.

Was wird unter barrierefreiem Webdesign verstanden?

Etwa 15% der Menschen auf der Erde haben Beeinträchtigungen des Gehörs, Sehens, der Bewegungen sowie kognitiver Fähigkeiten. Der freie Zugang zu Informationen für diese Personen ist in den Menschenrechten verankert, trotzdem bleiben einige Websites immer noch unzugänglich. Um einen gewissen Grad an Zugänglichkeit gewährleisten zu können, muss die Website richtig gestaltet und codiert sein.

Features für eine barrierefreie Website

Farbkontrast  

Subtile Farbübergänge wirken schön und raffiniert, aber es gibt Menschen, die nicht gut genug sehen oder Schwierigkeiten mit der Farbwahrnehmung haben. Stark kontrastierende Farben (wie Schwarz-Weiß, Gelb-Schwarz, Rot-Weiß) können großartig aussehen und auch für diese Menschen gut geeignet sein.

Spracherkennung

Seit dem Erscheinen von Siri, Alexa und Cortana erfreut sich die Sprachsteuerung immer größerer Beliebtheit. Außerdem gibt es auch Menschen, die aus irgendeinem Grund nicht ihre Hände einsetzen können. Allerdings sind sie alle in der Lage, eine Website per Sprache zu bedienen, falls sie für solche Manipulationen angepasst ist.

Texte zur Umwandlung

Menschen, die sehbehindert oder blind sind, verwenden eine spezielle Software, die Texte in die Sprache umwandelt. Diese Software kann jedoch nicht erkennen, was auf diesem Bild dargestellt ist, wenn du auch einen Text als eine Alt-Beschreibung einfügst.

Layout und Design

Kompliziertes und originelles Website-Design kann Besucher nicht nur beeindrucken, sondern auch auf sie verwirrend wirken. Wenn deine Besucher nicht verstehen, was sie auf deiner Website weiter tun sollen - dann hast du sicherlich etwas falsch gemacht. In diesem Fall gilt es: Je einfacher deine Navigation und Layouts sind, desto besser ist es für die Nutzerfreundlichkeit.

Benachrichtigungen

Einige Website-Besitzer halten es nicht für nötig, Benutzer über die von ihnen ausgeführten Aktionen zu informieren. Aber wenn man ein Formular ausfüllt und es dann ohne Bestätigung übers Absenden verschwindet, könnte das eine eher unangenehme Überraschung sein. Das Gleiche gilt für Fehlermeldungen. Ich persönlich mag nicht  "Ungültige Daten". Eine deutlichere Fehlermeldung mit Hinweisen auf konkrete Fehler und mit Behebungsvorschlägen würde hier viel Zeit sparen.

Große Bedienelemente

Kleine Buttons sind nur dann angemessen, wenn du möchtest, dass sie nie angeklickt werden. Während PC-Nutzer mit normaler Bewegungsfähigkeit  auf sie drücken können, werden Tablet- und Smartphone-Nutzer sowie ältere Menschen damit Schwierigkeiten haben. Stelle sicher, dass die wichtigsten Schaltflächen auf deiner Website (z.B. “Jetzt kaufen”) groß genug sind.

 Anpassbare Inhalte

Menschen haben unterschiedliche Bedürfnisse. Die Einen ziehen es vor, den Text und Bilder zu verkleinern, die Anderen können hingegen den Text nicht lesen, wenn Buchstaben zu klein sind. Wenn du einem Benutzer einige Anpassungsoptionen zur Hand gibst, wird das die UX definitiv verbessern.

Tastatursteuerung

Nicht jeder kann eine Maus benutzen. Man könnte meinen, die Steuerung sei eine kinderleichte Aufgabe, aber es gibt Leute, die Probleme mit der Koordination haben oder nur die Tasten auf der Tastatur benutzen können. Die Bedienung deiner Website per Tastatur würde diesen Benutzern das Leben sicherlich leichter machen.

Video-Untertitel

Taube und Menschen mit schlechtem Gehör möchten sich auch Videos ansehen, aber das ist durchaus unmöglich, wenn es keine Untertitel gibt. Texte zu Videos hinzuzufügen ist nicht so kompliziert, wie es erscheinen mag. Deshalb solltest du darüber nachdenken.

Es wäre besser, sich einmal anzusehen als tausendmal zu lesen. Hier ist ein Video der W3C Web Accessibility Initiative, wo all diese Features im Detail beschrieben werden:

Aber nicht nur Menschen mit Behinderungen könnten von diesen Features profitieren. Kontrastreiche Farben erweisen sich als hilfreich, wenn du etwas auf dem Handy im Sonnenlicht liest. Untertitel im Video können helfen, wenn du dir es in einer lauten Umgebung oder im öffentlichen Raum anschauen möchtest, wo es verboten ist. Die Spracherkennung ist nützlich, wenn du das Handy vorübergehend mit der Hand nicht bedienen kannst. Die Umwandlung des Textes in die Sprache gibt dir die Möglichkeit, mehrere Aufgaben gleichzeitig zu erfüllen. Ist es für einen Website-Besitzer lohnend, solche Funktionen zu implementieren?

Wie kannst du vom Barrierefreien Webdesign profitieren?

Bei dir taucht jetzt wahrscheinlich die folgende Frage auf: “Na gut, du hast mir einige Vorteile für Menschen mit Behinderungen aufgelistet, aber welchen Nutzen ziehe ich persönlich daraus?” Das ist ein wenig egoistisch, aber fair, denn die Umsetzung von Barrierefreiheit kostet normalerweise Zeit, Mühe und Geld. Meine Antwort lautet so - du sollst dieses Prinzip verwirklichen, weil erweiterte Zugänglichkeit deine Website profitabler machen kann.

Die Anpassung deiner Website an Anforderungen zu Barrierefreiheit wird in erster Linie ihre Benutzerfreundlichkeit verbessern. Die Benutzeroberfläche wird für alle Benutzer komfortabler, nicht nur für diejenigen mit Behinderungen. Je angenehmer die Nutzererlebnis ist, desto öfter kommen sie zurück und desto mehr Freunde bringen sie mit. Du erweiterst dazu die Reichweite und erhöhst den Traffic - so oder so macht das mein Geschäft effizienter.

Die Funktionen für mehr Barrierefreiheit sollen zudem die Sichtbarkeit in Suchmaschinen erhöhen. In der Tat kann Google auch als "Person mit Behinderungen" bezeichnet werden - die Suchmaschine kann weder Audiodateien hören noch bestimmen, was auf dem Bild dargestellt ist. Transkriptionen von Audiodateien und Alt-Tags, die bei Bildern hinzugefügt werden, helfen Google, sie zu sehen und deine Website aufzufinden. Je einfacher es für Google ist, dich zu finden - desto höher rankt deine Website in den Suchergebnissen.

Schließlich ist es in einigen Ländern gesetzlich vorgeschrieben, alles Mögliche für Menschen mit Behinderungen zu tun. Die in Brailleschrift eingeprägte Arzneimittel-Anleitungen, Rollstuhlrampen für Treppen, akustische Verkehrsmeldungen - all das wurde bereits zum Muss, die Barrierefreiheit für Websites setzt sich auch durch, aber etwas langsamer. 

WCAG

Um Menschen mit Behinderungen ein hohes Level an der Barrierefreiheit gewährleisten zu können, hat die Web Accessibility Initiative (WAI) des World Wide Web Consortiums (W3C) die Richtlinien Web Content Accessibility Guidelines (WCAG) ausgearbeitet. Das Dokument bietet Standards zu Barrierefreiheit von Websites und garantiert, dass diese für alle Länder gelten. Es werden Empfehlungen gegeben, wie man eine Website barrierefrei machen kann. Nach Erfolgskriterien werden Websites den Konformitätsstufen A, AA und AAA zugeordnet. Die Prüfung einer Website auf Barrierefreiheit erfolgt automatisch, indem Erfolgskriterien für Inhalte und die Benutzerfreundlichkeit  bewertet werden.

Die neue Version der WCAG - die Version 2.1 - wurde am 5. Juni 2018 veröffentlicht und umfasst alle Anforderungen der Vorgängerversionen. D.h. wenn eine Website mit WCAG 2.1 konform ist,  stimmt sie automatisch auch mit allen anderen WCAG-Versionen überein. Jede neue Version fügt neue Richtlinien zur bestehenden Liste hinzu. Die Vorgängerversion WCAG 2.0 wurde als ISO-Norm ISO/IEK 40500 und die WCAG 2.1 als EN 301549 Norm der Europäischen Union akzeptiert.

Wie machst du deine Website WCAG-konform mit Hilfe vom Website Accessibility Suite?

Du kannst selbstverständlich alle notwendigen Anpassungen manuell vornehmen. Dafür brauchst du das WCAG 2.1-Dokument sorgfältig zu durchlesen und alle dort erwähnten Details zu überprüfen, was normalerweise viel Aufwand erfordert. Es gibt doch eine alternative Lösung. TemplateMonster hat neu den Service “Website Accessibility Suite” im Angebot. Das ist genau das Richtige, um deine Website barrierefrei zu machen, ohne dass du dich eine Woche lang in Richtlinien einarbeiten musst.

Mit diesem Service wird in deine Website ein spezielles Panel eingebunden, das deinen Besuchern zusätzliche Einstellungsmöglichkeiten bietet. Benutzer und potenzielle Kunden werden somit in der Lage sein, das Aussehen deiner Website an ihre besonderen Bedürfnisse anzupassen. Besuchern deiner Website stehen die folgenden Tools zur Verfügung:

  • Kontrastverbesserung. Benutzern stehen 5 Farbmodi zur Auswahl. Darunter sind der Standard-, Nacht-Modus sowie 3 Hochkontrast-Modi.
  • Schriftanpassung. Wenn ein Besucher den Text größer oder gut lesbar machen möchte (z.B. Sans-Serif statt einer komplizierten Schriftart wählen), wird ihm dieses Tool dabei helfen.
  • Link-Highlighter. Manchmal sind Links auch für gewöhnliche Benutzer schwer zu erkennen. Dieses Instrument ermöglicht es jedem, anklickbare Elemente schnell zu definieren.
  • Überschriften-Highlighter. Wenn die Struktur des Inhalts für den Besucher nicht verständlich ist, hat er die Möglichkeit, Überschriften und Unterüberschriften im Text hervorzuheben.
  • Großer Mauszeiger. Der Standard-Cursor könnte für einige Leute zu klein sein und sie würden sich bestimmt freuen, ihn größer zu machen. Mit diesem Tool gibst du ihnen so eine Möglichkeit.
  • Bildschirmlupe. Das Zoomen der Website ist sehr bequem und macht es möglich, kleinere Details besser zu erkennen.
  • Deaktivieren von Animationen. Es gibt einige Arten von Animationen, die Menschen nerven. Die Option macht es möglich, Animationseffekte auf der Website auszuschalten.

Wie du sehen kannst, bietet dieser Service wichtige Funktionen zur Barrierefreiheit, mit deren Hilfe die Benutzererfahrung auf deiner Website zu verbessern ist. Wenn du dich für die Einhaltung des WCAG 2.1-Dokuments entschieden hast, sparst du mit diesem praktischen Service recht viel Zeit.

Du sollst nicht außer Acht lassen, dass mit diesem Angebot deine Website auf grundlegende WCAG 2.1-Anforderungen angepasst wird. Da für jedes Land nationale Gesetze in Bezug auf die WCAG gelten, sollst du diese bei der Erstellung deiner Website auch berücksichtigen.

Fazit

Wenn du deine Website barrierefrei machst, gewinnen nicht nur Menschen mit Behinderungen, sondern auch dein Online-Geschäft. Möchtest du diese Nutzergruppe zu deinen Kunden machen, dann musst du ihnen die Möglichkeit geben, mit deiner Website hürdenlos zu interagieren. Verschwende also keine Zeit und sorge für mehr Barrierefreiheit mit dem Website Accessibility Suite. Der Traffic-Zuwachs lässt sich nicht lange auf sich warten.

Was hältst du von der Zugänglichkeit deiner Website? Hast du jemals etwas unternommen, um es zu verbessern? Wir freuen uns über dein Feedback!

Barrierefreiheit bei Websites hat Elizabeth Thistle unter die Lupe genommen.  Wir haben ihren Beitrag für MonsterPost ins Deutsche übersetzt.



Olga Kulmann

Olga Kulmann ist Mitglied des deutschen Marketer-Teams von TemplateMonster. Ihr Interessenkreis umfasst von Online-Marketing über E-Commerce bis hin zum Webdesign. Olgas Anliegen ist es, die Blogleser mit besten Erfahrungen und geprüftem Expertenwissen in diesen Bereichen vertraut zu machen. Olga auf Facebook.