veröffentlicht am 10.05.2019 von Christian Schultz

 

Schnell im Netz die Bundesliga-Ergebnisse lesen. Einen Antrag online ausfüllen und absenden. Zum Entspannen ein Video anschauen. Wir alle nutzen das Internet in unterschiedlicher Weise. Doch wie machen das eigentlich Menschen mit Sehbehinderung oder anderen Beeinträchtigungen?

 

 

Inklusion im Internet

 

Damit alle Menschen alle Inhalte im Web nutzen können, müssen Betreiber von Websites einige Dinge beachten. Man spricht hier von barrierefreiem Webdesign. Internetseiten werden so programmiert, dass auch Menschen mit Behinderung auf alle Inhalte Zugriff haben. Die Herausforderung hierbei ist, sämtliche Arten von Behinderung im Blick zu haben.

 

— Kennen Sie schon unseren Newsletter per E-Mail? Am besten gleich anmelden! —

 

Denn ein User mit Sehbehinderung benötigt im Internet andere Hilfsmittel als jemand, der keine Mouse benutzen kann. Wenn Sie tiefer in das Thema einsteigen möchten, besuchen Sie gern die Website „Barrierefreies Webdesign“. Dort finden Sie einen ausführlichen Artikel über die Nutzung des Internets durch Menschen mit verschiedenen Behinderungen.

 

 

Weil Menschen mit verschiedenen Behinderungen unterschiedliche Hilfsmittel benötigen, gibt es im Alltag immer wieder Schwierigkeiten. Ein Beispiel: Für die Selbstständigkeit von Rollstuhlfahrern ist es wichtig, dass Untergründe ohne Schwellen geplant werden. Menschen, die aufgrund ihrer Sehbehinderung einen Gehstock benutzen, sind dagegen auf taktile Elemente in ihrer räumlichen Umgebung angewiesen.

 

Beim Webdesign gibt es diese Probleme nicht. Elemente für sehbehinderte Menschen wirken sich nicht negativ auf die User Experience von Nutzern ohne Hände aus. Im Gegenteil – ein gut durchdachtes Konzept Ihrer Website bietet einen Mehrwert für alle Besucher – auch für diejenigen ohne Behinderung.

 

Aus diesem Grund haben wir sieben einfache Regeln für Sie zusammengefasst, an denen Sie sich bei der Konzeption Ihrer Internetseiten orientieren können.

 

Sieben Gebote für eine inklusive Internetseite

 

1. Beschreiben Sie, was auf Ihren Bildern zu sehen ist

Menschen mit Sehbehinderung oder komplett blinde Nutzer sind beim Surfen im Internet auf Screenreader angewiesen. Diese Programme lesen als Texte hinterlegte Daten auf der Website vor: Überschriften, Tabelleninhalte, Fließtexte. Bilder werden ohne Bearbeitung als Bild-Dateien erkannt – was sich darauf befindet, erzählt der Screenreader allerdings nicht. Deswegen sind an dieser Stelle Sie gefragt.

 

<img src=”nameDerBilddatei.jpg” alt=”Beschreibung des Bildes”>

 

In der Zeile oben erklärt man einem Browser, dass er ein Bild mit dem Dateinamen „nameDerBilddatei.jpg“ wiedergeben soll. Für Menschen mit Sehbehinderung ist aber das sogenannte „alt attribute“ im Anschluss wichtig. In diesem schildern wir kurz, was auf dem Bild zu sehen ist. Ist auf dem Bild eine Katze, könnte hier zum Beispiel stehen „Katze auf einer Wiese“. Auf diese Weise bekommen auch User, die nicht sehen können, einen Gesamteindruck von Ihrer Website. Wichtig: Ihr Browser zeigt die Bilddatei auch ohne „alt attribute“ an. Doch ein Screenreader könnte das Bild in diesem Fall nicht für den blinden User übersetzen.

 

Die Nutzung von „alt tags“ hat übrigens auch einen nicht unerheblichen Einfluss auf das Ranking von Suchmaschinen. Nicht nur Google bestraft Betreiber von Websites dafür, dass Menschen mit Sehbehinderung ausgeschlossen werden. Weitere Tipps für ein besseres Ranking auf Suchmaschinen im Internet finden Sie in diesem Beitrag.

 

2. Machen Sie Ihre Website „tabable“

„Tabable“ bedeutet, dass Ihre Internetseite mit der Tabulator-Taste navigiert werden kann. Beim Drücken jener Taste manövriert sich der User durch Ihre Menü-Strukturen, Buttons und Links. Falls er einen Screenreader benutzt, erzählt ihm dieser bei jedem „Tab“, wo er sich gerade auf der Seite befindet.

 

An dieser Stelle haben Sie sicherlich schon gemerkt, dass „tabable“ einen starken Mehrwert für Menschen mit Sehbehinderung hat. Doch auch User, die ihre Hände nicht benutzen können, profitieren von dieser umsichtigen Art des Programmierens ungemein.

 

<div>tabindex="0">Dieses Element ist jetzt tabable.</div>

 

Um ein Element auf Ihrer Website „tabable“ zu machen, nutzen Sie das HTML-Element „tabindex“ und setzen es = 0, siehe oben. Weitere Informationen zum tabindex finden Sie in den Web Docs von Mozilla. Wenn Sie Hilfe benötigen, wenden Sie sich einfach an uns. Wir unterstützen Sie!

 

3. Nutzen Sie zur Darstellung Ihrer Inhalte kontrastreiche Farben

Insbesondere Texte sollten vor Ihrem Hintergrund gut zu erkennen sein. Es ist kein Zufall, dass die meisten Internetseiten ganz klassisch „schwarz auf weiß“ berichten. Hilfreich ist das für uns alle. Für Menschen mit Sehbehinderung, die Kontraste nicht immer erkennen können, stellt diese Art der Darstellung gar eine Notwendigkeit dar.

 

 

Verwenden Sie also insbesondere bei Text und Menü-Elementen unbedingt eine kontrastreiche Farbgestaltung.

 

4. Ihre Schrift sowie die Bedienoberflächen sollten nicht zu klein sein

Zu kleine Schriften sind für uns alle ein Ärgernis. Für ältere Menschen ist es manchmal schier unmöglich, Texte im Internet zu lesen, wenn die Schriftgröße zu klein gewählt wurde.

 

Verwenden Sie eine ausreichend große Schrift – via GIPHY

 

Falls Sie sich unsicher sind, ob Ihre Schriftgröße ausreichend groß ist, können Sie einen entsprechenden Button auf Ihrer Website platzieren. Klickt ein Nutzer auf dieses Symbol, wird die Schrift in ihrer Größe angepasst. Schauen Sie sich das Beispiel unserer Seite „Erholungszentrum Büsum“ an: Am oberen Rand rechts finden die Besucher der Internetseite ein passendes Symbol, mit dem die Schrift vergrößert werden kann.

 

Wenn Ihre Bedienelemente – zum Beispiel Buttons – nicht groß genug sind, haben sämtliche Nutzer Ihrer Internetseite ein Problem. Und zwar spätestens dann, wenn sie mit dem Smartphone die mobile Version Ihrer Website besuchen. Sind Buttons oder andere Elemente zu klein, ist es schier unmöglich, die richtigen Punkte auf dem Smartphone mit dem Finger zu treffen – ein überaus frustrierendes Erlebnis, das Sie unbedingt vermeiden sollten.

 

5. Helfen Sie Screenreadern mit ARIA

Wir sind bereits auf Screenreader eingegangen. HTML gibt diesen Programmen in der Regel Informationen mit den auf den Weg, um die Bedeutung der einzelnen Elemente zu erklären. Ein Link, der auf eine andere Internetseite führt, wird durch den Screenreader unmittelbar erkannt.

 

Doch nicht alle Elemente auf Ihrer Website sind für einen Screenreader und damit auch für Menschen mit Sehbehinderung ohne Hilfe zu verstehen. Um diese Lücke zu schließen, sollten Sie ARIA-Attribute verwenden. Diese übermitteln zum Beispiel, ob es sich bei einer Komponente um ein Menü handelt, bei dem die Pfeiltasten für die weitere Navigation verwendet werden sollen. Auch wenn Sie ein Kontaktformular nutzen, kann es unter Umständen sinnvoll sein, dieses mithilfe von ARIA für den Screenreader zu erklären. Einen sehr hilfreichen Artikel über die Nutzung von ARIA finden Sie auf der Seite „Barrierefreies Webdesign“.

 

6. Seien Sie sparsam im Einsatz von Tabellen

Wer Daten aufbereiten will, kommt um Tabellen in der Regel nicht herum. Auch im Internet können Tabellen gewisse Informationen sehr anschaulich machen. Vermeiden Sie allerdings, Tabellen für Ihr Layout zu benutzen, zum Beispiel als Ersatz für eine Liste. Dies führt mit hoher Wahrscheinlichkeit zu Problemen in der Kooperation mit Screenreadern. Und auch wenn Ihre Inhalte auf verschiedenen Bildschirmgrößen gut aussehen sollen, können Tabellen für unerfreuliche Folgen sorgen.

 

Achten Sie beim Einsatz von Tabellen darauf, dass diese mit Screenreadern kompatibel sind – via GIPHY

 

7. Legen Sie großen Wert auf einfache Strukturen

Ihre Website sollte simpel und durchdacht strukturiert sein. Das hilft nicht nur Ihren Nutzern, sondern wird auch durch die gängigen Suchmaschinen mit einem höheren Ranking belohnt. Bevor Sie mit der Programmierung loslegen bzw. bevor Sie eine Agentur mit der Erstellung Ihrer Internetseite beauftragen, greifen Sie sich am besten ganz altmodisch Stift und Zettel und überlegen, welche Menü-Struktur für Ihre künftigen Besucher am sinnvollsten wäre.

 

Dies hilft nicht nur Nutzern, die beim Surfen im Netz auf Screenreader angewiesen sind. Alle Besucher werden auf diese Weise einen angenehmen Eindruck von Ihrer Website gewinnen und sich im Zweifelsfall länger mit Ihren Angeboten beschäftigen.

 

Fazit:

Denken Sie bei Ihren Aktivitäten im Internet am besten immer inklusiv. Sie wissen nun, welche Einschränkungen es gibt und welche Hilfsmittel bestimmten Personengruppen auf Ihrer Website helfen können. Bei Fragen freuen wir uns über Ihre Kontaktaufnahme.