Ende März hatten wir die deutsche Koryphäe in Sachen Barrierefreiheit zu Gast bei sipgate: Autor und Accessibility-Experte Jan Hellbusch machte mit uns einen zweitägigen Workshop, stellte unsere Webseiten auf die Probe und brachte uns die Grundzüge der digitalen Barrierefreiheit näher. Bei der anschließenden Lean DUS gab er unseren knapp 200 Besuchern einen Einblick ins Thema „Barrierefreies Webdesign – WCAG 2.0 erfolgreich umsetzen“.
Digitale Barrierefreiheit bei der Aktion Mensch
Los ging es bei der Lean DUS zunächst mit Ingo Emons, Leiter E-Commerce bei Aktion Mensch. Die Aktion Mensch hat unter dem Motto „Einfach für Alle“ ein umfangreiches Angebot zum Thema Barrierefreiheit zusammengestellt und unterstützt Unternehmen beim Verständnis und der Umsetzung digitaler Barrierefreiheit. Wichtigster Punkt aus seinem Talk:
„Barrierefreiheit im Internet nützt nicht nur Menschen mit Behinderung, sondern ist für alle gut.“
Jeder Nutzer und damit potentieller Kunde profitiert von einfachen Texten mit verständlichen Botschaften, leichter und intuitiver Bedienbarkeit, hohen Kontrasten und erhöhter Auffindbarkeit durch suchmaschinenfreundliche Inhalte. Der Film „Das erste Mal“ rundete Ingos Vortrag emotional ab.
6 Tipps für die Gestaltung barrierefreier Webseiten
Dass Barrierefreiheit nicht nur das Recht auf Bildung, sondern auch das Recht auf Teilhabe ist, stellte auch Jan Hellbusch zu Beginn seines Talks klar. Wie nähert man sich in der Praxis dem Thema Barrierefreiheit? Wie gestaltet man Webseiten so, dass sie für alle zugänglich und nutzbar sind?
Wer nach einer gesetzlichen Grundlage für Barrierefreiheit sucht, stößt auf Abkürzungen wie WCAG 2.0, W3C oder BITV und ist vermutlich erst einmal verwirrt, wann wie was für wen gilt. Deshalb der erste Tipp:
1: Starte mit einem Blick auf die WCAG 2.0
Die Web Content Accessibility Guidelines in der zweiten Auflage (WCAG 2.0) sind 12 Richtlinien, die die 4 Prinzipien Wahrnehmbarkeit, Bedienbarkeit, Verständlichkeit und Robustheit konkretisieren. Für jede dieser Richtlinien gibt es insgesamt 61 Erfolgskriterien, die testbar sind. Da die WCAG 2.0 sehr umfangreich sind, gibt es Dokumente, die den praktischen Einstieg erleichtern:
Die WCAG 2.0 auf einen Blick
Wie man WCAG 2.0 erfüllt (Schnellreferenz)
2: Schreib‘ konsequent semantisches HTML
Wer HTML immer richtig und konsequent semantisch einsetzt, bekommt die Basis für Barrierfreiheit frei Haus. Korrekt in HTML definierte Überschriften, Absätze, Listen und Tabellen strukturieren die Seite für Jeden nachvollziehbar. Das bedeutet im Umkehrschluss natürlich, div-Gewitter zu vermeiden und die Semantik nicht über CSS zu lösen. Screenreader bekommen CSS übrigens nicht mit.
3: Nutze Alt-Texte bei Bildern
Apropos Screenreader: Die Verwendung eines Alt-Textes für Bilder ist die einzige Möglichkeit, das Motiv des Bildes für Menschen mit Sehbehinderungen zugänglich zu machen. Zwar gibt es nicht den einen richtigen Alternativtext, da jeder Mensch seine eigene Vorstellungskraft hat. Jedoch kann der Alternativtext mehr oder weniger geschickt gewählt werden. Hier gibt es Tipps zum Formulieren treffender Alt-Texte.
4: Schreib‘ Audiodeskriptionen für Videos
Untertitel geben ausschließlich Audioinformationen wider. Audiodeskriptionen schildern dagegen wichtige visuelle Details, die aus der reinen Audiospur nicht hervorgehen. Diese Informationen sollten separat definiert und nachgehalten werden.
5: Mach‘ Deine Webseite mit der Tastatur navigierbar
Barrierefrei kann eine Webseite nur sein, wenn sie komplett mit der Tastatur bedienbar ist. Es reicht nicht, ausschließlich für Maus und Touchscreen zu optimieren.
6: Beachte Kontrast und Farbe
Nicht nur ältere Menschen mit schlechtem Sehvermögen sind auf hohe Kontraste angewiesen. Es gibt einen sogenannten Kontrastmodus, der alle im CSS gesetzten Farben überschreibt, um eine bestmögliche Lesbarkeit der Inhalte zu gewährleisten. Dabei gehen andere Informationen verloren, wie etwa im CSS gesetzte Background-Images.
Barrierefreiheit? Einfach anfangen!
Es ist wichtig, dass man sich bei der Gestaltung von Webseiten mit Barrierefreiheit beschäftigt. Weil es nicht nur Einzelnen hilft, sondern für Alle gut und fair ist. Wer anfangen möchte, bekommt mit diesen 6 Tipps einen ersten Einstieg. Noch viel mehr zum Nachlesen gibt’s auf barrierefreies-webdesign.de und auf einfach-fuer-alle.de der Aktion Mensch.
Du konntest bei der Lean DUS nicht dabei sein? Dann gibt es hier das Video zum Abend mit Jan Hellbusch und Ingo Emons:
Keine Kommentare