Abgesenkte Bordsteine im Web.Warum von Barrierefreiheit Alle profitieren.<br />Martin Kliehm. Senior Frontend Engineer.Nam...
/me<br />11.05.2010<br />Barrierefreiheit. Universität Mainz. <br />2<br />Kompetenzen<br /><ul><li>Webstandards & Browser...
Barrierefreiheit, Usability, Geräteunabhängigkeit
Internationalisierung (i18n) &Lokalisierung (L10N)
Technische Konzeption und Beratung
Internationale Konferenzbeiträge</li></ul>Gremien<br /><ul><li>Invited Expert der W3C HTML Arbeitsgruppe
Invited Expert der W3C Accessibility Task Force
Stakeholder der authorisierten deutschen Übersetzung der W3C Richtlinien für barrierefreie Webinhalte (WCAG 2.0)
Mitglied in der International Liaison Group des Web Standards Projects
Mitglied bei den Webkrauts</li></ul>Martin Kliehm.Senior Frontend Engineer.Entwicklung, Barrierefreiheit,Mobile Endgeräte,...
Interdisziplinäre Teams.<br />Namics vorgestellt.<br />11.05.2010<br />Barrierefreiheit. Universität Mainz. <br />3<br />P...
Namics vorgestellt.<br />11.05.2010<br />Barrierefreiheit. Universität Mainz. <br />4<br />
Barrierefreiheit im Web<br /><ul><li>Begriff der Behinderung
Demographie: Barrierefreiheit als Wirtschaftsfaktor
Barrierefreiheit von Websites
Herausforderungen für die Zukunft</li></ul>11.05.2010<br />5<br />Barrierefreiheit. Universität Mainz. <br />
Barrierefreiheit<br />„Barrierefrei sind […] Systeme der Informationsverarbeitung […], wenn sie für behinderte Menschen in...
Paradigmenwandel: Behinderung warursprünglich ein medizinisches Gebrechen.<br />11.05.2010<br />7<br />Barrierefreiheit. U...
Behinderung alsindividuelles Problem<br />11.05.2010<br />8<br />Barrierefreiheit. Universität Mainz.<br />Menschenwürde?<...
11.05.2010<br />9<br />Barrierefreiheit. Universität Mainz.<br />Nicht der Rollstuhl ist die Barriere,die Architektur ist ...
11.05.2010<br />10<br />Fokuswechsel: „Behinderte“ setzt die Behinderung in den Vordergrund.<br />„Menschen mit Behinderun...
11.05.2010<br />11<br />Fokuswechsel: „Behinderte“ setzt die Behinderung in den Vordergrund.<br />http://flic.kr/p/6SEier<...
11.05.2010<br />12<br />„Menschen mit Behinderungen“setzt den Menschen in den Mittelpunkt.<br />http://flic.kr/p/6SEier<br...
Paradigmenwandel:Barrierefreiheit alsnachträglicher Einfall,drangedübelt<br />11.05.2010<br />13<br />Barrierefreiheit. Un...
11.05.2010<br />14<br />Barrierefreiheit. Universität Mainz.<br />Andreas Slominski:„Rollstuhl zum Queren derTreppe in Ode...
Potemkin-Treppe in Odessa<br />http://de.wikipedia.org/wiki/Potemkinsche_Treppe<br />Barrierefreiheit. Universität Mainz. ...
Barrierefreiheit als integrales Element<br />http://flic.kr/p/55Sh6D<br />Barrierefreiheit. Universität Mainz. Namics.<br ...
http://flic.kr/p/4dqGWd<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />17<br />
http://flic.kr/p/6VCacm<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />18<br />
http://flic.kr/p/5o8k42<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />19<br />
http://flic.kr/p/8W93u<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />20<br />
http://youtu.be/ffrq6cUoE5A<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />21<br />
11.05.2010<br />22<br />Barrierefreiheit. Universität Mainz.<br />
2. Demographie: Barrierefreiheit als Wirtschaftsfaktor<br />11.05.2010<br />23<br />http://flic.kr/p/8VHFb<br />Barrierefr...
10-12%<br />http://flic.kr/p/dMFYb<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />24<br />
Menschen mit Behinderungen<br />MenschenmitBehinderungen in Deutschland:ca. 8-10 Mio. (10-12%)<br />MenschenmitBehinderung...
Familie, Freunde, Ärzte und Pflegepersonalfolgen:<br />“We could see how viral the community was. If you do something good...
Die Herausforderungen.<br />$225Mrd.<br />http://flic.kr/p/4MqfGZ<br />Barrierefreiheit. Universität Mainz. Namics.<br />1...
Wennnur 1% derBritenmitBehinderungeneineVersicherungspoliceüber £300 bestellt, verdientLegal & General £27 Mio. — die Umsa...
Nachhaltigen und langfristigenErfolgnurmitUnterstützung auf Vorstandsebene<br />Accessibility PolicyalsTeilderUnternehmens...
Kollateralnutzen. Barrierefreiheit für Alle.<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />30<br />
41%<br />http://flic.kr/p/38rGwd<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />31<br />
http://destatis.de/bevoelkerungspyramide/<br />Die Herausforderungen.<br />11.05.2010<br />32<br />Barrierefreiheit. Unive...
50-65jährige: 17 Mio. (21%; 2010)1<br />50+: 33,2 Mio. (41%; 2010), Tendenz steigend,1davonim Internet: 14,9 Mio. (44,9%; ...
Das RisikoeinerBehinderungsteigtim Alter‏<br />Wahrnehmung von Kontrasten, räumlicheWahrnehmung und Auge-Hand-Koordination...
MenschenmitLernschwierigkeiten: 5-10%<br />EinwohnermitDeutsch alsFremdsprache: 5,7 Mio. (7%)‏<br />PISA 2003 untersteKomp...
3. Barrierefreiheit von Websites<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />36<br />
mehr ...mehr ...mehr ...<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />37<br />
Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />38<br />
Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />39<br />
Wahrnehmbarkeit<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />40<br />
Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />41<br />
Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />42<br />
Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />43<br />
Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />44<br />
Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />45<br />
Schriftgröße im CSS: 11px = 68%<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />46<br />
Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />47<br />
Schriftgröße: 16px<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />48<br />
Inhalt.<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />49<br />
Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />50<br />
Die Herausforderungen.<br />1:20<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />51<br />
Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />52<br />
Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />53<br />
Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />54<br />
Captcha<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />55<br />
Zielgruppe: Alle. One Web for All.Niemanden ausgrenzen. Keine Diskriminierung.<br />http://flic.kr/p/5PYudB<br />Barrieref...
KleinerBildschirm<br />KeineMaus<br />KeinePopups<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />5...
Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />58<br />
Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />59<br />
Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />60<br />
Inhalte anreichern:Accessible Rich Internet Applications (ARIA)<br />Barrierefreiheit. Universität Mainz. Namics.<br />11....
<input type="text"aria-required="true" /><br />11.05.2010<br />62<br />http://flic.kr/p/5EqqLe<br />Barrierefreiheit. Univ...
<input type="text"aria-required="true"aria-invalid="true" /><br />11.05.2010<br />63<br />http://flic.kr/p/5EuQYq<br />Bar...
http://flic.kr/p/48LXf9<br />
http://flic.kr/p/6F8N8Q<br />http://webaim.org/blog/spam_free_accessible_forms/<br />Barrierefreiheit. Universität Mainz. ...
http://flic.kr/p/6F8Phy<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />66<br />
<ulrole="menu navigation"><br /><li role="menuitem"><a href="…">Über Fraunhofer</a></li><br /></ul><br />11.05.2010<br />B...
<arole="button"  aria-controls="nav-direct-third"tabindex="0"  title="Untermenü">Schnellzugriff</a><br /><ul id="nav-direc...
Nächste SlideShare
Wird geladen in …5
×

Abgesenkte Bordsteine im Web. Warum von Barrierefreiheit Alle profitieren.

4.432 Aufrufe

Veröffentlicht am

Gastvorlesung an der Johannes Gutenberg-Universität Mainz am 11. Mai 2010 zu Barrierefreiem Web.

Veröffentlicht in: Technologie, Design
1 Kommentar
6 Gefällt mir
Statistik
Notizen
Keine Downloads
Aufrufe
Aufrufe insgesamt
4.432
Auf SlideShare
0
Aus Einbettungen
0
Anzahl an Einbettungen
963
Aktionen
Geteilt
0
Downloads
54
Kommentare
1
Gefällt mir
6
Einbettungen 0
Keine Einbettungen

Keine Notizen für die Folie
  • Die Treppe in Odessa ist 147 Meter lang und erlangte Berühmtheit mit Sergei Eisenstein‘s Film „Panzerkreuzer Potemkin“ (1925), der die Ereignisse der Russischen Revolution 1905 beschreibt.
  • In eine Freitreppe integrierte Rollstuhlrampe in Chicago.
  • In eine Freitreppe integrierte Rollstuhlrampe in London.
  • In eine Freitreppe integrierte Rollstuhlrampe in Brüssel.
  • Braille-Beschriftung am Halteknopf in einem Berliner Bus.
  • Weinflasche mit Braille- und Schwarzschrift-Etikett.
  • Pepsi zeigte diesen Werbespot, der auf einem alten Witz innerhalb der Deaf Community beruht, in der Werbepause des Super-Bowl-Spiels 2008 und gewann damit den Dank und die Loyalität seiner Kunden mit Behinderungen.
  • Derzeit arbeitet eine Subgroup der HTML Accessibility Task Force an der Zugänglichkeit von HTML5 Video, insbesondere an Untertiteln. In diesem Beispiel der BBC wurden Untertitel per JavaScript hinzugefügt, wodurch auf der rechten Seite der Text nicht mehr lesbar ist. Wenn Browser das nativ beherrschen, sollte die Qualität besser sein. Darüberhinaus stellen Browser dann auch Kontrollelemente zur Verfügung, um etwa zwischen verschiedensprachigen Untertiteln zu wechseln.
  • Eine andere Subgroup arbeitet an einembarrierefreienFallback für Canvas. Anfangs dachte man nur, dass man damit Bilder auf einer Bitmap zeichnen würde, aber das Beispiel des Code-Editors „Bespin“ zeigte, dass damit auch viel komplexere Anwendungen und Spiele möglich werden. Die derzeit präferierte Lösung ist mit einer Imagemap als Fallback.
  • Von dem 2D-Kontext des Canvas-Elements zu 3D ist es nur ein kleiner Schritt. Wie können sich Menschen mit Behinderungen in interaktiven 3D-Welten orientieren und bewegen? Dieses Thema liegt derzeit noch brach; es hat sich noch keine Arbeitsgruppe des W3C damit befasst. Hingegen gibt es bereits Erfahrungen mit Second Life, die z.B. im Rahmen einer Abschlussarbeit in WebGL im Browser integriert werden könnte.
  • Aber es gibt auch neue Chancen, beispielsweise für neue Interaktionsformen jenseits der Maus oder Tastatur. Paul Rouget von Mozilla hat einen Driver für die Wiimote geschrieben.
  • Als Aprilscherz veröffentlichte Opera ein Video, das die neue „Face Gestures“ Steuerung demonstrierte. Tatsächlich ist es aber möglich, mit bestehenden Algorithmen Umrisse und Gesichter zu erkennen, und es befinden sich Webstandards in der Entwicklung, um auf Audio- oder Videoinput zugreifen zu können. Browser könnten diese fiktive Steuerung tatsächlich unterstützen!
  • Abgesenkte Bordsteine im Web. Warum von Barrierefreiheit Alle profitieren.

    1. 1. Abgesenkte Bordsteine im Web.Warum von Barrierefreiheit Alle profitieren.<br />Martin Kliehm. Senior Frontend Engineer.Namics.<br />11. Mai 2010. Johannes Gutenberg-Universität Mainz.<br />Foto: http://flic.kr/p/55Sh6D<br />
    2. 2. /me<br />11.05.2010<br />Barrierefreiheit. Universität Mainz. <br />2<br />Kompetenzen<br /><ul><li>Webstandards & Browser-Technologien
    3. 3. Barrierefreiheit, Usability, Geräteunabhängigkeit
    4. 4. Internationalisierung (i18n) &Lokalisierung (L10N)
    5. 5. Technische Konzeption und Beratung
    6. 6. Internationale Konferenzbeiträge</li></ul>Gremien<br /><ul><li>Invited Expert der W3C HTML Arbeitsgruppe
    7. 7. Invited Expert der W3C Accessibility Task Force
    8. 8. Stakeholder der authorisierten deutschen Übersetzung der W3C Richtlinien für barrierefreie Webinhalte (WCAG 2.0)
    9. 9. Mitglied in der International Liaison Group des Web Standards Projects
    10. 10. Mitglied bei den Webkrauts</li></ul>Martin Kliehm.Senior Frontend Engineer.Entwicklung, Barrierefreiheit,Mobile Endgeräte, i18n<br />Berufserfahrung<br />Seit 1996, Barrierefreiheit seit 1999, bei Namics seit 2008<br />Kontakt<br />http://namics.comhttp://klie.hm/profilehttp://twitter.com/kliehm<br />
    11. 11. Interdisziplinäre Teams.<br />Namics vorgestellt.<br />11.05.2010<br />Barrierefreiheit. Universität Mainz. <br />3<br />Projekt Management<br />Technologie<br />Consulting<br />Kreation<br />
    12. 12. Namics vorgestellt.<br />11.05.2010<br />Barrierefreiheit. Universität Mainz. <br />4<br />
    13. 13. Barrierefreiheit im Web<br /><ul><li>Begriff der Behinderung
    14. 14. Demographie: Barrierefreiheit als Wirtschaftsfaktor
    15. 15. Barrierefreiheit von Websites
    16. 16. Herausforderungen für die Zukunft</li></ul>11.05.2010<br />5<br />Barrierefreiheit. Universität Mainz. <br />
    17. 17. Barrierefreiheit<br />„Barrierefrei sind […] Systeme der Informationsverarbeitung […], wenn sie für behinderte Menschen in der allgemein üblichen Weise, ohne besondere Erschwernis und grundsätzlich ohne fremde Hilfe zugänglich und nutzbar sind.“<br />Behindertengleichstellungsgesetz<br />6<br />Barrierefreiheit. Universität Mainz.<br />21.05.2010<br />
    18. 18. Paradigmenwandel: Behinderung warursprünglich ein medizinisches Gebrechen.<br />11.05.2010<br />7<br />Barrierefreiheit. Universität Mainz.<br />http://flic.kr/p/2Vcqt5<br />
    19. 19. Behinderung alsindividuelles Problem<br />11.05.2010<br />8<br />Barrierefreiheit. Universität Mainz.<br />Menschenwürde?<br />http://flic.kr/p/ws4tD<br />
    20. 20. 11.05.2010<br />9<br />Barrierefreiheit. Universität Mainz.<br />Nicht der Rollstuhl ist die Barriere,die Architektur ist es …<br />oder die Gesellschaft.<br />“Disability results from an interaction betweena non-inclusive society and individuals.”<br />UN-Konventionüber die Rechtevon MenschenmitBehinderungen<br />http://failblog.org/2008/09/05/ramp-fail/<br />
    21. 21. 11.05.2010<br />10<br />Fokuswechsel: „Behinderte“ setzt die Behinderung in den Vordergrund.<br />„Menschen mit Behinderungen“setzt den Menschen in den Mittelpunkt.<br />http://flic.kr/p/6SEier<br />Barrierefreiheit. Universität Mainz. Namics.<br />
    22. 22. 11.05.2010<br />11<br />Fokuswechsel: „Behinderte“ setzt die Behinderung in den Vordergrund.<br />http://flic.kr/p/6SEier<br />Barrierefreiheit. Universität Mainz. Namics.<br />
    23. 23. 11.05.2010<br />12<br />„Menschen mit Behinderungen“setzt den Menschen in den Mittelpunkt.<br />http://flic.kr/p/6SEier<br />Barrierefreiheit. Universität Mainz. Namics.<br />
    24. 24. Paradigmenwandel:Barrierefreiheit alsnachträglicher Einfall,drangedübelt<br />11.05.2010<br />13<br />Barrierefreiheit. Universität Mainz.<br />http://flic.kr/p/8H1Q<br />
    25. 25. 11.05.2010<br />14<br />Barrierefreiheit. Universität Mainz.<br />Andreas Slominski:„Rollstuhl zum Queren derTreppe in Odessa“<br />Museum für Moderne Kunst, Frankfurt<br />http://flic.kr/p/rZh2F<br />
    26. 26. Potemkin-Treppe in Odessa<br />http://de.wikipedia.org/wiki/Potemkinsche_Treppe<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />15<br />
    27. 27. Barrierefreiheit als integrales Element<br />http://flic.kr/p/55Sh6D<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />16<br />
    28. 28. http://flic.kr/p/4dqGWd<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />17<br />
    29. 29. http://flic.kr/p/6VCacm<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />18<br />
    30. 30. http://flic.kr/p/5o8k42<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />19<br />
    31. 31. http://flic.kr/p/8W93u<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />20<br />
    32. 32. http://youtu.be/ffrq6cUoE5A<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />21<br />
    33. 33. 11.05.2010<br />22<br />Barrierefreiheit. Universität Mainz.<br />
    34. 34. 2. Demographie: Barrierefreiheit als Wirtschaftsfaktor<br />11.05.2010<br />23<br />http://flic.kr/p/8VHFb<br />Barrierefreiheit. Universität Mainz.<br />
    35. 35. 10-12%<br />http://flic.kr/p/dMFYb<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />24<br />
    36. 36. Menschen mit Behinderungen<br />MenschenmitBehinderungen in Deutschland:ca. 8-10 Mio. (10-12%)<br />MenschenmitBehinderungenweltweit:ca. 680-816 Mio.1<br />Schwerbehinderteimerwerbsfähigen Alter in Deutschland: 3 Mio. (3,6%)‏<br />Schwerbehinderteimerwerbsfähigen Alter in Europa: ca. 39 Mio.<br />1 Mont, D., Measuring Disability Prevalence, World Bank, March 2007<br />Demographie<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />25<br />
    37. 37. Familie, Freunde, Ärzte und Pflegepersonalfolgen:<br />“We could see how viral the community was. If you do something good, everyone knows about it.”<br />Barbara Kaplan, Verizon Wireless, National Marketing Operations Manager<br />“There’s a good deal of disposable income in the disability community. We’ve learned if you gain the community’s loyalty, they’re going to travel with you and recommend you to friends.”<br />Lisa Anderson, Southwest Airlines, Head of Customer Insight Group <br />MenschenmitBehinderungenalsMultiplikatoren.<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />26<br />
    38. 38. Die Herausforderungen.<br />$225Mrd.<br />http://flic.kr/p/4MqfGZ<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />27<br />
    39. 39. Wennnur 1% derBritenmitBehinderungeneineVersicherungspoliceüber £300 bestellt, verdientLegal & General £27 Mio. — die Umsatzsteigerungdurch die generellverbesserte Usability nichtmitgerechnet.<br />“The cost of making the site accessible pales into insignificance.”<br />David Wilton, Legal & General <br />Case Study: Legal & General.<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />28<br />
    40. 40. Nachhaltigen und langfristigenErfolgnurmitUnterstützung auf Vorstandsebene<br />Accessibility PolicyalsTeilderUnternehmenskultur<br />Barrierefreiheitvon Beginn an in einProjekteinbinden<br />Pragmatischsein: Klein anfangen.“Harvest the low hanging fruit.”<br />ErfolgreichmitBarrierefreiheit<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />29<br />
    41. 41. Kollateralnutzen. Barrierefreiheit für Alle.<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />30<br />
    42. 42. 41%<br />http://flic.kr/p/38rGwd<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />31<br />
    43. 43. http://destatis.de/bevoelkerungspyramide/<br />Die Herausforderungen.<br />11.05.2010<br />32<br />Barrierefreiheit. Universität Mainz. Namics.<br />
    44. 44. 50-65jährige: 17 Mio. (21%; 2010)1<br />50+: 33,2 Mio. (41%; 2010), Tendenz steigend,1davonim Internet: 14,9 Mio. (44,9%; 2009) 2<br />JährlicheZuwachsrateInternetnutzer 60-69 Jahre:6,9% (2009) 2<br /> 1StatistischesBundesamt, http://destatis.de/bevoelkerungspyramide/2 (N)Onliner Atlas 2009, http://initiatived21.de/category/nonliner-atlas<br />Designing for our future selves.<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />33<br />
    45. 45. Das RisikoeinerBehinderungsteigtim Alter‏<br />Wahrnehmung von Kontrasten, räumlicheWahrnehmung und Auge-Hand-Koordinationnehmenab<br />Owlsley, C.J., Sekuler, R. & Siemensne, D. (1983). Contrast sensitivity through adulthood. Vision Research 23, 689-699<br />Oft Anfänger, brauchenintuitive Nutzerführung<br />ÄltereMenschen.<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />34<br />
    46. 46. MenschenmitLernschwierigkeiten: 5-10%<br />EinwohnermitDeutsch alsFremdsprache: 5,7 Mio. (7%)‏<br />PISA 2003 untersteKompetenzstufeLesenoderdarunter: 22,3%<br />Schulabgänger 2005 ohnemittlereReife: 33%<br />KognitiveFähigkeiten. Lesekompetenz.<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />35<br />
    47. 47. 3. Barrierefreiheit von Websites<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />36<br />
    48. 48. mehr ...mehr ...mehr ...<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />37<br />
    49. 49. Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />38<br />
    50. 50. Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />39<br />
    51. 51. Wahrnehmbarkeit<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />40<br />
    52. 52. Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />41<br />
    53. 53. Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />42<br />
    54. 54. Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />43<br />
    55. 55. Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />44<br />
    56. 56. Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />45<br />
    57. 57. Schriftgröße im CSS: 11px = 68%<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />46<br />
    58. 58. Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />47<br />
    59. 59. Schriftgröße: 16px<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />48<br />
    60. 60. Inhalt.<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />49<br />
    61. 61. Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />50<br />
    62. 62. Die Herausforderungen.<br />1:20<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />51<br />
    63. 63. Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />52<br />
    64. 64. Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />53<br />
    65. 65. Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />54<br />
    66. 66. Captcha<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />55<br />
    67. 67. Zielgruppe: Alle. One Web for All.Niemanden ausgrenzen. Keine Diskriminierung.<br />http://flic.kr/p/5PYudB<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />56<br />
    68. 68. KleinerBildschirm<br />KeineMaus<br />KeinePopups<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />57<br />
    69. 69. Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />58<br />
    70. 70. Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />59<br />
    71. 71. Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />60<br />
    72. 72. Inhalte anreichern:Accessible Rich Internet Applications (ARIA)<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />61<br />
    73. 73. <input type="text"aria-required="true" /><br />11.05.2010<br />62<br />http://flic.kr/p/5EqqLe<br />Barrierefreiheit. Universität Mainz. Namics.<br />
    74. 74. <input type="text"aria-required="true"aria-invalid="true" /><br />11.05.2010<br />63<br />http://flic.kr/p/5EuQYq<br />Barrierefreiheit. Universität Mainz. Namics.<br />
    75. 75. http://flic.kr/p/48LXf9<br />
    76. 76. http://flic.kr/p/6F8N8Q<br />http://webaim.org/blog/spam_free_accessible_forms/<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />65<br />
    77. 77. http://flic.kr/p/6F8Phy<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />66<br />
    78. 78. <ulrole="menu navigation"><br /><li role="menuitem"><a href="…">Über Fraunhofer</a></li><br /></ul><br />11.05.2010<br />Barrierefreiheit. Universität Mainz. Namics.<br />67<br />
    79. 79. <arole="button" aria-controls="nav-direct-third"tabindex="0" title="Untermenü">Schnellzugriff</a><br /><ul id="nav-direct-third"role="menu navigation"aria-expanded="true"><br /><li role="menuitem"> <a href="…">Presse / Medien</a></li><br /></ul><br />11.05.2010<br />Barrierefreiheit. Universität Mainz. Namics.<br />68<br />
    80. 80. ARIA + JavaScript<br />11.05.2010<br />69<br />Barrierefreiheit. Universität Mainz. Namics.<br />
    81. 81. http://flic.kr/p/6F4FUk<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />70<br />
    82. 82. <ulrole="tablist"><br /> <lirole="tab">Bahn</li> <lirole="tab">Mietwagen</li> <lirole="tab">Hotel</li><br /> <lirole="tab">Mobilität</li><br /></ul><br /><!-- TabpanelBahn --><br /><div role="tabpanel"><br />…<br /></div><br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />71<br />
    83. 83. tabindex="0" setzen<br />Event capturing: click, focus, keydown,keypress<br />Tabpanel einblenden<br />Tastatursteuerung: Pfeiltasten, ctrl + tab,ctrl + shift + tab<br />Event-Bubbling stoppen<br /> ggf. Screenreader-Buffer aktualisieren<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />72<br />
    84. 84. <div aria-live="polite"aria-atomic="true"aria-relevant="additions text"><br />Die Seite wurde Ihrem Merkzettel hinzugefügt.<br /></div><br />http://flic.kr/p/6F4Gin<br />Barrierefreiheit. Universität Mainz. Namics.<br />11.05.2010<br />73<br />
    85. 85. 4. Herausforderungen für die Zukunft<br />21.05.2010<br />74<br />Barrierefreiheit. Universität Mainz.<br />
    86. 86. 11.05.2010<br />75<br />HTML5 <video><br />Barrierefreiheit. Universität Mainz. Namics.<br />
    87. 87. 11.05.2010<br />76<br />Barrierefreier Zugang zu Canvas 2D<br />Barrierefreiheit. Universität Mainz. Namics.<br />
    88. 88. 11.05.2010<br />77<br />Barrierefreie Interaktion in 3D-Welten<br />http://youtu.be/Ol3qQ4CEUTo<br />Barrierefreiheit. Universität Mainz. Namics.<br />
    89. 89. 11.05.2010<br />78<br />Neue Interaktionsformen<br />http://vimeo.com/10903243<br />Barrierefreiheit. Universität Mainz. Namics.<br />
    90. 90. 11.05.2010<br />79<br />Gesichtserkennung und Gestensteuerung<br />http://youtu.be/kkNxbyp6thM<br />Barrierefreiheit. Universität Mainz. Namics.<br />
    91. 91. Danke.<br />twitter: @kliehm<br />Folien: http://goo.gl/QdCg<br />Kontakt: http://klie.hm/profile<br />Barrierefreiheit. Universität Mainz.<br />21.05.2010<br />80<br />

    ×