Wichtig: Website barrierefrei machen

Grafik Barrierefreiheit

So machen Sie Ihre Website barrierefrei

Konnten Sie im Internet schon mal einen Text nicht richtig lesen oder Bilder nicht sehen? Mussten Sie ein Video schon mal überspringen, weil Sie den dazugehörigen Ton nicht hören konnten?

Menschen mit Behinderungen passiert so etwas täglich – denn viele Websites sind nicht barrierefrei. So sitzen blinde und sehbehinderte Menschen zum Beispiel häufig ratlos vor Bildern und gehörlose Menschen können den Inhalt von Audiodateien nicht erfassen. 

Websiten barrierefrei zu machen ist nicht nur ein Trend. Es sorgt dafür, dass Nutzerinnen und Nutzer sich willkommen fühlen und schafft eine Atmosphäre der Inklusion und Diversität und vergrößert so auch die Reichweite.

In diesem Leitfaden zeigen wir Ihnen, was Barrierefreiheit im Internet genau bedeutet und worauf Sie achten sollten, wenn Sie Ihre eigene Website überarbeiten.

Was bedeutet Barrierefreiheit im Netz?

Beim Wort Barrierefreiheit denken viele erstmal an die Offline-Welt, in der in den vergangenen Jahren Rolltreppen um Aufzüge ergänzt, Rampen für Rollstühle gebaut und Blindenleitsysteme eingerichtet wurden. Doch auch das Internet ist für viele Menschen voller Barrieren. 

Texte können Menschen mit Sehbehinderung zum Beispiel nicht ohne Hilfe lesen. Personen, die schlecht oder gar nicht hören können, sind auf Transkripte für Videos und Audios angewiesen. Menschen mit kognitiven Einschränkungen brauchen möglicherweise Unter-stützung, um Inhalte zu erfassen oder Formulare auszufüllen.

Bei der Barrierefreiheit im Internet geht es aber genauso um Nicht-Muttersprachler, die mit unserer Sprache noch nicht vertraut sind und trotzdem die Website einer Behörde verstehen müssen, um Menschen, die sehr alte Monitore mit schlechter Auflösung nutzen oder eine langsame Internetverbindung haben, und um Personen, die noch neu in der Online-Welt sind und Schwierigkeiten haben, sich zwischen all den Websites und Funktionen zurechtzufinden.

Letztlich bedeutet Barrierefreiheit im Web, dass jede Person das Internet nutzen kann, ohne dass ihr dabei Informationen verloren gehen oder sie auf Funktionen verzichten muss. Unabhängig von körperlicher und psychischer Verfassung, Herkunft, Bildungsstand und sozialem Status soll jeder Mensch gleichberechtigt am Leben im Internet teilnehmen können.

Warum ist Barrierefreiheit im Internet auch für Unternehmen wichtig?

Barrierefreiheit auf der eigenen Website erfordert zunächst einmal ein Verständnis dafür, welche Stellen im Netz Menschen überhaupt als Hürden empfinden und wie diese anders gestaltet werden können. Die praktische Umsetzung kostet Zeit und Budget, aber der Aufwand lohnt sich. Hier sind fünf Gründe für eine barrierefreie Website:

1. Sie erreichen mehr potenzielle Kundinnen und Kunden, denn Sie können mehr Personengruppen ansprechen. Menschen, die sich bisher nicht über Ihre Angebote informieren konnten, bekommen durch die Barrierefreiheit Zugang zu allen Informationen.

2. Ihre Kundinnen und Kunden sind zufriedener mit Ihrer Website. Denn viele Maßnahmen, die der Barrierefreiheit dienen, nutzen auch ganz allgemein der Benutzerfreundlichkeit. Das bedeutet, dass sämtliche Nutzerinnen und Nutzer sich besser auf Ihrer Website zurechtfinden und Inhalte leichter konsumieren können. Das steigert die User Experience und dadurch auch Ihre Verkaufschancen.

3. Sie erhöhen Ihre Reichweite in Suchmaschinen. Denn auch Google schätzt leicht zugänglichen Content und Nutzerfreundlichkeit.

4. Sie übernehmen soziale Verantwortung. Sie tragen aktiv zu einer inklusiven Gesellschaft bei und sind damit ein Vorbild für viele andere.

5. Barrierefreiheit ist gut für Ihr Image. Ihr Fokus auf Nutzerfreundlichkeit, Diversität und Inklusion wird der Welt sicher nicht lange verborgen bleiben.

Schweizer Taschenmesser

Websites barrierefrei gestalten: So gehen Sie am besten vor

Hürden für Nutzerinnen und Nutzer können sich an allen möglichen Stellen Ihrer Website finden. Damit Ihre Website als Ganzes barrierefrei wird, ist es sinnvoll, sie einem gründlichen Check zu unterziehen und Schritt für Schritt Schwierigkeiten zu beheben.

Damit Sie wissen, worauf Sie achten können, haben wir die wichtigsten Aspekte zusammengetragen:

Einzigartige Seitentitel vergeben

Seitentitel helfen Nutzerinnen und Nutzern, innerhalb Ihrer Website zu navigieren und sofort einschätzen zu können, worum es auf einer Seite geht. Achten Sie darauf, dass die Titel konkret, eindeutig und einzigartig sind, damit Ihre Kundinnen und Kunden sich auf Ihrer Website nicht verirren.

Seiten für Screenreader zugänglich machen

Menschen mit Sehbehinderung nutzen Webseiten meist über Screenreader. Sorgen Sie dafür, dass Ihre Inhalte für diese Programme zugänglich sind. Besonders wichtig ist dabei, alle Teile einer Seite im HTML-Code korrekt auszuweisen. Das bedeutet: Überschriften, Textblöcke, Listen, Links, Tabellen und jegliche andere Elemente müssen auch im Code als solche erkennbar sein.

Menschen mit Sehbehinderung nutzen meist die Tastatur zur Navigation. Mit der Taste H springen sie zum Beispiel zur nächsten Überschrift, die Taste F führt sie zum nächsten Formularelement und die Taste K zum nächsten Link. Sind diese Elemente nicht korrekt ausgewiesen, können Menschen mit Sehbehinderung sie nicht ansteuern.

Auch Menüs und Dropdown-Funktionen sollten sich über die Tastatur verwenden lassen.

Auf zeitliche Einschränkungen verzichten 

Vermeiden Sie Seiten und Funktionen, die Nutzerinnen und Nutzer unter Zeitdruck setzen, zum Beispiel durch einen in wenigen Minuten zurückgesetzten Warenkorb. Menschen, die auf Hilfsgeräte wie Screenreader angewiesen sind, benötigen ausreichend Zeit, um durch eine Website zu navigieren und Felder auszufüllen. Sonst laufen Sie Gefahr, dass sie aufgeben und Ihre Website genervt verlassen. 

Auch Nutzerinnen und Nutzer mit langsamer Internetverbindung werden Ihnen den Verzicht auf künstliche Zeitlimits danken. 

Einfache Navigation ermöglichen 

Ihr Menü ist das wahrscheinlich wichtigste Element, um von Seite zu Seite zu finden. Es sollte auf jeder Seite ganz oben zur Verfügung stehen und auch auf jeder Seite die gleichen Punkte enthalten. Wechselt das Menü von Seite zu Seite, kann das verwirren und überfordern. 

Sinnvoll ist es außerdem, eine Breadcrumb-Navigation einzurichten. Dabei wird oben auf einer Seite ein Linkpfad dargestellt, der Nutzerinnen und Nutzern zeigt, wo genau sie sich innerhalb der Website befinden und auf welcher Ebene. Durch den Klick auf die Elemente des Breadcrumb-Menüs können Sie zu höher gelegenen Ebenen zurückkehren.

Kompass

Sitemap bereitstellen

Eine gut strukturierte Sitemap ist nicht nur für Suchmaschinen sehr hilfreich, um den Aufbau einer Website zu verstehen, ihre Inhalte zu erfassen und gezielt Content anzusteuern. Auch Menschen mit Sehbehinderung erleichtert sie die Navigation.

Sackgassen vermeiden

Seiten ohne Menü oder Links können schnell zu Sackgassen für Menschen mit Sehbehinderung werden: Sie können sich nicht mehr weiterbewegen und verlassen Ihre Website deshalb vielleicht frustriert. 

Achten Sie daher darauf, dass es auf jeder Seite in irgendeine Richtung weitergeht oder Nutzerinnen und Nutzer zumindest zur letzten Seite zurückkehren können.

Auf verständliche Sprache achten

Verwenden Sie in Ihren Texten, Videos und Audios eine klare Sprache, die auch Laiinnenund Laien verstehen können. Verzichten Sie auf Fachbegriffe oder erklären Sie diese. Halten Sie Ihre Sätze kurz, indem Sie für jeden Gedanken einen neuen Satz beginnen.

Damit helfen Sie Menschen mit kognitiven Einschränkungen, stellen aber auch einfach sicher, dass Personen ohne Vorwissen Ihre Inhalte verstehen.

Zwischenüberschriften nutzen

Strukturieren Sie Ihre Texte mit HTML-Überschriften (H1, H2, H3 und so weiter). Halten Sie sich dabei an die Reihenfolge der Überschriften statt zum Beispiel von einer H2 zu einer H5 zu springen. 

Dadurch können sehbehinderte Nutzerinnen und Nutzer mit ihren Screenreadern besser durch Ihren Content navigieren. Für Ihre SEO ist eine sinnvolle Überschriftenstruktur übrigens auch sinnvoll.

Text sinnvoll formatieren

Je besser ein Text strukturiert ist, desto besser können sich Nutzerinnen und Nutzer darin orientieren und genau die Inhalte finden, die sie interessieren. Arbeiten Sie zum Beispiel mit Fettungen und korrekt formatierten Listen, um für mehr Übersichtlichkeit zu sorgen.

Text-Kontrast erhöhen

Wenn Sie mit Farben oder Bildern als Hintergrund arbeiten, sollten Sie sicherstellen, dass genug Kontrast zum Text besteht. Nur dann ist dieser gut lesbar. Außerdem erleichtert ein deutlicher Kontrast Nutzerinnern und Nutzern, den Text an alten Bildschirmen mit niedriger Auflösung oder auf Handys im Sonnenschein zu lesen.

Empfehlenswert ist ein Kontrastverhältnis von mindestens 4,5:1 für kleine und 3:1 für große Texte.

Textvergrößerung zulassen

Menschen, die schlecht sehen können, bekommen Probleme, wenn Text zu klein und deshalb schlecht zu erkennen ist. Diese Hürde können Sie ganz einfach aus der Welt schaffen, indem Sie Nutzerinnen und Nutzern ermöglichen, die Schrift selbstständig um bis zu 200 Prozent zu vergrößern.

Handlungen nicht nur durch Farben anregen

Farben können Einfluss auf unser Befinden und unsere Entscheidungen haben. Nicht umsonst ist im Marketing Farbpsychologie immer wieder ein Thema. 

Doch nicht alle Menschen können Farben gut unterscheiden, zum Beispiel wenn sie von einer Rot-Grün-Schwäche betroffen sind. Vermeiden Sie es deshalb, Handlungen von Farben abhängig zu machen – also Menschen zum Beispiel über rote und grüne Pfeile durch eine Grafik zu führen oder Buttons ohne eindeutige Beschriftung zu nutzen.

Aussagekräftige Link-Texte verwenden

Links dienen im Internet als Orientierung. Schon bevor eine Person klickt, möchte sie einschätzen können, wo sie gleich landen wird. Legen Sie Links deshalb immer auf einen aussagekräftigen und eindeutigen Ankertext.

Beispiel:

Ein farblich unterlegter Link mit dem Titel “In diesem Artikel erfahren Sie mehr über Accessibility” ist barrierefrei.

“https://blog.rosp-digital.de/marketing/arbeitsatmosphaere” wäre es nicht.

Keine Bilder verwenden, auf denen nur Text zu sehen ist

Bilder sind für Menschen mit Sehbehinderung nur begrenzt einzuordnen. Zwar erfahren sie durch ihren Screenreader, dass ein Bild existiert – sie sehen aber nicht, was darauf abgebildet ist. Text hingegen kann die Software problemlos in eine Sprachausgabe oder Braille-Schrift übersetzen.

Wollen Sie Text auf einer Seite platzieren, ist es deshalb sinnvoll, ihn direkt im HTML-Code zu platzieren, statt auf ein Bild zu schreiben. Bilder sollten nur der Veranschaulichung von Textinhalten dienen.

Beschreibung für Bilder verfassen

Versehen Sie alle Bilder mit einer schriftlichen Beschreibung. Dazu können Sie den sogenannten Alt-Text nutzen.

Ihre Beschreibung können Screenreader dann vorlesen. Achten Sie also darauf, dass aus dem Text klar hervorgeht, was auf dem Bild zu sehen ist.

Netter Nebeneffekt: Google liest die Alt-Texte ebenfalls aus. Sie tun also parallel auch etwas für Ihr Suchmaschinen-Ranking.

Alt-Text für Tabellen vergeben

Auch Tabellen stellen Menschen mit Sehbehinderung oft vor Herausforderungen, weil sie die Daten nicht im Überblick sehen, sondern nur Zelle für Zelle ansteuern können.

Kommen Sie ihnen entgegen, indem Sie zu jeder Tabelle einen Alt-Text ergänzen, der den Inhalt beziehungsweise die Daten erklärt.

Untertitel für Videos erstellen

Untertitel machen Ihre Videos für Personen zugänglich, die nicht hören können oder die einfach lieber lesen. YouTube kann automatisch Untertitel erstellen, die heruntergeladen werden können. Wir empfehlen jedoch, die Texte noch einmal durchzugehen und diese gegebenenfalls zu korrigieren.

Transkripte für Audios und Videos anbieten

Zusätzlich zu den Untertiteln sind Transkripte eine hervorragende Möglichkeit, Video- und Audiodateien für alle Menschen zugänglich zu machen. In den vergangenen Jahren haben Spracherkennungsprogramme große Fortschritte gemacht und können Sprache immer besser in einen gut lesbaren Text umwandeln.

Content auf mehreren Wegen bereitstellen

Nicht jede Person kann jede Art von Content problemlos konsumieren und bei allen anderen kann es verschiedene Nutzungspräferenzen geben. Aus diesem Grund ist es empfehlenswert, Content auf verschiedenen Wegen zugänglich zu machen, zum Beispiel sowohl als Text als auch als Video.

Die verschiedenen Contentarten sollten einander ebenbürtig sein. Das bedeutet: Egal, ob sich Nutzerinnen und Nutzer für einen Text oder ein Audio entscheiden, sie sollten stets alle Informationen erhalten und nicht nur eine abgespeckte Version.

Content nicht auf einen Sinn beschränken

Auch innerhalb eines Content-Formats zahlt sich Vielfalt aus. Versuchen Sie, immer mehrere Sinne Ihrer Kundinnen und Kunden anzusprechen. Sollte einer von ihnen nicht gut funktionieren, können die Inhalte immer noch über die anderen Sinne wahrgenommen werden. 

Sie könnten beispielsweise Videos in Blogartikel einbinden oder in Videos gezielt mit Geräuschen oder einer Audiodeskription arbeiten.

Website für verschiedene Browser optimieren

Nicht alle Nutzerinnen und Nutzer verwenden den gleichen Browser – und einige haben auch gar nicht immer eine Wahl. Screenreader zum Beispiel funktionieren in der Regel mit dem Firefox Browser am besten.

Ihre Website sollte aus allen Browsern heraus aufgerufen und ohne Einschränkungen genutzt werden können.

Richtlinie für Barrierefreiheit bereitstellen

Viele Websites sind heute noch nicht barrierefrei. Falls das bei Ihnen anders ist, können Sie eine Richtlinie zusammenstellen mit allen Maßnahmen, die Sie für Barrierefreiheit ergriffen haben und Links zu Transkripten, Audiodeskriptionen und anderen Services. Verlinken Sie die Richtlinie auf Ihrer Website, damit Nutzerinnen und Nutzer sie einfach finden und wissen, dass sie bei Ihnen alle Inhalte ohne Einschränkung nutzen können.

Probleme melden lassen

Manchmal ist es gar nicht so einfach, jede Stelle einer Website zu identifizieren, an der es Probleme mit der Barrierefreiheit geben könnte. Je größer die Website, desto eher könnten Sie etwas übersehen. Einige Schwierigkeiten sind Ihnen vielleicht auch einfach nicht bewusst, wenn sie Sie nicht betreffen.

Deshalb ist es hilfreich, eine Meldefunktion für Nutzerinnen und Nutzer einzurichten. Kommen Sie auf Ihrer Website nicht weiter oder können einen Inhalt nicht abrufen, können sie Sie auf diesem Weg unkompliziert informieren.

Wir helfen ihnen gerne:

Quelle: Hubspot

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

RSS
LinkedIn
Share
Instagram
WhatsApp