Opera Accessibility SXSW 09

2,026 views

Published on

A quick trip through accessibility, WAI-ARIA and where it is going. This was a 10 minute lightning talk for SXSW 09 by Henny Swan, Web Evangelist for Opera Software.

Published in: Technology, Design
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,026
On SlideShare
0
From Embeds
0
Number of Embeds
115
Actions
Shares
0
Downloads
24
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • One line text slide
  • Opera Accessibility SXSW 09

    1. 1. Opera accessibility Henny Swan [email_address] Twitter: @iheni
    2. 3. Why bother? It costs money... It only serves a small market... Blind people don’t browse car websites... It makes developers go insane...
    3. 4. Screen readers are the poster child of accessibility But that’s not even half the story
    4. 5. Vision, cognition, mobility and hearing Temporary disabilities (RSI, broken wrist...even hangovers) and you... Mobile users Children
    5. 6. No one plans on dying young right? The aging market is only going to get bigger You are that market
    6. 7. Shopping, banking, e-gov, TV Blogs, Twitter, photo sharing, IM via desktop, mobile, devices
    7. 9. So how do we make accessible sites? HTML: text alternatives and semantic mark up CSS: separation of content and presentation JavaScript: progressive enhancement, accessible Rich Internet Applications
    8. 10. WCAG 2.0: technology agnostic test criteria Combine with user testing Validate Section 508 (US), UK Government Guidlines, EU directives and more
    9. 11. Text JavaScript is the work of the devil right? Not so...
    10. 12. WAI-ARIA to the rescue! Web Accessibility Initiative Accessible Rich Internet Applications
    11. 13. Sexy keyboard and screen reader accessible widgets Makes HTML dynamic Supported by Opera 9.5+, FF 1.5+, IE8 and Safari 4 Jaws 7.1+, WindowEyes 5.5+, NVDA, and Firevox
    12. 14. WAI-ARIA: Role and state Role : I am a slider , therefore I slide State : Feeling pretty good actually <input type=&quot;image&quot; src=&quot;thumb.gif&quot; alt=&quot;How are you doing?&quot; role =&quot;slider&quot; aria-valuemin=&quot;terrible&quot; aria-valuemax=&quot;excellent&quot; aria-valuenow=&quot; good &quot; ...aria-labelledby=&quot;leffective&quot;>
    13. 15. WAI-ARIA: Landmark roles Define areas of a web page <div role=&quot; banner &quot;> ... </div><div role=&quot; navigation &quot;> ...</div> <div role=&quot; main &quot;>... </div> </div>
    14. 16. WAI-ARIA: Live regions Notifies users of page updates polite assertive RUDE
    15. 17. Opera Tools
    16. 18. Opera Debug menu Enable and disable CSS, JavaScript, images, multimedia Check headings, lists data tables and semantic markup Mobile view Mobile view
    17. 19. Opera Dragonfly JavaScript debugger DOM / CSS inspection Error console Remote debugging
    18. 20. Opera Dragonfly
    19. 21. Web Standards Curriculum www.opera.com/wsc Opera Developer Network www.opera.com/developer
    20. 22. Thank you and questions [email_address] www.iheni.com @iheni

    ×