1. The Paciello Group Making Twitter Tweet Steve Faulkner The Paciello Group

2. UP FRONT Accessibility is not just about blind people This is not an exercise in Twitter Bashing

3. The Paciello Group

4. Twitter – 1.0 issues alt=“Icon_star_empty” alt=“Icon_star_full” No alt attribute

5. The Paciello Group Twitter – 1.0 issues not associated with anything Use of – unnecessary and useless Unnecessary duplication of links

6. The Paciello Group Twitter – 1.0 issues Unnecessary duplication of links (175 on page) – 25 duplicates

7. The Paciello Group Twitter – 2.0 Issues & Solutions – Ensuring that JavaScript based functionality is usable by people with disabilities Understanding AJAX issues Providing Name, Role and State Information Keyboard Accessibility – Use of in microformats

8. The Paciello Group Twitter – microformats – Microformats use of, why is it an issue? – the title attribute is there to provide human readable information not machine readable data.

9. The Paciello Group Twitter – Name, role and state – Wherever possible use elements that provide the correct information – incorrect role: link – Incorrect: name/state “ Icon_star_empty”

10. The Paciello Group Twitter – Name, role and state – For a button use a button and provide name/state info in alt

11. The Paciello Group Twitter – microformats Users of Assistive Technology will hear this stuff

12. The Paciello Group Twitter – microformats March 12, 2007 at 5 PM, Central Standard Time March 12, 2007 at 5 PM WASP (webstandards.org) recommends: March 12, 2007 at 5 PM, Central Standard Time Instead of: or

13. The Paciello Group Twitter – AJAX Two main issues: Users not having access to content changes. Users not being aware of the changed content if they can access it.

14. The Paciello Group Twitter – AJAX Users not having access to content changes. 2 major screen readers JAWS <7.1 & Window Eyes use a ‘virtual buffer’ to store a copy of the DOM, this is what a user ‘views’ when browsing. When a user presses a control or link their view (copy) gets updated to reflect the current browser view. The update occurs after approximately 600 milliseconds a control is pressed.

15. The time between pushing the button and the content change is the issue. The Paciello Group Twitter – AJAX Users not having access to content changes.

16. The Paciello Group 1. Favourites (pseudo) button not selected: Browser and screen reader view synchronized: 2. User presses button – button changes state, in browser view, to selected, this twitter is added to users favourites: 3. In screen reader view button remains unselected and twitter is not added to favourites: Twitter – AJAX Users not having access to content changes.

17. User key press: Update initiated Content change occurs before update finished Content change occurs after update finished 600 milliseconds 300 milliseconds 1000 milliseconds Content update available The Paciello Group

18. Twitter – AJAX Users not having access to content changes. Good News – JAWS 7.1+ has effectively solved this issue. Bad News – Window Eyes has not. What can be done?: not much except to inform user that page content updates and they may need to update their view.

19. The Paciello Group Twitter – AJAX Users not having access to content changes. CSS: p.update { position: absolute; left: -999em; width: 0.1em; overflow: hidden; } HTML: Content updates occur frequently. If things aren’t working as you would expect, try refreshing the page.

20. The Paciello Group Twitter – AJAX Users not being aware of the changed content if they can access it.

21. In this situation sighted users can glance at the number to see how much more they can write, but vision impaired users cannot practically benefit from this information. 3 possible solutions: (show demo) 1.Use alert boxes 2.Provide sound cues 3.Use WAI -ARIA live regions The Paciello Group Twitter – AJAX Users not being aware of the changed content if they can access it.

22. The Paciello Group Beyond Twitter - WAI-ARIA WAI ARIA – web accessibility initiative - accessible rich internet applications A W3C specification (in development) “Provides a way to add Name, Role and State information to custom controls (widgets) built using current HTML elements, so that Assistive Technology can reliably convey this information to the user.”

23. The Paciello Group WAI-ARIA web accessibility - initiative accessible rich internet applications Info about who supports etc to be inserted.

24. The Paciello Group WAI-ARIA web accessibility - initiative accessible rich internet applications More info about wai aria

25. The Paciello Group Making Twitter Tweet Thanks! Steve Faulkner The Paciello Group