Barrierefrei kommunizieren 1. Besser Online 2012 - DJV 15. September 2012
Barrierefrei Kommunizieren
Jan Eric Hellbusch
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
2. Besser Online 2012 - DJV 15. September 2012
In Deutschland gibt es eine Gesetzeslage
• BITV 2.0: Verordnung zum
Behindertengleichstellungsgesetz
• Für Behörden des Bundes verpflichtend
• Bezieht sich seit 2011 auf die Web Content
Accessibility Guidelines 2.0
• Die Länder-BITVs - sofern vorhanden -
beziehen sich auf WCAG 1.0
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
3. Besser Online 2012 - DJV 15. September 2012
Maßgeblich sind Webstandards
• Die Web Content Accessibility Guidelines
(WCAG) 2.0 wurden in Dezember 2008 vom
World Wide Web Consortium (W3C) als
Webstandard veröffentlicht.
• Ausrichtung an moderne Webtechniken.
• Anforderungen (behinderter) Nutzer, aber auch
der Webentwickler, Software-Hersteller und
nicht zuletzt der Zertifizierer.
• Grundlage für viele Gesetze weltweit.
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
4. Besser Online 2012 - DJV 15. September 2012
Standardisierung in Europa
Human Factors; European accessibility requirements
for public procurement of ICT products and services
•Mandate 376: Europäische Standards zur
Zertifizierung der Barrierefreiheit
• Richtlinien einschließlich WCAG 2.0 und Teile
der ISO 9241
• Testanleitungen, Werkzeugkiste
• Geplantes Inkrafttreten: Februar 2014
Weitere Informationen auf www.mandate376.eu.
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
5. Besser Online 2012 - DJV 15. September 2012
Vergrößerungssysteme
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
6. Besser Online 2012 - DJV 15. September 2012
Vergrößerungsausschnitte
Bei Vergrößerung wird immer
nur eine Teilansicht dargestellt.
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
7. Besser Online 2012 - DJV 15. September 2012
Benutzerdefinierte Farben
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
8. Besser Online 2012 - DJV 15. September 2012
Tasten, hören und schlecht sehen
Es gibt unterschiedliche
Ausgabe- und
Eingabegeräte.
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
9. Besser Online 2012 - DJV 15. September 2012
Wer Tastatur und Maus nicht nutzen
kann, ...
... braucht eine
Spezialmaus.
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
10. Besser Online 2012 - DJV 15. September 2012
Computer mit Blindenhilfsmitteln
Die Hilfsmittel:
• Screenreader
•Sprachausgabe
• Braillezeile
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
11. Besser Online 2012 - DJV 15. September 2012
Thema Kontrast
Helligkeitskontraste werden anhand eines Algorithmusses der
WCAG 2.0 gemessen. Das Kontrastverhältnis kann zwischen 1:1
(kein Helligkeitsunterschied) und 21:1 (schwarz/weiß) liegen.
• Konflikte: Corporate Design, grafisches Design
• Minimales Kontrastverhältnis (AA): 4,5:1(normale Schrift)
bzw. 3:1 ( große Schrift; Ausnahme Logos)
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
12. Besser Online 2012 - DJV 15. September 2012
Hintergrundgrafiken
Hintergrundgrafiken werden im Kontrastmodus als
Hintergrund behandelt; entsprechend werden sie im
Kontrastmodus ausgeblendet.
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
13. Besser Online 2012 - DJV 15. September 2012
Skalierbarkeit
Im Mittelpunkt der WCAG-Anforderung steht die
Textvergrößerung:
• Alle Browser bieten eine Seitenzoom-Funktion
• Besser nutzbar ist ein elastisches Layout, das
auf die reine Schriftvergrößerung reagiert
• Optimale Lösungen gibt es nicht; ein flüssiges
Layout gilt nachwievor als Best-Practice
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
14. Besser Online 2012 - DJV 15. September 2012
Seitenzoom
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
15. Besser Online 2012 - DJV 15. September 2012
Strukturen in HTML
Mit HTML 4 geht es im Inhalt im Wesentlichen um
1. Überschriften
2. Listen
3. Absätze
4. Datentabellen
Technisch ist der richtige Einsatz das Handwerk, das
jeder beherrschen muss. Es kann aber nicht alles mit
diesen Elementen abgebildet werden.
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
16. Besser Online 2012 - DJV 15. September 2012
Alternativtexte für Bilder
Die Formulierung von Alternativtexten für Grafiken
hängt von vielen Faktoren ab, etwa Kontext des Bildes.
Es ist eine eigene "Kunst".
• Schriftgrafiken: Abgebildeter Text im alt-Attribut
• Layout-Elemente: Leeres alt-Attribut oder per
CSS einbinden
• Fotos: eine kurze Beschriftung oder
Identifikation
• Schaubilder: Identifikation und entweder eine
lange Beschreibung oder Hinweis auf Kontext
• Verlinkte Grafiken: Etwas über das Linkziel
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
17. Besser Online 2012 - DJV 15. September 2012
Tastaturbedienung
Screenreader-Nutzer verwenden meist die strukturelle
Navigation des Screenreaders. Vor allem für sehende
Tastaturnutzer müssen Webseiten bedienbar bleiben.
• Bedienung mit der Tab-Taste muss
gewährleistet werden:
1. Links und Steuerelemente (<a href> statt
<span>)
2. Reihenfolge folgt Quellcode (tabindex
vermeiden)
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
18. Besser Online 2012 - DJV 15. September 2012
Sichtbarer Fokus
Der Fokus muss immer sichtbar bleiben.
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
19. Besser Online 2012 - DJV 15. September 2012
Schreckgespenst PDF
Portable Document Format müssen auch barrierefrei sein:
• Strukturen wie in HTML
• Voraussetzung: Formatvorlagen korrekt einsetzen
• Ab Microsoft Word 2010 „out of the box“ möglich
• Hilfreiche Plugins: AxesPDF (Word) und „Made to tag“
(Indesign)
• Nacharbeit in Adobe ist unverhältnismäßig teuer
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de
20. Besser Online 2012 - DJV 15. September 2012
Ende der Folien
© Jan Eric Hellbusch (1967 - 2012)
hellbusch@2bweb.de http://2bweb.de