Tutorials, Easy Checks & Co. Barriere­freiheits­helferlein vom W3C Eric Eggert • A-TAG’14 • 8. Mai 2014 • Wien

Intro

Eric Eggert, Essen
W3C WAI
yatil.net • @yatil

Relation between UAAG, WCAG and ATAG.

WCAG, ATAG & UAAG

Spezifikationen

IndieUI

Illustration of 4 scroll down user actions (described in the main content) going into a filter labeled IndieUI Events. Under filter is 'scrollrequest(x/y)', and an arrow pointing to it from a Web App.

Lehrmaterialien

Easy Checks

Checks für

  • Seitentitel
  • Bildalternativtexte
  • Überschriften
  • Kontrast
  • Textvergrößerung
  • Tastaturfokus und visueller Fokus
  • Formulare, Labels und Fehlermeldungen
  • Multimedia-Alternativen
  • Grundlegende Struktur
Screenshot Headings-Abschnitt
Screenshot Überschriften testen mit der Firefox Toolbar
w3.org/WAI/eval/preliminary

Bonus Level!

WCAG-EM
w3.org/TR/WCAG-EM/

Before and After Demo

aka BAD

Screenshot „News“ Inaccessible
Screenshot „News“ Accessible
Screenshot „News“ Accessible Report
Screenshot „News“ mit Anmerkungen
Screenshot Anmerkung 1 Screenshot Anmerkung 2
w3.org/WAI/demos/bad/

Web Accessibility Tutorials

Zielgruppen:

  • Webentwickler
  • Webdesigner
  • Lehrer
  • Webautoren
  • Projektmanager

Tutorials:

  • Bilder
  • Tabellen
  • Formulare
  • Inhalte verstecken & anzeigen
  • Bildwechsler und Karusselle?
  • …
Screenshot „Images used for identification“ Zoomed-in example Zoomed-in code
Screenshot Textbild Screenshot Beispiel CSS Screenshot Beispiel Code
Screenshot „Table with an offset column of header cells“

w3.org/WAI/tutorials/

Entwicklung:
github.com/w3c/wai-tutorials
Vorschau:
w3c.github.io/wai-tutorials

Danke!

w3.org/People/yatil/presentations/atag-2014/