WCAG 2.0 umsetzen, testen und evaluieren...WCAG 2.0 Seit 11.12.2008 W3C Recommendation 4 Prinzipien...

WCAG 2.0 umsetzen, testen und evaluieren Seminar BS 162

Barrierefreie Informationssysteme - Grundlagen

Gerhard Nussbaum

Wien, März 2017

gerhard.nussbaum@ki-i.at

Richtlinien …

Quelle: www.mfh.de

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 2 |

Die Komponenten von barrierefreiem Web

Authoring Tool

Evaluierungs Tool

Webdesigner, Autor

Webbrowser, Mediaplayer

Assistierende Technologien

Benutzer

Webinhalt

ATAG WCAG UAAG

Accessibility Richtlinien

HTML XHTML CSS

Spezifikationen

etc.

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 3 |

WCAG 2.0

Seit 11.12.2008 W3C Recommendation

4 Prinzipien

12 Richtlinien mit insgesamt 61 Erfolgskriterien

Erfolgskriterien sind in 3 Kategorien unterteilt (Level

A, AA, AAA)

Mehrere Dokumente:

– WCAG 2.0

– Understanding 2.0

– Techniques 2.0

– Requirements 2.0

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 4 |

WCAG 2.0

Vier Prinzipien:

1. Inhalt muss wahrnehmbar („Perceivable”) sein.

2. Kontrollelemente des Inhalts müssen bedienbar

(„Operable“) sein

3. Inhalt und Kontrollelemente müssen verständlich

(„Understandable“) sein

4. Der Inhalt muss robust („Robust“) genug sein, um von

aktuellen und zukünftigen Technologien verarbeitbar zu sein

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 5 |

WCAG 2.0

Konformität:

– „A“: alle Level A Kriterien

– „AA“: „A“ und alle Level AA Kriterien

– „AAA“: „AA“ und alle Level AAA Kriterien

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 6 |

WCAG 2.0

WCAG 2.0 Links:

– Richtlinien (original): http://www.w3.org/TR/WCAG20/

– Richtlinien (deutsch):

http://www.w3.org/Translations/WCAG20-de/

– Quickreference (sehr empfehlenswert):

http://www.w3.org/WAI/WCAG20/quickref/

WAI: http://www.w3.org/WAI/

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 7 |

WCAG 2.0 auf einen Blick I

Wahrnehmbar

– Textalternativen für Nicht-Text-Inhalte anbieten

– Untertitel und andere Alternativen für Multimedia anbieten

– Inhalte anbieten, die auf verschiedene Art und Weise

dargestellt werden können (auch mit assistierenden

Technologien, ohne Informationsverlust)

– Es für den Benutzer einfacher machen, den Inhalt zu sehen

und hören

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 8 |

WCAG 2.0 auf einen Blick II

Bedienbar

– Alle Funktionen sind auch ausschließlich mit Tastatur

bedienbar

– Benutzer bekommen genug Zeit, um den Inhalt zu lesen und

benutzen

– Keine Inhalte benutzen, die Anfälle auslösen können

– Dem Benutzer helfen, durch die Inhalte zu navigieren und

sie zu finden

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 9 |

WCAG 2.0 auf einen Blick III

Verständlich

– Textinhalte lesbar und verständlich machen

– Webseiten sollen vorhersehbar aussehen und funktionieren

– Benutzern dabei helfen, Fehler zu vermeiden und zu

korrigieren.

Robust

– Die Kompatibilität mit aktuellen und zukünftigen

Benutzeragenten maximieren, einschließlich assistierender

Technologien

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 10 |

EVALUIEREN

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 11 |

Tools – Browser-AddOns

Internet Explorer Web Accessibility Toolbar

https://www.paciellogroup.com/resources/wat/

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 12 |

IE Web Accessibility Toolbar

Quelle: Kerstin Matausch, Sonja Eichinger. Workshop Content barrierefrei publizieren.

HTML-Code

testen

Best. Auflösung für

das Browser-Fenster

wählen

Stylesheets

deaktivieren

Liste aller Bilder

mit Alternativtexte

einblenden

Farbkontraste

überprüfen

Überschriften, Listen, Akronyme,

Abkürzungen, Tabellenüberschriften

etc. überprüfen

Skalierbarkeit des

Layouts testen

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 13 |

Screenreader

Ein Screenreader ist ein Software-Produkt, welches

Bedienelemente und Texte mittels Sprachsynthese

akustisch zumeist über eine Soundkarte oder taktil

über eine Braillezeile ausgibt. Screenreader werden

beinahe ausschließlich mit Tastatur bedient.

Bekannte Produkte: Blindows, HAL, Jaws, Virgo,

Window-Eyes, NVDA

Jaws-Testversion:

http://www.freedomsci.de/serv01.htm

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 14 |

Text-Browser

Können nur einfachen Text und Textformate wie

HTML oder XML interpretieren und darstellen. Sind

besonders für Blinde nützlich, die das Internet

barrierefrei nutzen wollen. Mit ihnen kann Text leicht

in Sprache umgewandelt werden.

Bedienung ausschließlich über Tastatur.

Bekannte Produkte: Lynx, Elinks

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 15 |

Screenreader JAWS Bedienung

JAWS-Taste + F5 Formularmodus

JAWS-Taste + F6 Überschriften

JAWS-Taste + F7 Links

JAWS-Taste + F8 Listen

JAWS-Taste + F3 Alle Strukturmodi

JAWS-Taste = Taste „EINFÜGEN“ (meist)

Tabulator: jeweils zum nächsten fokussierbaren Element (Link, Formularfeld/Button).

Pfeiltasten: links/rechts 1 Zeichen zurück / vorwärts rauf/runter 1 Zeile hinauf / hinunter

WebAim: Using JAWS to Evaluate Web Accessibility

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 16 |

W3C Validatoren

W3C Markup Validation Service

http://validator.w3.org/

validiert den Code einer Webseite nach HTML,

XHTML, SMIL, MathML, …

W3C CSS Validierungsservice

http://jigsaw.w3.org/css-validator/

validiert die Styleheets (CSS-Daten) / Formatangaben

für die Webseiten nach CSS, SVG, …

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 17 |

Automatisierte Prüfung Farben / Kontraste

VisCheck

http://www.vischeck.com

Online-Werkzeug zur Simulation von Farbenblindheit.

Simuliert Webseite oder Bilddatei.

Rohschnitt - Kontrasttest

http://www.rohschnitt.de/drag_queen.htm

Online-Tool zum Ermitteln des Farbkontrastes

zwischen Schrift und Hintergrund einer Website.

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 18 |

Automatisierte Testtools für WCAG 2.0

Derzeit gibt es leider keine verlässlichen Tools

händisch Testen ist angesagt

Außerdem, falls man Testtools dennoch einsetzt:

Die Ergebnisse von automatischen Prüftools sind

unvollständig und müssen korrekt interpretiert werden!

Ein grünes Häkchen oder „Ja (erfüllt)“ impliziert

NICHT automatisch die Erfüllung der Kriterien für

Barrierefreiheit. Details und Hinweise sind relevant!

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 19 |

Referenzen/Quellen:

Caldwell, B., Cooper, M., Reid, L.G., Vanderheiden, G.: „Web Content

Accessibility Guidelines 2.0“, W3C Recommondation 11 December 2008, WAI,

W3C

Matausch, K., Eichinger, S.: Workshopunterlagen „Content barrierefrei

publizieren.“

WCAG 2.0 umsetzen, testen und evaluieren - BS 162, © KI-I 2017 20 |

Danke für Ihre Aufmerksamkeit!

21 |

Dipl.-Ing. Gerhard Nussbaum

Kompetenznetzwerk KI-I

Altenberger Straße 69

4040 Linz

Tel: +43 732 2468 3770

Fax: +43 732 2468 3789

gerhard.nussbaum@ki-i.at

www.ki-i.at