Wie erstelle ich eine barrierefreie Website?
Wie erstelle ich eine barrierefreie Website?
4,4 Minuten
Barrierefreies Webdesign
Ist Ihre Website barrierefrei?
Die Gestaltung einer optisch ansprechenden Website ist wichtig, doch ebenso entscheidend ist die Frage, wie Menschen mit und ohne Behinderungen Ihre Website nutzen können. Finden sich alle Nutzer problemlos zurecht? Eine gute Benutzerfreundlichkeit (Usability) trägt nicht nur zu einer besseren Nutzererfahrung bei, sondern kann auch die Sichtbarkeit in Suchmaschinen und das Ansehen Ihrer Website verbessern.
Ab dem 28. Juni 2025 schreibt das Barrierefreiheitstärkungsgesetz (BFSG) die Barrierefreiheit von Websites verbindlich vor.
In diesem Beitrag erfahren Sie, welche Aspekte Sie bei der Erstellung einer barrierefreien Website berücksichtigen sollten, um sowohl rechtliche Anforderungen zu erfüllen als auch Ihre Reichweite und Wirkung zu optimieren.
Inhalt
Wie erstelle ich eine barrierefreie Website?
Die wichtigsten Dinge zur digitalen Barrierefreiheit.
Farben für eine barrierefreie Website:
Die richtigen Farben für eine barrierefreie Website zu finden ist wichtig.
Stellen Sie sich vor, Sie gestalten eine grün/rote Website, der User ist aber rot-grün Blind. Er würde die Website nicht so wahrnehmen, wie es von Ihnen angedacht war. Es gibt noch weitere Augenkrankheiten, die es Menschen schwer machen, die unterschiedlichen Farben zu erkennen. Achten Sie darauf, dass sich die Farben dahingehend ergänzen, dass allzu große Ähnlichkeiten ausgeschlossen werden.
Die Schriftfarbe sollte sich gut vom Hintergrund abheben. Wählen Sie einen großen Kontrast zwischen den Farben. Damit Menschen mit verschiedensten Sehfehlern den visuellen Inhalt der Website gut erfassen können, sollten Sie die Farbkombinationen zuvor auf Accessability (Barrierefreiheit) testen.
Ein gutes Tool zur Kontrolle der Accessibility von Farben finden Sie bei ColorHexa und Adobe Color
Schriften für eine barrierefreie Website:
Welche Typografie ist die richtige?
Die Schrift sollte auf alle Fälle gut lesbar sein. Handelt es sich um ein l oder um ein I ? Bei einigen Schriften ist dieses nicht zu unterscheiden.
Aber auch die Schriftgröße und der Zeichenabstand beeinflussen die Lesbarkeit der Texte. Wählen Sie Schriftgröße nicht zu klein Ich verwende hier eine Schriftgröße von 18px für den normalen Text. Der Zeichenabstand sollte so groß gewählt werden, dass einzelne Zeichen nicht zu eng zusammenstehen. Bei einer Fehlsichtigkeit verschwimmen ansonsten die Zeichen und so wird schnell aus einem „rn“ ein „m“. Achten Sie auch auf einen geeigneten Zeilenabstand.
Google liefert eine Menge barrierefreie Schriften, die Sie in Ihre Website einbetten können. Aber achten Sie auf die Datenschutz – konforme Einbindung in Ihre Website.
Bilder und Videos auf barrierefreien Websites:
Versehen Sie ihre Bilder mit ALT-Attributen, damit Menschen mit einer Sehschwäche die Möglichkeit haben, dass ihnen der Inhalt der Bilder vorgelesen wird. Gegebenenfalls nutzen Sie beschreibende Texte zu den Bildern.
Versehen Sie Videos mit Sprungmarken und, wenn möglich, mit Untertiteln, damit die Inhalte schnell und leicht erfasst werden können.
Animationen auf barrierefreien Websites:
Es existieren inzwischen viele Möglichkeiten Ihre Website mit Animationen aufzupeppen. Ob es große Slider sind, Bereiche, die von links, rechts, oben oder unten in die Seite hineinfliegen. Hüpfen, Verblassen, Blinken, Wackeln, Gleiten, Zoomen,… alles ist möglich.
Nur; was macht das mit Menschen mit ADHS? Diese Menschen sind mit allzu vielen Bewegungen überfordert. Sie werden durch die Animationen abgelenkt und lesen den Text nicht mehr aufmerksam.
Gehen Sie also sparsam und / oder mit Bedacht mit solchen Animationen um. Oder Sie geben solchen Nutzern die Möglichkeit, die Animationen auszuschalten.
Links:
Kennzeichnen Sie Links auf der Website klar, so dass sie schnell als solche erkannt werden. Entweder Sie heben sie farblich in einer einheitlichen Farbe hervor, oder Sie stellen sie unterstrichen dar.
Sprache:
Um Ihr Webangebot für möglichst viele Menschen zugänglich zu machen, verwenden Sie eine leichte, klare Sprache. Beachten Sie auch, das Lesen Ihrer Inhalte zu vereinfachen, durch
- Erklärung von Fachbegriffen
- Nutzung von Zwischenüberschriften
- Verwendung von Aufzählungen und Tabellen
Bedienung:
Achten Sie darauf, dass Ihre Website auch ohne Maus nur mit der Tastatur bedienbar ist. Screenreader (ein Programm, dass sehbehinderten Menschen den Inhalt der Website vorliest oder ihn auf deren Computerausgabegerät zur blindenschrift-Darstellung darstellt) sollen den Inhalt Ihrer Website verarbeiten können.
Formulare:
- Halten Sie Ihre Formulare kurz und verwenden Sie Pflichtfelder nur für notwendige Infos.
- Benennen Sie die Formularfelder, so dass der Screenreader sie verarbeiten kann.
- Versehen Sie die Formulare nicht mit einer Zeitschranke zur Eingabe
- Weisen Sie auf Fehler bei der Eingabe hin und geben Sie die Möglichkeit der Korrektur
Mehr Informationen
Wenn Sie weitere Informationen zum barrierefreien Webdesign suchen, so schauen Sie einmal auf der Website von Aktion Mensch, wo Sie viele Ratschläge und Links zum Testen, Erstellen und gesetzliche Grundlagen zur Barrierefreiheit im Webdesign erhalten.
Tools für barrierefreie Websites:
Sie finden im Internet verschiedene Tools, die den Inklusionsbedarf Rechnung tragen und eine digitale Teilhabe von Menschen mit und ohne Behinderungen möglich machen. Aber auch hier müssen Sie auf die DSGVO – konforme Einbettung derartiger Tools achten.
Barrierefreiheit der eigenen Website prüfen:
Um Ihre Website auf Barrierefreiheit zu prüfen, finden Sie im Internet einige nützliche Tools.
- Google Lighthouse (finden Sie in der Entwickler-Konsole)
- Screenreader-Test (z.B. auf dem Portal Barrierefreiheit der Bundesregierung)
- Wave (ein Tool zum Analysieren Ihrer Website)
Dieser Beitrag dient nur zur Information. Für die Vollständigkeit und Richtigkeit übernehme ich keine Gewährleistung. Als Webdesigner kann und darf ich Ihnen im Sinne des Rechtsdienstleistungsgesetzes keine Beratung geben. Um auf Nummer sicher zu gehen, kontaktieren Sie bei Fragen zu Rechtsdingen bitte immer einen Fachanwalt oder einen Datenschutzexperten.
