Flash, Ajax&
Barrierefreiheit

Tomas Caspers
berät Industrie, NGOs und
Behörden, baut Websites,
schreibt Bücher darüber
und hält Vorträge
(und mag Akzidenz-Grotesk viel lieber als Helvetica).

http://www.patramsey.net/2007/the-accessible-web/

1997

1997

1997
http://www.w3.org/Style/CSS/Test/w3c.html

?
Web-Standards
Ja, nee, is klar!

Die Folgen:
div.content {
width:400px;
voice-family: \"\\\"}\\\"\";
voice-family:inherit;
width:300px;
}
html>body .content {
width:300px;
}
(ekelig, oder?)

Frames!
Farbige Scrollbalken!
Aufklappmenüs! Animierte
Schneeflocken!
Ticker! Seitenübergänge!
Die aktuelle Uhrzeit!
Browser-Chrome verstecken!
Hintergrundmusik!
Countdown bis
Pop-Ups! Weihnachten!
<A onMouseOver=\"window.status='hier
klicken!'; return true;\">

Frames!
Farbige Scrollbalken!
Aufklappmenüs! Animierte
Schneeflocken!
Ticker! Seitenübergänge!
BÖSE!
Die aktuelle Uhrzeit!
Browser-Chrome verstecken!
Hintergrundmusik!
Countdown bis
Pop-Ups! Weihnachten!
<A onMouseOver=\"window.status='hier
klicken!'; return true;\">

Frames!
Farbige Scrollbalken!
Aufklappmenüs! Animierte
Schneeflocken!
Ticker! Seitenübergänge!
Die aktuelle Uhrzeit!
Browser-Chrome verstecken!
Hintergrundmusik!
Countdown bis
Pop-Ups! Weihnachten!
<A onMouseOver=\"window.status='hier
klicken!'; return true;\">

Frames!
Farbige Scrollbalken!
NOCH
Aufklappmenüs! Animierte
Schneeflocken!
Ticker! Seitenübergänge!
Die aktuelle Uhrzeit!
IMMER Browser-Chrome verstecken!
Hintergrundmusik!
Countdown bis
Pop-Ups!
BÖSE! Weihnachten!
<A onMouseOver=\"window.status='hier
klicken!'; return true;\">

Barrierefreiheit?
© http://www.flickr.com/photos/webseeings/239301576/

WTF?

WCAG2.0?

WCAG2.0?
10 PRINT \"WCAG\"
20 GOTO 10

Checklisten-
Syndrom?

© http://www.flickr.com/photos/chuckbiscuito/161971512/
Real World User Testing

© http://www.flickr.com/photos/kosmar/323809582/

Applikation
!=
Dokument

?
Web-Standards
Besserung in Sicht?

?
Sonderlösung

Der Praxisteil:
• Flash- &
AJAX-Mythen

Der Praxisteil:
• Flash- &
AJAX-Mythen
(Standardistus argumentatavum Maximus)

Der Praxisteil:
?
• Flash & AJAX ist:
nix für Suchmaschinen

Der Praxisteil:
?
• Flash ist:
kein Open Source

Der Praxisteil:
?
• Flash ist:
nicht barrierefrei

Der Praxisteil:
?
• Flash & AJAX ist:
nix für Screenreader

http://de.wikipedia.org/wiki/OpenLaszlo

Der Praxisteil:
?
• Flash ist:
nix für Sehbehinderte

Der Praxisteil:
!
http://www.kaourantin.net/swf/highContrast.html
http://niquimerret.com/fontresize/
Psst: System.capabilities.hasAccessibility:true

Der Praxisteil:
?
• Flash ist:
Schuld an ...

Der Praxisteil:
?
• Flash und AJAX:
können keine
Bookmarks

http://www.flickr.com/photos/53407766@N00/55806664

Der Praxisteil:
?
• Flash & AJAX sind:
abgeschaltet

79%
aller Statistiken
sind gefälscht!
(diese eingerechnet)

Der Praxisteil:
?
• Flash & AJAX sind:
viel Arbeit, wenn
man es zugänglich
machen will

Der Praxisteil:
!
• Stimmt.

Die Prinzipien:
(der WCAG 2)
Content must be perceivable
1.
Interface elements in the content must be operable
2.
Content and controls must be understandable
3.
Content must be robust enough to work with current
4.
and future Web technologies
* http://www.w3.org/TR/WCAG20/

Die Prinzipien:
POUR

Die Prinzipien:
POURN

Die Prinzipien:
POURN

Die Prinzipien:
POUR

Ist die Zeit komplexer
Richtlinien, die alles
bis ins kleinste Detail
regeln wollen, vorbei?

=+
–( weniger ist mehr )

Danke für‘s Zuhören!
<a href=“mailto:tomas@tomascaspers.de“>Fragen?</a>

CC
<a href=“http://creativecommons.org/licenses/by-sa/2.0/de/
deed.de“ rel=“license“>Attribution-ShareAlike</a>

URLs:
Zugängliches Flash:
Kontrast:
http://www.kaourantin.net/swf/highContrast.html
Textskalierung:
http://niquimerret.com/fontresize/
Best Practice:
http://www.bbc.co.uk/accessibility/bbc/mainnews.shtml
http://www.bbc.co.uk/cbeebies/grownups/special_needs/physical_dev/switch/
http://www.bbc.co.uk/cbbc/games/switch/
http://usabletype.com/weblog/flexing-your-apps/
http://www.webaim.org/techniques/flash/
http://www.jkrowling.com/
http://www.sitepoint.com/blogs/2007/04/30/javascript-and-screen-readers/
http://labs.adobe.com/technologies/air/