Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Principles of accessible web desing (at #fronte...

Avatar for Eric Eggert Eric Eggert
September 27, 2011
Education
110
2

Principles of accessible web desing (at #fronteers10)

Avatar for Eric Eggert

Eric Eggert

September 27, 2011

More Decks by Eric Eggert

See All by Eric Eggert
What is EOWG?
Avatar for Eric Eggert yatil
0
120
Accessible Widgets Class 2/4
Avatar for Eric Eggert yatil
0
71
Accessible Widgets Class 4/4
Avatar for Eric Eggert yatil
0
94
Accessible Widgets Class 2/4
Avatar for Eric Eggert yatil
0
89
New Developments in Web Accessibility
Avatar for Eric Eggert yatil
0
1k
How I stopped worrying and learned to love defaults — with notes
Avatar for Eric Eggert yatil
0
460
How I stopped worrying and learned to love defaults
Avatar for Eric Eggert yatil
0
740
Fronteers11 Jam Session: a11y goes to 11
Avatar for Eric Eggert yatil
1
920
Accessibility 101 – Ignite Frankfurt
Avatar for Eric Eggert yatil
0
150

Other Decks in Education

See All in Education
遊ぶかね欲しさの犯行（ルビ：労働）です
Avatar for ShirayanagiRyuji shirayanagiryuji
0
240
The Strengthening Institutions Program
Avatar for Territorium territorium
PRO
0
160
AIってなぁに？
Avatar for 太田賢一 kenichiota0711
0
720
2026年度春学期　統計学　第9回　確からしさを記述する ー 確率 (2026. 5. 28)
Avatar for Akira Asano akiraasano
PRO
0
200
Visionary Initiative: Materials-Positive Society 「モノの進化をポジティブな社会の原動力に」｜Science Tokyo（東京科学大学）
Avatar for Science Tokyo （東京科学大学） / Science Tokyo (Institute of Science Tokyo) sciencetokyo
PRO
0
1.2k
Info Session MSc Computer Science & MSc Applied Informatics
Avatar for Beat Signer signer
PRO
0
310
Geografía y fútbol. Atlanta. la megalópolis del fútbol
Avatar for Juan Martín Martín juanmartin2026
1
12k
学生のうちに考えておきたい信頼の話
Avatar for suisan suisan
1
750
データマネジメント試験対策教材１〜データマネジメント基礎〜
Avatar for よしむら＠データマネジメント担当 yoshimura_datam
1
670
良書紹介08_ 頭のいい子がやっているすごいグラフの読み方
Avatar for ぶんちん bunnchinn3
0
150
悩め！！言ってみろ！！
Avatar for kazuki19992 kazuki19992
0
100
2026年度春学期　統計学　第14回　分布についての仮説を検証する ― 仮説検定（１） (2026. 7. 2)
Avatar for Akira Asano akiraasano
PRO
0
140

Featured

See All Featured
The Illustrated Guide to Node.js - THAT Conference 2024
Avatar for David Neal reverentgeek
1
460
jQuery: Nuts, Bolts and Bling
Avatar for Doug Neiner dougneiner
66
8.6k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
Avatar for Eileen M. Uchitelle eileencodes
141
35k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
Avatar for Stéphanie Walter stephaniewalter
287
14k
How to Build an AI Search Optimization Roadmap - Criteria and Steps to Take #SEOIRL
Avatar for Aleyda Solis aleyda
1
2.2k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
46
8.3k
A brief & incomplete history of 
UX Design for the World Wide Web: 1989–2019
Avatar for Jason CranfordTeague jct
2
490
AI: The stuff that nobody shows you
Avatar for John Nunemaker jnunemaker
PRO
9
960
エンジニアに許された特別な時間の終わり
Avatar for watany watany
108
250k
Discover your Explorer Soul
Avatar for Emna emna__ayadi
2
1.3k
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
Avatar for Mfonobong Umondia mfonobong
2
510
AI Search: Implications for SEO and How to Move Forward - #ShenzhenSEOConference
Avatar for Aleyda Solis aleyda
1
1.4k

Transcript

  1. Principles of Accessible Web Design Eric Eggert aka. @yatil —

    Fronteers Jam Session — Amsterdam

  2. (Almost.) Everyone here is disabled. (Or will be at some

    time.)
  3. None

  4. “People need not be limited by physical handicaps as long

    as they are not disabled in spirit.”

  5. Different input mechanisms

  6. Different input mechanisms

  7. Different input mechanisms

  8. Different input mechanisms

  9. Different input mechanisms

  10. Different input mechanisms

  11. Different input mechanisms

  12. Different output mechanisms

  13. Different output mechanisms

  14. Different output mechanisms

  15. Different output mechanisms

  16. Different output mechanisms

  17. Different output mechanisms

  18. None

  19. We don’t need special websites for people with special requirements.

  20. Have you ever forgotten to buy new batteries for your

    mouse?
  21. None
  22. None
  23. None
  24. None

  25. Accessible websites help everyone.

  26. None

  27. We are designing the web for our future selves.

  28. 0 25 50 75 100 14-19 20-29 30-39 40-49 50-59

    60+ 1998 2008

  29. 0 25 50 75 100 14-19 20-29 30-39 40-49 50-59

    60+ 1998 2008

  30. 0 25 50 75 100 14-19 20-29 30-39 40-49 50-59

    60+ 1998 2008

  31. 0 25 50 75 100 14-19 20-29 30-39 40-49 50-59

    60+ 1998 2008

  32. 0 25 50 75 100 14-19 20-29 30-39 40-49 50-59

    60+ 1998 2008

  33. 0 25 50 75 100 14-19 20-29 30-39 40-49 50-59

    60+ 1998 2008

  34. 0 25 50 75 100 14-19 20-29 30-39 40-49 50-59

    60+ 1998 2008

  35. What can we do?

  36. Don’t use Flash. It isn’t working on most mobiles. It

    isn’t „working“ on most PCs either. It can be made accessible on Windows and IE only.

  37. POSH5 & POUR

  38. POSH5 & POUR Plain Old Simple HTML5

  39. POSH5 & POUR Plain Old Simple HTML5 Perceivable, Operable, Understandable,

    Robust

  40. POSH5 Use the best HTML5 Element available for the task

    at hand.

  41. HTML5 Includes many accessibility features (although others claim otherwise). It

    is not the spec to look to when searching for web accessibility techniques.

  42. WCAG2 Is the spec for accessible web content. Provides an

    exhaustive list of techniques to make web content accessible.

  43. http://www.w3.org/WAI/WCAG20/quickref/ Perceivable Operable Understandable Robust

  44. And now: Sharky mail: [email protected] twitter: @yatil

  45. And now: Sharky mail: [email protected] twitter: @yatil