So arbeiten wir - mit effizienten QA Prozessen zur digitalen Exzellenz Hier gehts zum Beitrag!
Read time: ca. 7 min
Accessibility

Unsere Tipps für mehr Barrierefreiheit auf Eurer Website

Janina

Weltweit gibt es ca. 1,2 Milliarden Menschen mit einer Behinderung. Barrierefreiheit im Internet ist daher in vielen Ländern bereits gesetzlich vorgeschrieben. Barrierefreiheit hilft jedoch nicht nur Menschen mit Behinderung, sondern kann für jede:n von uns nur von Vorteil für die einwandfreie Nutzung einer Webseite sein. In diesem Blog verraten wir euch die Best Practices und worauf ihr achten müsst


Barrierefreiheit: Definition

Laut der Definition von barrierefrei.de bedeutet Barrierefreiheit, „dass jeder Bürger alles im Lebensraum, der barrierefrei gestaltet wurde, betreten, befahren und selbständig, unabhängig und weitgehend ohne fremde Hilfe sicher benutzen kann.“  Dies trifft auf auch die Barrierefreiheit im Internet zu.

 

Digitale Barrierefreiheit: Definition

Kurzgesagt bedeutet Digitale Barrierefreiheit Zugänglichkeit für alle. Digitale Barrierefreiheit beschreibt zudem ein Designkonzept, „das sich als Ziel setzt, Produkte, Umgebungen usw. so zu gestalten, dass sie ohne weitere, spezielle Anpassungen von maximal vielen Menschen benutzt werden können. Barrierefreiheit ist somit eine konsequente Weiterführung des Gedankens der Usability.“ (Quelle: Bertelsmann Stiftung)

Eine barrierefreie Website sollte also ohne zusätzliche oder technische Einschränkung für alle zugänglich sein. Jede:r Besucher:In soll unabhängig von den persönlichen und technischen Einschränkungen alle Funktionen und Interaktionselemente der Webseite nutzen können. Sie soll sowohl für Menschen mit und ohne Behinderung ansprechend gestaltet werden.

Doch wann ist meine Website barrierefrei? Im Folgenden verraten wir euch die Best Practices für eine barrierefreie Webseite.

 

Best Practices für eine barrierefreie Website

Frau-mit-Prothese-1

Klare Layouts erleichtern die Navigation

Weltweit gibt es ca. 1,3 Milliarden Nutzer:Innen mit einer Sehbehinderung. Um diesen Nutzer:Innen die Nutzung von Webinhalten zu erleichtern sind große Schriften und ein hoher Farbkontrast wichtig. Davon profitieren zudem auch Smartphone-Nutzer:Innen, da die Inhalte damit auch auf kleineren Displays besser zu lesen sind. Außerdem ist dadurch auch die Orientierung bei der Verwendung eines Screenreaders für blinde Menschen einfacher

 

Intuitive und präzise Sprache & Struktur

Jede:r Nutzer:In hat andere kognitive Fähigkeiten und Lesekompetenzen. Ebenso kann es sprachliche Barrieren geben, da nicht überall Deutsch gesprochen oder verstanden wird. Genau deshalb sollte der Inhalt auf einer barrierefreien Website klar und präzise formuliert sein, damit er für alle leicht verständlich ist.

Ein klares Layout und hervorgehobene Überschriften helfen nicht nur Menschen mit einer Sehbehinderung, sondern erleichtern auch anderen Nutzer:Innen das Lesen. Sie erkennen die Struktur des Inhalts besser und wissen gleich, wo sie sich auf der Seite befinden. Außerdem haben die Überschriften auch eine unterstützende Funktion in Bezug auf die Suchmaschinenoptimierung.

 

Einfache Dateneingabe

Neben Menschen mit einer Sehbehinderung oder -einschränkung, gibt es auch Menschen mit eingeschränkter Fingerbeweglichkeit. Tippen und Touch-Gesten auf dem Smartphone sind für diese Gruppe Menschen sehr anstrengend und schwierig. Überall wo Daten also manuell eingegeben werden müssen, taucht für diese Menschen eine Barriere auf.

Jede:r von uns ist bestimmt schon mal an den Punkt gekommen, an dem er:sie das ständige Ausfüllen der Daten anstrengend empfand. Und eben weil eine barrierefreie Website für eine einfache Bedingung aller sorgen soll, benötigt es hier Eingabemethoden die niemandem Schwierigkeiten bereiten.

Viel angenehmer ist es für alle Nutzer:Innen, wenn weniger Daten eingegeben werden müssen. Textfelder können z.B. automatisch ausgefüllt werden. Eine weitere Lösung ist die Sprachbedienung, die bereits in vielen Bereichen genutzt wird.

 

Alt Text

Die Beschriftung von Bildern und Grafiken mit Informationsgehalt mit einem Alt-Text (Alternativtext) ist wichtig, damit Screenreader die Beschriftung ansagen können. Ohne einen Alt-Text können die Informationen von Bildern und Grafiken von Menschen mit einer Sehbehinderung nicht erkannt werden. Daher ist die Alternativbeschriftung für die Barrierefreiheit einer Website sehr wichtig.

 

Guter Kontrast

Guter Kontrast macht den Inhalt auf der Website besser und leichter lesbar für Menschen mit einer Sehbehinderung. Wie gut sich Farben auf der Seite voneinander abheben, bestimmt bei einer barrierefreien Website, die Zugänglichkeit für die Nutzer:Innen. Zudem können auch User:Innen, die Software bei schlechten Lichtverhältnissen, z.B. dunkler Bildschirm oder Sonneneinstrahlung, besser nutzen. Achtet also bei eurer barrierefreien Website auf einen guten Kontrast zwischen den Inhalten und dem Hintergrund.

 

200% Zoom möglich

Es sollte beim Erstellen einer barrierefreien Website zudem berücksichtig werden, dass es auch viele Menschen mit einem eingeschränkten Sehvermögen gibt. Daher kann es für diese Personengruppe hilfreich sein, die Seite auf 200% zu vergrößern. Das Aussehen der Website darf sich dabei ändern, die Texte, Inhalte und sonstigen Elemente müssen aber weiterhin lesbar und gut zu erkennen sein, ohne dass die Struktur verloren geht.

 

Link „zum Hauptinhalt der Seite springen“

Der Link „zum Hauptbildschirm springen“ hilft vor Allem Tastaturnutzer:Innen bei der Navigation auf der Seite. Jede mehrseitige Website mit einem Top-Down Menü sollte einen solchen Link anbieten. Mit der Bezeichnung „Hauptbildschirm“ ist der Hauptinhalt einer Seite gemeint. Dieser Link ist meist ausgeblendet außer, er hat den Fokus. Er wird immer da verwendet, wo Seiten obere oder seitliche Menüs haben. So kann der*die Tastaturnutzer:In direkt zu den gewünschten Informationen gelangen.

Barrierefreie-Website-Best-Practices

 

Mit diesen Best Practices könnt ihr Eure Website schon ein ganzes Stück weit barrierefrei machen. Wenn Ihr noch mehr über Barrierefreiheit auf Eurer Website erfahren wollt und wissen wollt, wie sich diese testen lässt, dann nehmt gerne Kontakt zu uns auf oder schaut ganz einfach auf unserer Seite Accessibility Testing vorbei!