Barrierefreiheit ist für alle hilfreich – und ab 2025 gesetzlich vorgeschrieben!
Barrierefreiheit ist nicht nur für Menschen mit (Schwer-)Behinderung wichtig. Die Gruppe, der barrierefreies Internet das Leben erleichtert, ist viel größer!
Hört man das Wort Barrierefreiheit, denkt man an Menschen im Rollstuhl mit schweren Behinderungen oder Einschränkungen. Aber tatsächlich ist eine barrierefreie Website für alle(!) Menschen zumindest zeitweise hilfreich. Sei es, weil sie temporär etwa durch eine Verletzung eingeschränkt sind, oder auch nur situativ durch
- Lärm am Bahnhof,
- ein Baby auf dem Arm,
- eine Katze auf dem Schoß,
- eine Sprachbarriere,
- ungünstige Sichtverhältnisse.
Wann haben Sie sich das letzte Mal über zu viele Klicks oder eine unübersichtliche Website geärgert? Zahlreiche Studien zeigen:
Sie würden gerne sehen, wie eine barrierefreie Website aussieht?
Das Jobcenter Bremen ist mit uns den Weg in die Barrierefreiheit gegangen. Lesen Sie hier alles über das Projekt: Ich bin … die benutzerfreundlichste Jobcenter-Website in Deutschland.
Das kommende EU-Gesetz zur Barrierefreiheit
Ab 2025 führt die Europäische Union wahrscheinlich ein neues Gesetz zur digitalen Barrierefreiheit ein. Das Gesetz würde viele Unternehmen und Organisationen verpflichten, ihre Websites und mobilen Anwendungen barrierefrei zu gestalten. Informieren Sie sich deswegen, ob das Gesetz für Sie gilt. Eine frühzeitige Anpassung an diese gesetzlichen Anforderungen schützt Sie vor möglichen Sanktionen. Und: Es verschafft Ihnen einen Vorsprung gegenüber der Konkurrenz – so oder so, denn …
Die Vorteile einer barrierefreien Website
- Erweiterte Zielgruppe: Eine barrierefreie Website ermöglicht es Menschen mit Behinderungen und Einschränkungen, Ihre Produkte und Dienstleistungen zu nutzen. Das bedeutet: mehr potenzielle Kund*innen für Ihr Unternehmen.
- Höhere Performance: Barrierefreie Websites sind oft intuitiver und benutzerfreundlicher. Das führt zu höherer Verweildauer, niedriger Absprungrate und besseren Konversionsraten.
- Suchmaschinenoptimierung (SEO): Es gibt eine positive Korrelation zwischen Barrierefreiheit und hoher Sichtbarkeit in Suchmaschinen. Das ist kein Zufall: Barrierefreiheit bedeutet oft automatisch bessere Strukturen, eine gute UX und gute Lesbarkeit der Inhalte – davon profitiert moderne SEO.
- Rechtliche Sicherheit: Mit der Einhaltung des kommenden EU-Gesetzes zur Barrierefreiheit sind Sie auf der sicheren Seite und vermeiden rechtliche Konsequenzen.
- Fortschrittliches Markenimage: Ein Unternehmen, das auf Barrierefreiheit achtet, wird als sozial verantwortlich und fortschrittlich wahrgenommen. Das stärkt das Vertrauen und die Loyalität Ihrer Kund*innen.
1. Analyse und Beratung
Wir checken Ihre aktuelle Website umfassend. So identifizieren wir Barrieren, die wir beheben müssen. Anschließend beraten wir Sie zu den passenden technischen Lösungen, um Ihre Website barrierefrei zu gestalten.
2. Barrierefreies Webdesign und Frontend
Unsere erfahrenen Webdesigner*innen erstellen benutzerfreundliche und barrierefreie Designs, die sowohl ästhetisch ansprechend als auch funktional sind. Wir setzen im Frontend auf moderne Technologien und bewährte Praktiken, um sicherzustellen, dass Ihre Website allen Nutzer*innen gerecht wird.
3. Schulung und Unterstützung
Zu unserem Angebot gehört immer auch eine TYPO3-Schulung, in der Sie den Umgang mit Ihrer neuen Website von unseren Entwickler*innen lernen. Auch Teil der Schulung: Die Prinzipien der Barrierefreiheit und wie Sie diese in Ihren täglichen Arbeitsablauf integrieren. Darüber hinaus stehen wir Ihnen auch nach der Implementierung auf Wunsch mit technischem Support und regelmäßigen Updates zur Seite.
Tab-Fallen
Eine Tab-Falle entsteht, wenn ein*e Nutzer*in nicht mehr aus einem bestimmten Bereich einer Website heraus navigieren kann, nachdem er/sie ihn mit der Tab-Taste betreten hat. Dies kann dazu führen, dass Nutzer*innen, die auf die Tastatur angewiesen sind, „gefangen“ sind: Sie können die Seite nicht mehr ordnungsgemäß bedienen.
Ein Beispiel für Tab-Fallen:
Stellen Sie sich ein modales Fenster (Pop-up) auf einer Website vor. Wenn dieses Fenster erscheint und der/die Nutzer*in hinein „tabbt“, sollte er/sie idealerweise durch alle interaktiven Elemente innerhalb des Fensters navigieren können und dann wieder zurück zur Hauptseite „tabben“ können, wenn das Fenster geschlossen ist. Eine Tab-Falle entsteht, wenn der/die Nutzer*in im modalen Fenster gefangen ist und nicht mehr zur Hauptseite zurückkehren kann. Dies kann passieren, wenn das Schließen des Fensters per Tastatur nicht korrekt implementiert ist.
Die Lösung:
- Fügen Sie ein klares, gut sichtbares Schließen-Symbol hinzu, das auch per Tastatur erreichbar ist.
- Beim Schließen des Fensters sollte der Fokus zurück auf das Element gesetzt werden, welches das Fenster geöffnet hat.
Nutzbarkeit für Screenreader
Screenreader sind Softwareprogramme, die sehbehinderten Nutzer*innen helfen, die Inhalte einer Website durch Vorlesen des Textes und Beschreiben von Elementen zugänglich zu machen. Damit Screenreader effektiv arbeiten können, müssen Websites bestimmte Standards und Praktiken einhalten.
Ein Beispiel, was es für Screenreader zu beachten gibt:
Nehmen wir an, eine Website hat ein komplexes Navigationsmenü mit mehreren Untermenüs. Für eine*n sehende*n Nutzer*in ist es einfach, zu erkennen, welches Menüelement fokussiert ist und welche Untermenüs geöffnet sind. Ein*e Screenreader-Nutzer*in hingegen benötigt klare Hinweise und Beschreibungen, um zu verstehen, wie das Menü strukturiert ist und wie es navigiert werden kann.
Die Lösung(en):
- ARIA-Labels und -Rollen: Verwenden Sie ARIA-(Accessible Rich Internet Applications)Attribute, um Screenreadern zusätzliche Informationen zu geben. Zum Beispiel kann das Attribut ‘aria-expanded’ anzeigen, ob ein Menüelement ein Untermenü hat und ob dieses geöffnet oder geschlossen ist.
- Sinnvolle Alternativtexte: Stellen Sie sicher, dass Bilder und grafische Elemente mit Alternativtexten (‘alt’-Attribut) versehen sind, die den Inhalt oder Zweck des Bildes beschreiben.
- Überschriftenstruktur: Nutzen Sie eine klare Hierarchie von Überschriften (‘<h1>’, ‘<h2>’, ‘<h3>’), um den Screenreader-Nutzer*innen eine sinnvolle Struktur der Inhalte zu bieten.
- Beschriftung von Formularfeldern: Jedes Formularfeld sollte ein zugehöriges ‘label’ haben, das den Zweck des Feldes beschreibt. Dies hilft Screenreadern, die Felder korrekt zu identifizieren und den Nutzer*innen zu vermitteln.
Unsere Erfolgsgeschichte mit dem Jobcenter Bremen
Auf der Website des Jobcenters Bremen finden Sie im Footer das BITV-konform-Siegel von BIK für alle. Es zertifiziert, dass die Website den BITV-Test für Barrierefreiheit bestanden hat. In diesem Test wird eine Website in 98 Prüfschritten (achtundneunzig!) auf digitale Barrierefreiheit geprüft – und zwar auf Herz und Nieren! Ein Fehler bedeutet: nicht bestanden. Sie werden es sich gedacht haben: Mit der Website des Jobcenters haben wir den Test bestanden. Und von allem, was wir dabei gelernt haben, profitiert auch Ihre Website. Den Test müssen Sie dann selbst durchführen lassen, aber unsere Basis bringt alles mit, um ihn zu bestehen!