Barrierefreiheit bei Websites – darauf sollten Sie achten
- Was Barrierefreiheit bei Websites bedeutet
- Gesetzliche Vorschriften zur digitalen Barrierefreiheit
- Ihre Checkliste für eine barrierefreie Website
wachsende Websites
danach 12 €/Mon.
Einrichtung: 0 €
Warum barrierefreie Websites so wichtig sind
Barrierefreie Internetseiten sind so gestaltet und programmiert, dass sie von jeder Person genutzt werden können, auch mit körperlichen oder kognitiven Einschränkungen. Das bedeutet, dass alle Inhalte, die auf Websites oder in mobilen Anwendungen integriert sind, auch für jene, die Assistenztechnologien wie Screenreader nutzen oder nicht auf herkömmliche Eingabegeräte zurückgreifen können, zugänglich und verständlich sein müssen. Dazu gehören auch Inhalte wie PDF-Dateien, Bilder, Videos und Grafiken. Ziel ist es, das Internet zu einem inklusiven Raum zu machen, der allen Menschen gleichberechtigt Zugang zu digitalen Angeboten ermöglicht.
Dass das Thema inzwischen nicht mehr nur für Behörden- oder Regierungswebsites relevant ist, liegt an der Richtlinie 2019/882 der Europäischen Union: dem European Accessibility Act. In Deutschland wird die EU-Richtlinie durch das Barrierefreiheitsstärkungsgesetz (BFSG) umgesetzt. Durch die gesetzlichen Vorschriften sind Unternehmen, die in den Geltungsbereich des BFSG fallen, verpflichtet, ihre Website bis zum Stichtag (28. Juni 2025) barrierefrei zu gestalten. Die Minimalanforderungen werden dabei durch Normen, Verordnungen und Leitfäden vorgegeben, allen voran die Web Content Accessibility Guidelines (WCAG) der Web Accessibility Initiative (WAI).
Die Grundlagen der Barrierefreiheit von Websites
Die neuen Vorschriften zu barrierefreien Websites sollen dafür sorgen, dass gesellschaftliche Teilhabe auch im Internet stattfindet. Doch was soll konkret mit barrierefreien Websites erreicht werden?
Gleichberechtigter Zugang
Ziel ist, dass jeder Mensch – unabhängig von seinen Fähigkeiten oder der von ihm verwendeten Technologie – Zugang zu Informationen, Funktionen und Angeboten des Internets hat.
Usability
Barrierefreiheit im Netz bedeutet, dass Websites einfach und intuitiv zu bedienen sind. So soll allen eine gleichwertige Erfahrung in der Anwendung geboten werden.
Inklusion
Die Vision hinter den Regelungen zu barrierefreien Websites ist, ein inklusives Internet zu schaffen, das die Diversität aller Menschen anerkennt und wertschätzt.
Vorteile einer barrierefreien Website für Nutzende und Unternehmen
Zwar mag für viele Unternehmen der Anreiz für einen barrierefreien Internetauftritt von den neuen Gesetzen, Richtlinien und Leitfäden kommen – also aus der Notwendigkeit heraus, die gegebenen Anforderungen zu erfüllen. Dabei sollten Betreiberinnen und Betreiber von Webseiten nicht übersehen, dass sich der Aufwand auch in anderer Hinsicht lohnen kann. Eine barrierefreie Website kann für das Unternehmen selbst folgende Vorteile haben:
Erhöhte Kundenzufriedenheit
Eine barrierefreie Gestaltung ermöglicht eine intuitive und problemlose Navigation für alle Nutzenden, z. B. wenn anstelle der Maus mit der Tastatur navigiert werden kann. Sie verbessert auch die Verständlichkeit von Informationen für alle Nutzenden, z. B. durch die Verwendung einer einfachen Sprache und einer logischen Struktur. Das kann die Kundenzufriedenheit erhöhen und die Kundenbindung steigern.
Erweiterung der Zielgruppe
Eine barrierefreie Website hilft Ihnen, neue Zielgruppen zu erschließen. Laut EU-Kommission gibt es in der Europäischen Union mindestens 87 Millionen Menschen, die an dauerhaften physischen oder kognitiven Einschränkungen leiden – darunter viele Menschen mit Behinderungen und ältere Menschen. Hinzu kommen Personen mit vorübergehenden Einschränkungen. Indem auch ihnen der Zugang zu digitalen Angeboten ermöglicht wird, vergrößern Unternehmen ihr Marktpotenzial.
Positives Markenimage
Wenn Sie auf Barrierefreiheit in Ihrem Online-Auftritt setzen, übernehmen Sie damit gesellschaftliche Verantwortung und zeigen allen Besucherinnen und Besuchern Ihrer Website Wertschätzung. Das kann sich positiv auf die Wahrnehmung Ihrer Marke auswirken.
Zahlt auf Suchmaschinenoptimierung (SEO) ein
Suchmaschinen bewerten Websites unter anderem nach ihrer Zugänglichkeit. Barrierefreie Websites sind gut strukturiert, nutzen klare semantische HTML-Strukturen und haben aussagekräftige Metadaten. All das macht es auch für Suchmaschinen leichter, den Inhalt der Seite zu verstehen – was wiederum die Grundlage dafür ist, dass Ihre Website Nutzenden bei relevanten Suchbegriffen angezeigt werden und Traffic erzielen kann.
Grundprinzipien barrierefreier Websites
Ein wichtiges Dokument, das Website-Betreibenden bei der Umsetzung der Richtlinien zur Barrierefreiheit hilft, sind die bereits erwähnten Web Content Accessibility Guidelines (WCAG). Der Leitfaden ist in vier Kapitel unterteilt. Diese beschreiben verschiedene Techniken, mit denen sich die Website barrierefrei gestalten lässt. Das sind die vier Grundprinzipien barrierefreier Websites laut WCAG mit Beispielen für Bereiche, in denen sie angewendet werden sollen:
Wahrnehmbarkeit
Informationen auf der Website und die Elemente der Benutzeroberflächen müssen von allen Anwendenden wahrgenommen werden können. Die WCAG sehen deshalb unter anderem in folgenden Bereichen Maßnahmen zur Gewährleistung von Barrierefreiheit vor:
Textalternativen
Für alle nicht-textlichen Inhalte sollten Textalternativen bereitgestellt werden, damit sie von Screenreadern gelesen und von Menschen mit Sehbehinderungen erfasst werden können. Dazu gehören beispielsweise alternative Texte für Bilder, Transkripte für Audioinhalte und Untertitel sowie Audiodeskriptionen für Videos.
Kontrast und Farbgebung
Eine gute Lesbarkeit der Texte auf der Website muss gewährleistet sein. Innerhalb der Farbpalette sind vor allem Farbkontraste relevant, aber auch Schriftarten und -größen. Für den Farbkontrast zwischen Text und Hintergrund enthält die WCAG konkrete Vorgaben. So ist z. B. ein Kontrastverhältnis von 4,5:1 notwendig, um das Konformitätslevel AA der WCAG zu erreichen. Das bedeutet, dass der Text mindestens 4,5 mal heller sein muss als der Hintergrund. Farbe sollte zudem nicht das einzige Mittel sein, um Informationen zu vermitteln, da das für farbenblinde Menschen ein Hindernis darstellt.
Anpassbarkeit und Responsivität
Websites sollten so gestaltet sein, dass sie auf unterschiedlichen Geräten und Bildschirmgrößen gut funktionieren, damit Personen mit verschiedenen Technologien darauf zugreifen können. Textgrößen sollten anpassbar sein. Layouts müssen flexibel (responsiv) sein, um eine Verzerrung oder den Verlust von Informationen zu vermeiden, wenn die Anzeigegröße oder -orientierung geändert wird.
Bedienbarkeit
Die Website muss von allen Menschen bedienbar sein. Besonders im Bereich der Navigation und der Interaktion mit der Seite gibt es spezielle Anforderungen an das Webdesign.
Navigationshilfen
Eine intuitive und konsistente Navigation ist entscheidend für die Barrierefreiheit. Dazu gehören eine klare Kennzeichnung der aktuellen Position auf der Website und die Bereitstellung von Überschriften zur Strukturierung von Inhalten. Sitemaps, Suchfunktionen und eine Breadcrumb-Navigation tragen ebenfalls dazu bei, die Orientierung zu erleichtern.
Eingabemethoden
Anwendende müssen außerdem in der Lage sein, alle Interaktionselemente zu bedienen, unabhängig davon, ob sie eine Maus, Tastatur, Sprachbefehle oder andere Assistenztechnologien verwenden. Elemente, die eine Interaktion erfordern (z. B. Formulare), müssen so gestaltet sein, dass sie mit verschiedenen Eingabemethoden bedient werden können.
Verständlichkeit
Informationen und die Bedienung der Benutzungsoberfläche müssen verständlich sein. Dies bedeutet, dass Texte lesbar und nachvollziehbar sein müssen und Webseiten auf vorhersehbare Weise funktionieren sollten. Eine besonders wichtige Rolle für die Verständlichkeit einer Website spielt eine leicht verständliche Sprache.
Leichte Sprache
Die Verwendung leicht verständlicher Sprache, klarer Strukturen und eindeutiger Begriffe hilft nicht nur Menschen mit kognitiven Beeinträchtigungen, sondern verbessert die Zugänglichkeit für alle Nutzenden. Inhalte sollten klar gegliedert sein und eine logische Reihenfolge aufweisen, um die Verständlichkeit zu fördern.
Robustheit
Inhalte müssen durch unterschiedliche Assistenztechnologien wie Screenreader interpretiert werden können. Das erfordert sauberen, standardkonformen Code und eine langfristige Kompatibilität mit aktuellen und zukünftigen Technologien.
Ihre barrierefreie Website mit STRATO SmartWebsite
STRATO erkennt die Bedeutung der Barrierefreiheit im Web und bietet mit dem Homepage-Baukasten ein Tool, das es Unternehmen und Einzelpersonen ermöglicht, barrierefreie Websites zu erstellen und zu verwalten. Mit STRATO profitieren Sie von vorgefertigten Designvorlagen, die nicht nur visuell überzeugen, sondern auch den Grundsätzen der Barrierefreiheit entsprechen. Ob es um die Optimierung für Screenreader geht, um die Möglichkeit zur Einbindung von alternativen Texten für Bilder (ALT-Attribute) oder um die Bedienbarkeit durch Tastaturbefehle: STRATO stellt die notwendigen Optionen für eine inklusive Online-Präsenz bereit.
Wenn Sie eine barrierefreie Website mit dem STRATO Homepage-Baukasten entwickeln, zeigen Sie Ihrer gesamten Kundschaft, nicht nur Menschen mit Beeinträchtigungen, Ihr Engagement für Inklusion und Teilhabe. Wie können Sie beim (Um-)Bau Ihrer Website vorgehen?
Schritt 1: Planung und Konzeptentwicklung
Bedürfnisse erkennen: An erster Stelle steht das Entwickeln eines umfassenden Verständnisses für die Bedürfnisse von Menschen mit Behinderungen.
Ziele festlegen: Definieren Sie, welche Anforderungen Ihre barrierefreie Website erfüllen muss und in welchen Punkten Sie gegebenenfalls sogar über die gesetzlichen Vorgaben hinausgehen möchten.
Erste Einschätzung: Wenn Sie bereits eine Website betreiben, können Sie mithilfe von Tools wie Siteimprove oder der WAVE-Toolbar eine erste Einschätzung zur Barrierefreiheit der Seite bekommen. Für eine detaillierte Überprüfung gemäß der Barrierefreie-Informationstechnik-Verordnung (BITV) ist es empfehlenswert, den BITV-Test durchzuführen. Er wurde ursprünglich für öffentliche Stellen des Bundes entwickelt. Diese sind im Rahmen des Behindertengleichstellungsgesetzes (BGG) schon länger dazu verpflichtet, Anforderungen zur digitalen Barrierefreiheit zu erfüllen – also beispielsweise wesentliche Informationen in Leichter Sprache und Gebärdensprache bereitzustellen. Das BGG verweist dabei auf die Barrierefreie-Informationstechnik-Verordnung (BITV 2.0), die wiederum dem Test seinen Namen gab. Auf https://bivtest.de/ finden Sie Beispiele für barrierefreie Websites, die als BITV-konform eingestuft werden.
Schritt 2: Auswahl des passenden Designs
Vorlagen auswählen: Nutzen Sie Vorlagen von STRATO, die auf Barrierefreiheit setzen und passen Sie diese an Ihre Bedürfnisse an.
Design anpassen: Stellen Sie sicher, dass Farbschemata, Schriftgrößen und Layouts für alle Nutzenden zugänglich und auf beliebigen Endgeräten gut leserlich darstellbar sind.
Schritt 3: Inhalte barrierefrei gestalten
Textalternativen: Fügen Sie allen Bildern, Videos und Audiodateien Textalternativen hinzu, damit diese von Screenreadern gelesen werden können.
Leichte Sprache: Verwenden Sie eine klare und einfache Sprache, um die Verständlichkeit zu erhöhen. Greifen Sie ggf. auf Fachkräfte für Übersetzungen in Leichte Sprache zurück.
Schritt 4: Navigationshilfen integrieren
Klare Navigation: Erstellen Sie eine intuitive und leicht zu navigierende Website-Struktur, die auch über die Tastatur bedienbar ist.
Zugänglichkeitsfunktionen: Stellen Sie Funktionen wie eine Suchfunktion, eine Sitemap und eine Breadcrumb-Navigation bereit, um Nutzenden bzw. Assistenz-Tools die Orientierung auf der Seite zu erleichtern.
Schritt 5: Testen und Optimieren
Testen der Barrierefreiheit: Nutzen Sie Tools, um Ihre Website auf Barrierefreiheit zu testen, und nehmen Sie die erforderlichen Anpassungen vor. Tools wie WAVE, AXE Accessibility Checker oder Google Lighthouse helfen Ihnen, viele Zugänglichkeitsprobleme zu identifizieren. Dennoch ist eine manuelle Überprüfung unerlässlich. Dazu gehört das Navigieren mit der Tabulatortaste, das Testen mit Screenreadern und die Überprüfung von Farbkontrasten.
Feedback einholen: Fragen Sie die Nutzenden Ihrer Website nach ihren Erfahrungen hinsichtlich der Barrierefreiheit Ihres Internetauftritts und nutzen Sie die Ergebnisse, um kontinuierliche Verbesserungen vorzunehmen.
Checkliste für eine barrierefreie Website
Die folgende Checkliste dient zur Orientierung und erhebt keinen Anspruch auf Vollständigkeit. Eine umfassende Übersicht erhalten Sie in den Web Content Accessibility Guidelines und weiteren im BFSG referenzierten Normen, Verordnungen und Leitfäden.
Textalternativen
- Alle Bilder haben aussagekräftige Alt-Texte.
- Videos verfügen über Untertitel und Audiodeskriptionen.
- Audioinhalte sind mit Transkripten versehen.
Medien und Farbgebung
- Informationen werden nicht ausschließlich über Farbe vermittelt.
- Kontrastverhältnisse zwischen Text- und Hintergrundfarben sind ausreichend für eine gute Lesbarkeit.
- Multimedia-Inhalte sind steuerbar (Pause, Stopp, Lautstärke).
Navigierbarkeit
- Die Website kann vollständig über die Tastatur bedient werden.
- Es gibt mehrere Wege, Informationen auf der Website zu finden (z. B. Menü, Suche, Sitemap).
- Überschriften und Labels sind klar und beschreibend.
Zugänglichkeit und Struktur
- Die Website verwendet semantisches HTML, um Inhalte zu strukturieren (z. B. Überschriften, Listen, Absätze).
- ARIA-Landmarks (Accessible Rich Internet Applications) sind eingesetzt. Dies sind Attribute, die Website-Komponenten für Hilfsmittel wie Screenreader zugänglich machen. Sie sollten verwendet werden, um Nutzenden die Navigation zu erleichtern.
- Die Reihenfolge, in der die Inhalte und Elemente navigiert werden, ist logisch und intuitiv.
Formulare und Eingabeelemente
- Alle Formularelemente sind klar beschriftet und verfügen über Beschreibungen oder Legenden, wenn nötig.
- Fehlermeldungen sind klar formuliert und bieten Anleitungen zur Fehlerbehebung.
- Formulare sind so gestaltet, dass sie auch ohne Maus bedienbar sind.
Responsivität und Anpassbarkeit
- Die Website ist responsiv und funktioniert auf verschiedenen Geräten und Bildschirmgrößen.
- Textgrößen sind anpassbar, ohne dass es zu Informations- oder Funktionsverlust kommt.
- Es gibt keine festgesetzten Zeitlimits z. B. für die Eingabe von Daten oder die Anzeige bestimmter Elemente oder diese können angepasst oder abgeschaltet werden.
Website barrierefrei gestalten mit STRATO KI-Features
STRATO unterstützt Sie bei der barrierefreien Gestaltung Ihrer Website mit innovativen KI-Features. So profitiert Ihre Kundschaft von einer für alle Menschen einfach bedienbaren, leicht verständlichen Website – und Sie profitieren von einer glücklichen Kundschaft.
KI-Textoptimierer
Texte spielen eine entscheidende Rolle bei der Barrierefreiheit. Der KI-Textoptimierer hilft Ihnen, die Texte so anzupassen, dass sie einfacher zu lesen und zu verstehen sind, was insbesondere Menschen mit kognitiven Einschränkungen zugutekommt. Darüber hinaus unterstützt Sie das Tool dabei, eine klare und konsistente Sprache zu verwenden, die für alle Nutzenden zugänglich ist.
KI SEO-Assistent
Barrierefreiheit und Suchmaschinenoptimierung gehen oft Hand in Hand. Der KI SEO-Assistent gibt Empfehlungen, die nicht nur die Sichtbarkeit der Website verbessern, sondern auch deren Zugänglichkeit erhöhen. So sind beispielsweise eine logische Überschriftenstruktur und die Verwendung von ALT-Attributen sowohl für eine bessere Interpretation der Inhalte durch Suchmaschinen als auch im Hinblick auf Barrierefreiheit wichtig.
KI-Bildgenerator
Der KI-Bildgenerator erstellt Bilder nach Ihren Vorgaben. Durch das Hinzufügen von Alt-Texten bei der Bildgenerierung können Sie dazu beitragen, die Barrierefreiheit von visuellen Inhalten zu verbessern.
Nutzen Sie jetzt den STRATO Homepage-Baukasten und die innovativen KI-Features, um Ihre Website nicht nur ästhetisch ansprechend und funktional, sondern auch barrierefrei zu gestalten.
