Barrierefreiheit auf Websites ist für alle hilfreich – und ab 2025 gesetzlich vorgeschrieben!
Barrierefreie Websites sind nicht nur für Menschen mit (Schwer-)Behinderung wichtig. Die Gruppe, der Barrierefreiheit auf Websites 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 hast du dich das letzte Mal über zu viele Klicks oder eine unübersichtliche Website geärgert? Zahlreiche Studien zeigen:
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. Informiere dich deswegen, ob das Gesetz für dich gilt. Eine frühzeitige Anpassung an diese gesetzlichen Anforderungen schützt dich vor möglichen Sanktionen. Und: Es verschafft dir einen Vorsprung gegenüber der Konkurrenz – so oder so, denn …
Die Vorteile einer barrierefreien Website (in TYPO3)
- Erweiterte Zielgruppe: Eine barrierefreie Website ermöglicht es Menschen mit Behinderungen und Einschränkungen, deine Produkte und Dienstleistungen zu nutzen. Das bedeutet: mehr potenzielle Kund*innen für dein Unternehmen.
- Höhere Performance: Barrierefreie Websites sind oft intuitiver und benutzerfreundlicher. Das führt zu höherer Verweildauer, niedriger Absprungrate und besseren Konversionsraten. Wir haben alles dafür gegeben, dass die artundweise-Basis in TYPO3 barrierefreie Websites bestmöglich performen lässt – optimiert auf Ihre KPIs.
- 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. TYPO3 bietet alle SEO-Kriterien, die wichtig sind, damit Ihre barrierefreie Website optimal bei Google rankt.
- Rechtliche Sicherheit: Mit der Einhaltung des kommenden EU-Gesetzes zur Barrierefreiheit bist du 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 deiner Kund*innen.
1. Barrierefreiheit-Quick-Check
Wir checken den aktuellen Stand deiner TYPO3-Website, identifizieren Barrieren und zeigen dir, was Barrierefreiheit für genau deine Website bedeutet. Wir führen dich an das Thema barrierefreie Websites heran – ohne dabei direkt in komplexe technische Details einzutauchen. Anschließend beraten wir dich zu passenden technischen Lösungen, um deine Website barrierefrei zu gestalten.
2. Tiefgehende Barrierefreiheitsprüfung
Hier tauchen unsere Programmierer*innen (manchmal arbeiten wir auch mit externen Expert*innen zusammen) ganz tief in deine Website ein. Übrigens ganz unabhängig vom System! Alle technischen Details und Features werden mit der Barrierefreiheits-Brille intensiv geprüft. Das Ergebnis ist ein ausführliches Lastenheft, das alle Anforderungen an deine Website vollständig darlegt – und damit eine barrierefreie Website ermöglicht.
3. Umsetzung Ihrer barrierefreien Website
Barrierefreies Backend, Webdesign und Frontend – das können wir alles für dich übernehmen. Unser Backend-Team löst alle technischen Schritte, während unsere erfahrenen Webdesigner*innen benutzerfreundliche und barrierefreie Designs erstellen, die sowohl ästhetisch ansprechend als auch funktional sind. Wir setzen im Frontend auf moderne Technologien und bewährte Praktiken, um sicherzustellen, dass deine Website allen Nutzerinnen gerecht wird.
4. Schulung und Unterstützung
Zu unserem Angebot gehört immer auch eine TYPO3-Schulung, in der du den Umgang mit deiner neuen Website von unseren Entwickler*innen lernst. Auch Teil der Schulung: die Prinzipien der Barrierefreiheit und wie du diese in deinen täglichen Arbeitsablauf integrierst. Darüber hinaus stehen wir dir auch nach der Implementierung auf Wunsch mit technischem Support und regelmäßigen Updates zur Seite.
5. Barrierefreier Content
Barrierefreiheit endet nicht beim Design und Code – sie geht weiter in den Inhalten. Wir helfen dir, Texte, Bilder und Multimedia-Elemente so aufzubereiten, dass sie für alle Nutzerinnen zugänglich sind. Dazu gehören gut strukturierte Inhalte, verständliche Sprache, alternative Bildbeschreibungen und barrierefreie PDFs. Unsere Expert*innen zeigen dir, worauf es ankommt, und unterstützen dich bei der Erstellung oder Optimierung deiner Inhalte. So stellst du sicher, dass deine Website nicht nur technisch barrierefrei ist, sondern auch inhaltlich für alle funktioniert.
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:
Stell dir vor, ein modales Fenster (Pop-up) erscheint auf einer Website. Wenn dieses Fenster erscheint und du hinein „tabbst“, solltest du 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 du im modalen Fenster gefangen bist und nicht mehr zur Hauptseite zurückkehren kannst. Das kann passieren, wenn das Schließen des Fensters per Tastatur nicht korrekt implementiert ist.
Die Lösung:
- Füge 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 gelenkt 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: Verwende 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: Stelle sicher, dass Bilder und grafische Elemente mit Alternativtexten (‘alt’-Attribut) versehen sind, die den Inhalt oder Zweck des Bildes beschreiben.
- Überschriftenstruktur: Nutze 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 findest du 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. Du wirst es dir schon gedacht haben: Mit der Website des Jobcenters haben wir den Test bestanden. Und von allem, was wir dabei gelernt haben, profitiert auch deine Website. Den Test musst du dann selbst durchführen lassen, aber unsere Basis bringt alles mit, um ihn zu bestehen!
