Saturday, May 14, 2011
Accessibility is...                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com...
Saturday, May 14, 2011Aaron "Wheelz" Fotheringham landed the worlds first double backflip on a wheelchair onAugust 26, 201...
Leveling the playing                                    field                         Yahoo! Accessibility Lab Accessibilit...
Removing Barriers                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/Y...
Universal Design                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/Ya...
Who makes it                                        accessible?                         Yahoo! Accessibility Lab Accessibi...
Advocates Refuse Barriers                         Creative Commons: image by tigoe on FlickrSaturday, May 14, 2011Advocate...
Champions make it happen                         Some rights reserved by woodleywonderworks on FlickrSaturday, May 14, 201...
Some rights reserved by ocad123 on FlickrSaturday, May 14, 2011It’s our job to avoid upsetting advocates in the first place...
Make it Accessible                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/...
Lady Gaga stuns the GrammysSaturday, May 14, 2011Image from Getty Images
Lady Gaga stuns the                             Lady Gaga performs “Born                              Grammys             ...
Saturday, May 14, 2011This video shows what it sounds like when the alt attribute is missing.This bug has been fixed.
<bu$on>Sign	  In</bu$on>	                  <a>Cancel</a>	                           Yahoo! Accessibility Lab Accessibility...
<th scope=”col”>                          Name                                  Type                                Taste ...
Label Your Input                <label for=”fname”>First Name</label>                <input id=”fname” name=”fname” type=”...
ARIA                         Accessible Rich Internet Applications                         Some rights reserved by paul go...
Use ARIA Today                    • Landmarks: role=”search”, role=”main”                    • Function: role=”button”    ...
Search with ARIASaturday, May 14, 2011
Mobile                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessi...
Innovative Solutions                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.co...
Traumatic Brain Injury                    • Soldiers                    • Sports Injuries                    • Crashes    ...
Short Term Memory                              Loss Hacks                    • Re-Education                    • Workforce...
Readability.com                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/Yah...
Readability.com                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/Yah...
Readability.com                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/Yah...
Photo Dialer                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooA...
Memory Loss                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAc...
Non-Visual Innovations                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook....
In Plain Text?                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/Yaho...
Audio Description ToolSaturday, May 14, 2011
Text to Speech +                            FlipboardSaturday, May 14, 2011build an app that expands the links from your f...
Directions                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAcc...
Deaf                                                        Hacks                         Some rights reserved by izahorsk...
Sound Detector                         Some rights reserved by Thomas Hawk on FlickrSaturday, May 14, 2011detect sirens, a...
Twitter                 Deaf Twitter                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooacce...
Physical Challenges                         Some rights reserved by Christiana Care on FlickrSaturday, May 14, 2011paralys...
Site Scanner                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooA...
Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011
Communication                                               Communication Tools                         Yahoo! Accessibili...
Support Social Network                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook....
If it ain’t broke...                                                        Fix it anyway!                         Yahoo! ...
Some rights reserved by Oha-Lau 2 on FlickrSaturday, May 14, 2011Ask yourself what if:you couldn’t see the difference betw...
You are the Champion!                         Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.c...
Visit the Yahoo                    Accessibility Lab’s Blog                                               Accessibility.Ya...
Accessibility Innovations                             and Challenges                                    Ted Drake         ...
Upcoming SlideShare
Loading in...5
×

Accessibillity Challenges and Innovations for Open Hack EU 2011

2,132

Published on

This presentation introduces accessibility and gives challenges for the hackers at Yahoo! Open Hack EU 2011

Embedded videos:
http://youtu.be/Vd_W_8tIDNA

http://www.youtube.com/watch?v=iI_N5T3pmxQ

http://www.youtube.com/watch?v=StI0iIufJzk

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

No Downloads
Views
Total Views
2,132
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
12
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Accessibillity Challenges and Innovations for Open Hack EU 2011

  1. 1. Saturday, May 14, 2011
  2. 2. Accessibility is... Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011
  3. 3. Saturday, May 14, 2011Aaron "Wheelz" Fotheringham landed the worlds first double backflip on a wheelchair onAugust 26, 2010.Filmed: Dave Metty Brandon Schmidt, Edited: Joshua Zuckerhttp://aaronfotheringham.com http://campwoodward.com
  4. 4. Leveling the playing field Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011Our goal is to give everyone equal access to information, tools, jobs, and activities.We acknowledge there may be different methods to achieve tasks, but they are possible.
  5. 5. Removing Barriers Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011Don’t break the web by creating an application that is not accessible.Avoid “shortcuts” that assume the user can see, hear, and/or has full mobility.
  6. 6. Universal Design Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011produce buildings, products and environments that are inherently accessible to both the able-bodied and the physically disabled.Apple products do a great job at this.don’t think a,b,c, i.e. high contrast or low contrast.Think about how you can provide a range of contrast.Provide functionality for hover, active, focus.
  7. 7. Who makes it accessible? Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011Lainey Feingold is an attorney that works with companies to improve their products accessibility.for instance, braille credit card machines at Target and other stores.She says advocates and champions are needed for accessibility changes
  8. 8. Advocates Refuse Barriers Creative Commons: image by tigoe on FlickrSaturday, May 14, 2011Advocates, she explained, are people with disabilities that are not satisfied with having to work around barriers to entry.They demand equal access, whether that is an accessible web form, ATMs with audio feedback, or tactile point of sale devicesthat allow a visually impaired shopper to use a credit card at a store’s cash register.
  9. 9. Champions make it happen Some rights reserved by woodleywonderworks on FlickrSaturday, May 14, 2011Champions are people within organizations that understand the problems and are devoted to implementing the changes.Some people are both advocates and champions.
  10. 10. Some rights reserved by ocad123 on FlickrSaturday, May 14, 2011It’s our job to avoid upsetting advocates in the first place.We are also the champions that listen to the advocates and fix the problems.
  11. 11. Make it Accessible Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011The following slides discuss basic accessible web development concepts.
  12. 12. Lady Gaga stuns the GrammysSaturday, May 14, 2011Image from Getty Images
  13. 13. Lady Gaga stuns the Lady Gaga performs “Born Grammys This Way” while emerging from a large egg-shaped pod Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011This is appropriate alt text
  14. 14. Saturday, May 14, 2011This video shows what it sounds like when the alt attribute is missing.This bug has been fixed.
  15. 15. <bu$on>Sign  In</bu$on>   <a>Cancel</a>   Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011Don’t use a link for a button.at least add role=”button”you can style a button to look like a link for UED
  16. 16. <th scope=”col”> Name Type Taste </th> Vişinată Liqueur Sour Cherry Turtă dulce Dessert Ginger Bread <th scope=”row”> mămăligă Vegetable Corn </th> tobă Meat Pork Sausage Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011add scope=”row | col” to your th cellsscreen readers will announce the header before the appropriate cell.th[scope=”row”] {color:pink} allows you to style row headers
  17. 17. Label Your Input <label for=”fname”>First Name</label> <input id=”fname” name=”fname” type=”text”> Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011Use a label for each form input.Explicit binding via for+id will work in all browsers.Hidden label with aria-label=””, aria-labelledby=””, or possibly alt=”” on input.
  18. 18. ARIA Accessible Rich Internet Applications Some rights reserved by paul goyette on FlickrSaturday, May 14, 2011ARIA allows us to define the application like interactions for web pages.
  19. 19. Use ARIA Today • Landmarks: role=”search”, role=”main” • Function: role=”button” • Labels: aria-label=”Search Term” • State: aria-invalid=”true” Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011Visit the accessibility lab’s aria library for more information: http://yaccessibilityblog.com/library/tag/aria
  20. 20. Search with ARIASaturday, May 14, 2011
  21. 21. Mobile Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011iphones and ipads have great accessibility features.They are rapidly becoming the preferred technology for many disabilities, i.e. blind, autism,cerebral palsy...http://www.youtube.com/watch?v=StI0iIufJzkThis video shows how the Southwest Airlines app sounds. They use custom buttons withoutlabels.
  22. 22. Innovative Solutions Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011
  23. 23. Traumatic Brain Injury • Soldiers • Sports Injuries • Crashes Some rights reserved by CorCor Beware on FlickrSaturday, May 14, 2011short term memory lossrequire repetitive instructionsavoid confusion
  24. 24. Short Term Memory Loss Hacks • Re-Education • Workforce transition • Resources aggregator Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011application that restores basic personal knowledgeapplications that storyboard workspace tasks, such as replacing toner, creating spreadsheets
  25. 25. Readability.com Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011Readability is a browser plugin that simplifies a pageit removes images, navigation, etcuser can personalize font size, background color, and optional resource link list
  26. 26. Readability.com Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011Readability is a browser plugin that simplifies a pageit removes images, navigation, etcuser can personalize font size, background color, and optional resource link list
  27. 27. Readability.com Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011Readability is a browser plugin that simplifies a pageit removes images, navigation, etcuser can personalize font size, background color, and optional resource link list
  28. 28. Photo Dialer Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011this is a fairly easy application that lets user make phone calls via the images in their contactsrather than names and phone numbersThis can integrate with phone’s contact list for very easy dialing.
  29. 29. Memory Loss Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011slide shows to feature family and friends with namesmental games, Daily event journalsGrowing population with dementia and Alzheimers
  30. 30. Non-Visual Innovations Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011
  31. 31. In Plain Text? Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011translate significant value changes into a sentence. what did it start/end at?Charts give instant recognition of history, how can this be in text?Finance, science, math, politics, and any other data source
  32. 32. Audio Description ToolSaturday, May 14, 2011
  33. 33. Text to Speech + FlipboardSaturday, May 14, 2011build an app that expands the links from your friends twitter, facebook feeds, as well as yourfavorite rss feed and then uses built in text to speech engines to provide audio for your car.
  34. 34. Directions Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011How can a blind user navigate the city when they cannot see the map/street namesLocation saver - find way back to parking/bus spot
  35. 35. Deaf Hacks Some rights reserved by izahorsky on FlickrSaturday, May 14, 2011
  36. 36. Sound Detector Some rights reserved by Thomas Hawk on FlickrSaturday, May 14, 2011detect sirens, alarms, and other audio signalsclosed captioningsign language interpreting and video repository/translations
  37. 37. Twitter Deaf Twitter Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011user creates short video, uploads to flickr/post to twitter. Interface also tracks replies,retweets, etc.plays video inline on phone/computerthis could also work for blind users: audio instead of video
  38. 38. Physical Challenges Some rights reserved by Christiana Care on FlickrSaturday, May 14, 2011paralysis, cerebral palsy, muscular dystrophy, stroke, age related, Parkinsons
  39. 39. Site Scanner Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011Site scanner by the Yahoo! prototype team: fix the difficulties of using a scanning keyboard tonavigate a web page.allows navigation with a single button pressuse space bar to start and navigate a page. demo with: http://nexpace.com/sandbox/scanner/bookmarklet/
  40. 40. Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011
  41. 41. Communication Communication Tools Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011Pic to Speech is an assisted communication device for the android. It allows customization ofthe icons and translations.DDweb provides an online environment http://ddweb.developingmindssoftware.com/site/Prologue2go is a popular ipad app
  42. 42. Support Social Network Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011social networks for the individuals and their support network.journal for daily activities, moods, healthcommunications amongst teachers, parents, doctors, etc
  43. 43. If it ain’t broke... Fix it anyway! Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011Not all accessibility applications were built to solve an accessibility problemcolor detector used by blind for imagining colors of environmentreal time video chat used for sign language chat roomsgoogle goggles for determining money values
  44. 44. Some rights reserved by Oha-Lau 2 on FlickrSaturday, May 14, 2011Ask yourself what if:you couldn’t see the difference between red, green, yellowthere was no hoveryou can’t remember the beginning of an articleyou know what to say but can’t speak
  45. 45. You are the Champion! Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011
  46. 46. Visit the Yahoo Accessibility Lab’s Blog Accessibility.Yahoo.Com Yahoo! Accessibility Lab Accessibility.Yahoo.Com | @yahooaccess | Facebook.com/YahooAccessibilitySaturday, May 14, 2011
  47. 47. Accessibility Innovations and Challenges Ted Drake Bucharest, May 2011Saturday, May 14, 2011this presentation was created for the Yahoo! Open Hack EU
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×