Das Dokument thematisiert die Herausforderungen und Missverständnisse rund um die Barrierefreiheit im Web. Es wird argumentiert, dass Barrierefreiheit nicht kompliziert ist, wenn man die richtigen Technologien anwendet und Daten effektiv verwaltet. Die Trennung von Daten und Darstellung wird als Schlüssel zur Schaffung zugänglicher Lösungen hervorgehoben.

1. Barrierefreiheit im
Netz der Daten
Chris2an Heilmann, Best of Accessibility, Duesseldorf, September 2009

2. Webentwickler habens
schwer.

3. Barrierefreiheit ist
eigentlich einfach.

4. Ein Problem ist das das
“Problem Barrierefreiheit”
auf uns abgeschoben wird.

5. Und wenn wir dann etwas
fast barrierefrei erstellt
haben meckern
hauptsächlich andere
Entwickler...

6. Die Hauptursache fuer
dieses Dilemma ist das wir
das Web falsch anpacken.

7. Web Technologie ist nicht
so schlecht wie wir sie
immer darstellen...

8. 160x200 Aufloesung
16 Farben
4 Farben in jedem 8x8 Block

13. Web Technologien sind gut
genug ‐ wenn man sie
rich2g anwendet.

14. hVp://uk.tv.yahoo.com

15. hVp://uk.tv.yahoo.com

16. hVp://finance.yahoo.com/currency‐converter?
u#from=USD;to=EUR;amt=1

17. Screenshot of a currency converter with
and without JavaScript. With JavaScript you
get autosuggestions.

20. hVp://developer.yahoo.net/blog/archives/2009/01/
accessible_converter.html

21. Das Web ist nicht die Seite

22. Das Web ist nicht der code

23. Das Web besteht aus
leckeren Daten!

28. Zugang zu diesen Daten zu
erlauben bedeutet
Barrierefreiheit.

30. Um Daten einfach zu
verwalten, macht es Sinn
sie im Netz zu verteilen.

31. CMS

32. CMS
Tags, Comments, Connections, Embeds

33. Indem wir die Daten und
die Darstellung
voneinander trennen,
können wir aufzeigen, wie
barrierefreie Lösungen
aussehen.

34. Easy Flickr screenshot
showing donkeys
hVp://icant.co.uk/easy‐flickr/index.php?s=donkeys

36. hVp://icant.co.uk/easy‐youtube/?hVp://
www.youtube.com/watch?v=vkdZmi85gxk

37. Einfache Bedienungen
Suchfunk2on
Copy+Paste URL zum weiterleiten
Verschiedene Videogrössen
Einfache Lautstärkenregelung
Playlist miVels Del.icio.us
YouTube Suche
Open Source

38. hVp://www.youtube.com/watch?v=CwsDKaalgq8
hVp://www.youtube.com/watch?v=QiuT0y0KR6I

39. hVp://www.slideshare.net/hi.antonia/rich‐media‐and‐
web‐apps‐for‐people‐with‐learning‐disabili2es

40. hVp://video.yahoo.com

42. Trick #1 mit Flash:
Abspielknöpfe ausserhalb
des Filmes ablegen!

43. hVp://www.schillmania.com/projects/soundmanager2/

46. hVp://dt.in.th/2008‐05‐18.javascript‐karaoke‐lyric‐scroller.html

47. Screenshot of the JW Video Player
hVp://www.jeroenwijering.com/?item=JW_FLV_Player

49. hVp://icant.co.uk/sandbox/youtube‐cap2oning.html

51. hVp://www.youtube.com/watch?v=_vJlADxbv4U&

52. DE
AD
hVp://www.nihilogic.dk/labs/youtubeannota2ons/

53. DE
AD
hVp://www.tubecap2on.com/watch?
v=jpCPvHJ6p90&vcId=137

54. Das Internet zu ändern ist
schwierig.

55. Redesigns von Webseiten
gehen meistens in die Hose.

56. Menschen lernen am
besten indem sie mit
etwas spielen.

57. Auch ihr könnt mit dem
Web spielen und etwas
Neues erstellen.

58. Eines meiner
Lieblingsspielzeuge.

62. Picture of
Artur Ortega
hVp://www.flickr.com/photos/redux/2474124685/

63. hVp://icanhaz.com/twiVerwithlang

66. hVp://www.wait‐2ll‐i.com/2008/11/23/show‐the‐world‐your‐
twiVer‐type‐using‐php‐and‐google‐charts/

69. hVp://www.nicosteiner.de/archives/118‐YQL,‐YUI‐und‐
Yahoo!‐Pipes.html

70. hVp://pipes.yahoo.com

71. YQL hVp://developer.yahoo.com/yql/console/

72. YQL hVp://developer.yahoo.com/yql/console/
select {was} from {wo}
where {kondi2onen}

80. hVp://isithackday.com/hacks/frankfurt

86. Kobayashi Maru

87. select * from html
where
url="http://faz.de" and
xpath="//h2 "

88. select * from
google.translate where q in (
select a from html where
url="http://faz.de"
and xpath="//h2"
) and target="en"

89. select title from
twitter.user.timeline where
title like "%http%" and
id="codepo8" or id="ydn"

90. Vorteile von YQL
๏ APIs einfach mischen
๏ Resultate ausfiltern
๏ Einfache API Anmeldung
๏ Als Konsole oder Code
๏ Dokumenta2on inklusive
๏ Yahoos server als proxy
und Zugang.

91. HTML als Datenquelle?
hVp://www.dcs.gla.ac.uk/~joy/fun/jokes/TV.html

92. hVp://isithackday.com/hacks/scraping‐with‐yql/

93. Zeigt her eure Daten...
hVp://developer.yahoo.com/yql/guide/yql‐opentables‐chapter.html

94. INSERT INTO bitly.shorten (login, apiKey, longUrl) VALUES ('USERNAME', 'API_KEY', 'hVp://
yahoo.com')
hVp://developer.yahoo.com/yql/guide/yql‐iud‐statements.html

96. http://github.com/spullara/yql-tables/tree/master

97. Und was hily uns beim
Webseiten erstellen?

98. Libraries.
(...)

99. ARIA

100. hVp://www.paciellogroup.com/blog/?cat=23
hVp://paciellogroup.com/blog/misc/ARIA/atmedia2008/

101. ARIA

102. hVp://yuiblog.com/blog/category/accessibility/

103. hVp://code.google.com/p/google‐axsjax/

104. hVp://code.google.com/p/majx‐js/

105. Zeigt, was in euch steckt...

106. Und hely Leuten wie mir
das web weiter zu
entwickeln und dabei nicht
Barrieren zu erstellen.
HTML5? Canvas?
Chrome Frame?

107. Man braucht nicht alles
alleine zu machen. Wir alle
wollen das gleiche ‐ ein
Web, das funk2oniert.

108. Chris2an Heilmann
hVp://wait‐2ll‐i.com
Danke!
hVp://developer‐evangelism.com
hVp://twiVer.com/codepo8