Barrierefreie Website – ist das wirklich nötig?

Die kurze Antwort: Ja, das ist wirklich nötig. Bevor Sie jetzt aber aufhören zu lesen, möchte ich Sie auch gleich beruhigen: Es ist gar nicht so schwer, schon gar nicht mit WordPress als Basis.

Barrierefreiheit im Web, das ist für viele Menschen schwer zu erfassen. Als einigermaßen gesunder, sehender Mensch kann man sich kaum vorstellen, wie man Websites besuchen kann ohne sie tatsächlich sehen zu können.
Was für viele nicht klar ist: Beim Thema Barrierefreiheit geht es bei weitem nicht nur um Menschen, die nicht oder schlecht sehen können.

Wer profitiert von meiner barrierefreien Website?

Tatsächlich begegnet uns der Bedarf nach Barrierefreiheit sehr viel häufiger als wir denken. Denn nicht nur Menschen mit starken Einschränkungen sind darauf angewiesen, dass wir ihre Bedürfnisse im Blick haben. Wir alle profitieren davon, wenn eine Website keine künstlichen Hindernisse aufbaut.

Screenreader, aber auch Suchmaschinen

Für Menschen, die nur sehr wenig oder gar nicht sehen können, kann fehlende Barrierefreiheit bedeuten, dass sie eine Website nicht besuchen können. Sie sind darauf angewiesen, dass der Screenreader den Inhalt einer Website sinnvoll erfassen kann.

Gleichzeitig lesen Suchmaschinen die Inhalte Ihrer Website ganz ähnlich wie ein Screenreader. Wenn diese Inhalte mit Hilfe eines Screenreaders gut zu verstehen sind, ist auch für Suchmaschinen-Bots schneller klar, worum es auf Ihrer Website geht. Und damit haben Sie schon einmal den Grundstein gelegt für eine positive Bewertung durch Google und Co.

Smartphones und Tablets

Barrierefreiheit bezieht sich auch auf Farbkontraste, Schriftarten und Schriftgrößen. Hier profitieren alle, die mit dem Smartphone oder Tablet bei ungünstigen Lichtverhältnissen versuchen, einen Text auf Ihrer Website zu lesen. Oder ältere Menschen, die Schwierigkeiten mit dem Lesen in der Nähe haben.

Mit guten Kontrasten und leicht zu lesendem Schriftbild funktioniert das. Mit einer zarten dunkelgrauen Schrift auf hellgrauem Hintergrund – nicht mehr wirklich.

Website bedienen im Ein-Hand-Betrieb

Haben Sie sich schon einmal den Arm gebrochen? Oder versucht, mit einem Kind auf dem Arm eine Website zu bedienen? Sie wissen, was ich meine. Hier gibt es viele Möglichkeiten, Besucherinnen und Besuchern das Leben einfacher zu machen. Große Bedienelemente, um sie zielsicher auf mobilen Geräten zu treffen oder auch eine gut funktionierende Navigation via Pfeiltasten oder Tabs am Desktop-Computer können einem hier das Leben leichter machen.
„Nebenbei“ können sich so Menschen, die aufgrund einer Erkrankung motorisch eingeschränkt sind, leichter durch Ihre Website bewegen.

Fremde Sprache? Übermüdet? Schwieriges Thema?

Sprache kann ein großes Hindernis sein. Zum einen, wenn die Website in einer Sprache verfasst ist, die wir nicht flüssig sprechen. Aber auch ein Text in unserer Muttersprache kann unverständlich sein: Sehr lange Sätze, viele Fremdwörter aus einem Bereich, der uns nicht geläufig ist oder eine unklare Struktur behindern uns beim Erfassen. Noch dazu, wenn wir zusätzlich abgelenkt oder müde sind.

Abhilfe schafft, Texte klar zu strukturieren, Sätze nicht zu lang werden zu lassen und auf Fremdwörter zu verzichten, die nicht unbedingt nötig sind. Die Website muss deswegen nicht gleich in leichter Sprache verfasst sein.

Slider, Videos und bewegte Inhalte

Slider und andere bewegte Inhalte können für Screenreader zur Sackgasse werden, aus der sie nicht wieder herauskommen. Auf viele sehende Menschen wirken bewegte, „zappelige“ Elemente irritierend und ablenkend. Mit einer entsprechenden medizinischen Vorgeschichte können sie sogar epileptische Anfälle auslösen.

Für alle bedeuten sie zumindest eine längere Ladezeit als nötig. Bei einem schlechten Mobilnetz kann das heißen, dass die Website extrem langsam geladen wird. Viele Besucherinnen und Besucher brechen an dieser Stelle ab.

Viele Menschen empfinden Slider und Co. außerdem als störend. Und ganz ehrlich, schauen Sie sich einen Slider komplett an und prüfen, ob dort wichtige Inhalte versteckt sind? Untersuchungen zeigen, dass gerade einmal 1% der Besucher auf einen Slider klickt.

Wie mache ich meine Website barrierefrei?

Mit WordPress ist das relativ einfach, da WordPress schon eine gute Basis mitbringt. Die WordPress Standard-Themes sind beispielsweise immer barrierefrei. Das bedeutet, sie bieten viele Features, die für eine Bedienung via Tastatur oder Screenreader wichtig sind. Auch die Kontraste und Schriften sind entsprechend ausgewählt. Sollte es Farbvarianten geben, die diese Standards nicht erfüllen, wird das in der Dokumentation erwähnt.

Die technische Basis genügt leider nicht

Diese technische Basis gibt uns eine sehr gute Grundlage. Ohne die wird es überhaupt nicht funktionieren.
Allerdings können wir die Barrierefreiheit beim Anlegen der Struktur und beim Erstellen der Inhalte gründlich kaputt machen.

Struktur der Website

Es ist für Besucher eine große Hilfe, wenn die Struktur der Website einfach und schnell zu erfassen ist. Nichts ist frustrierender als mehrmals hin- und herklicken zu müssen, um eine bestimmte Information zu finden. An solchen Stellen verliert man Besucherinnen und Besucher schnell an die Konkurrenz.

Tipp: Mit der Suche ans Ziel

Wenn eine Website aus vielen Seiten und Beiträge besteht, ist es sinnvoll, eine effiziente Suchfunktion zur Verfügung zu stellen. Dafür lohnt es sich, ein zusätzliches Plugin zu installieren.

Texte klar strukturieren

Hierarchische Überschriften und Unterüberschriften machen allen das Leben leichter. Wenn ein Text durch verschiedene Überschriften in sinnvolle Abschnitte unterteilt ist, kann man schneller erfassen, worum es geht. Besucherinnen möchten einfach „scannen“, wo im Text die für sie relevanten Informationen stehen.

Wer mit dem Screenreader arbeitet, kann sich zunächst die gekennzeichneten Überschriften vorlesen lassen. Wenn da keine sind, wird es sehr mühsam, in der Website Informationen zu finden.

Inhalte in unterschiedlichen Formaten präsentieren

Manche Menschen erfassen graphische Inhalte leichter, andere lesen lieber. Wieder andere schauen sich eher ein Video an als einen längeren Text zu lesen. Je nachdem, welche Art von Inhalten Sie vermitteln wollen, kann es hilfreich sein, diese unterschiedlich aufzubereiten.

Das kann heißen, zusätzlich zum Text eine Infographik anzubieten. Oder ein Video kombiniert mit einer kurzen textlichen Zusammenfassung. Bewegte Inhalte wie Videos oder Slidern sollten jedoch nicht automatisch abspielen. Jede Besucherin soll selbst entscheiden können, ob sie den Inhalt sehen möchte.

Bedienelemente einheitlich und klar erkennbar

Ein sehr wichtiger Punkt ist die einheitliche Nutzung von klar definierten Bedienelementen. Sie sollten auch immer dasselbe Verhalten auslösen:

Ein Link muss beispielsweise als Link erkennbar sein. Gängige Praxis ist, Links zu unterstreichen. Zusätzlich könnten Links auch noch eine andere Farbe haben. Es muss auf jeden Fall klar erkennbar sein, dass man beim Anklicken auf eine andere Seite oder auch eine andere Website geleitet wird.

Ein Button soll eine Aktion auslösen. Er könnte ein Popup öffnen oder uns zu einem Punkt navigieren, wo wir etwas tun können. Ein Beispiel dafür wäre der Aufruf eines Kontaktformulars.

Es ist nicht wichtig, wie viele unterschiedliche Elemente Sie auf Ihrer Website einsetzen. Wichtig ist, dass das Verhalten der Elemente vorhersehbar ist.

Formulare

Formulare sind eine spezielle Art von Bedienelementen. Für WordPress gibt es unzählige Formular-Plugins. Leider erzeugen die meisten dieser Plugins von Hause aus keine barrierefreien Formulare. Häufig kann man sie noch nicht einmal entsprechend einrichten. Dabei ist es nicht schwer, ein Formular barrierefrei einzurichten, wenn man weiß, worauf man achten muss. Und es dauert kaum länger, als ein nicht-barrierefreies Formular zu erzeugen.

Fazit

Das Wichtigste beim Thema Barrierefreiheit ist meines Erachtens, dass man sich der Problematik bewusst ist und weiß, welche Vorteile eine barrierefreie Website hat. Dann kann man mit wenig Mehraufwand eine weitgehend barrierefreie Website erstellen.

Es ist uns sehr wichtig, die Websites für unsere Kundinnen und Kunden so weit wie möglich barrierefrei zu gestalten. Wie weit das am Ende geht, kommt sehr auf das Projekt und dessen Anforderungen an. Falls Sie dazu Fragen haben sprechen Sie uns gerne an.

Checkliste: Finanzielle Vorteile einer barrierefreien Webseite

Auf der Seite der WAI (Web Accessibility Initiative) gibt es ein Kapitel mit Informationen zu den finanziellen Vorteilen einer barrierefreie Website.
Financial Factors In Developing A Web Accessibility Business Case For Your Organization
Das ist eine kurze Zusammenfassung dieses Textes.

Für welche Arten von Webseiten bringt Accessibility finanzielle Vorteile?

  1. Online-Shops, die etwas verkaufen möchten
  2. Non-profit Organisationen, die Spenden werben möchten
  3. Unternehmen, die ihren Marktanteil erhöhen wollen, indem sie bei Suchmaschinen besser gefunden werden (SEO)
  4. Unternehmen, die ihr Image verbessern möchten und die Reputation ihrer Marke aufwerten möchten
  5. Seiten aus dem Bildungssektor, also Universitäten und Colleges, die sich über Studiengebühren finanzieren und um Studenten werben

„Checkliste: Finanzielle Vorteile einer barrierefreien Webseite“ weiterlesen

Tipps für eine barrierefreie Webseite

Wie viele Leute verwenden wohl einen Screenreader um diese Webseite zu betrachten? Der Anteil dürfte im niedrigen einstelligen Prozentbereich liegen. Warum also so viel Aufwand für eine so kleine Benutzergruppe?
Weil es nicht um Screenreader geht. Sondern um Usability.

Wer profitiert von einer barrierefreien Webseite?

  • Menschen mit einer Sehbehinderung, die starke Kontraste auf ihrem Bildschirm brauchen
  • Menschen, die im hellen Sonnenlicht eine Adresse auf ihrem Smartphone lesen wollen
  • Menschen, die per Tastatur statt Maus navigieren, weil sie keine Arme haben
  • Menschen, die per Tastatur statt Maus navigieren, weil sie Rheuma in den Händen haben oder ihr rechter Arm vorübergehend einen Gipsverband hat
  • Menschen, die eine geistige Behinderung haben
  • Menschen mit einem Hochschulabschluss, deren Muttersprache nicht Deutsch ist
  • Menschen, die eine Aufmerksamkeitsstörung haben und sich schlecht konzentrieren können
  • Menschen, die nach einem langen Arbeitstag müde sind und sich schlecht konzentrieren können
  • Alte Menschen, die unsicher sind und leicht die Orientierung auf der Webseite verlieren
  • Junge Menschen, die unsicher sind und leicht die Orientierung auf der Webseite verlieren

„Tipps für eine barrierefreie Webseite“ weiterlesen

Barrierefreie Website – lohnt sich das?

Wenn wir mit Kunden oder Kollegen über das Thema Barrierefreiheit sprechen, kommt früher oder später die Frage: „Was bringt so eine barrierefreie Seite? Gibt’s da Zahlen?“

Mir ist keine Studie oder Statistik bekannt, aus der sich direkt ableiten ließe, wie sich der Traffic auf einer barrierefreien Website entwickelt. Aber es gibt reichlich Zahlenmaterial zu den unterschiedlichen Bevölkerungsgruppen, für die eine barrierefrei Website relevant ist.

Es sind mehr als man denkt – viel mehr

Da sind zunächst die Menschen, die einen offiziellen Schwerbehinderten-Status haben. Das sind immerhin 10% der Bevölkerung (Quelle). Aber auch Menschen, deren Muttersprache nicht Deutsch ist (13% Quelle) oder die eine eingeschränkte Lesekompetenz haben (17,5% Quelle), brauchen eine gut durchdachte, zugängliche Website. Auch wer älter als 70 Jahre ist, schätzt Angebote, die sich auch mit motorischen und visuellen Einschränkungen sicher bedienen lassen.
„Barrierefreie Website – lohnt sich das?“ weiterlesen

Der “Skip to content”-Link

In den WordPress-Standard-Themes der Twenty-Reihe sitzt in der header.php kurz nach dem body-tag ein Skip-To-Content-Link.

<a class="skip-link screen-reader-text" href="#content">Skip to content</a>

Diesen Link sieht man normalerweise nicht. Er wird erst sichtbar und aktiv, wenn jemand die Tastatur nutzt um durch die Seite zu navigieren. Probiert es mal aus, den Skip-Link gibt es auch hier auf dieser Seite.

Zugang per Tastatur

Die Navigierbarkeit per Tastatur ist ein zentrales Kriterium für Barrierefreiheit. Mit der Tastatur bewegen sich nicht nur Screenreader über die Seite. Auch Menschen, die keine Maus bedienen können, bewegen sich via Tab-Taste. Weil sie Arthritis in den Händen haben, weil sie keine Arme haben oder weil sie den rechten Arm vier Wochen lang im Gips tragen.

„Der “Skip to content”-Link“ weiterlesen

Accessibility Reading List

Gute Bücher über Barrierefreiheit gibt es einige. Wir möchten hier vier Leseempfehlungen geben von Büchern, die wir selbst gelesen haben. Wir stellen die englischsprachigen Versionen vor – so weit wir wissen, gibt es bisher keine deutschen Übersetzungen.

Inclusive Design Patterns
Dieses Buch ist Ende 2016 erschienen und ist damit das aktuellste in der Liste. Heydon Pickering schreibt locker und gut verständlich. Unbedingt lesenswert.
Link zum Buch


Design for Real Life
Hier steht nicht das Thema Barrierfreiheit im klassischen Sinn im Mittelpunkt, aber auch hier geht es darum, wie das echte Leben und die Bedienung von Webseiten auf vielfältige Art und Weise kollidieren können. Das Buch ist 2016 erschienen.
Link zum Buch


A Web for everyone
Ein Buch gepackt voll mit Gedanken und Informationen zu barrierefreiem Webdesign. Nichts, was man an einem Stück runterliest, dafür ist die Information zu dicht gepackt. Das Buch ist bereits 2014 erschienen, aber immer noch relevant.
Link zum Buch


Don’t make me think
Nicht mehr ganz neu (2014), aber ein Klassiker, den man unbedingt gelesen haben sollte. Liest sich leicht und schnell.
Link zum Buch