Richard E. Ladner and Jeffrey P. Bigham Work with Ryan Kaminsky, Gordon Hempton, Oscar Danielsson University of Washington Computer Science & Engineering and everything else?

2 Accessibility Affects People who are blind People with visual impairments People who are Deaf or hard of hearing People with learning disabilities People who are physically impaired Web Accessibility Overview

3 Accessibility Affects (cont.) People who use cell phones People who use text browsers Information extraction Web Accessibility Overview

4 Standards for Developers W3C Web Content Accessibility Guidelines Section 508 of the U.S. Rehabilitation Act Americans with Diabilities Act (ADA) Web Accessibility Overview

5 Accessible Browsing Screen readers, refreshable Braille displays Consider Linear Display Separate presentation from meaning No vision or mouse required Visual content requires an alternative Web Accessibility Overview

6 Images Images cannot be read directly W3C accessibility standard  “Provide a text equivalent for every non-text element” What if no alternative text?  Nothing  Filename (060315_banner_253x100.gif)  Link address ( or /subdir/) Web Accessibility Overview

7

8 /olc/pub/YALE/oldintro/oldintro.cgi Update Address

9 Cornell CS Webpage

10 Part II: Accessible Images Web Studies Providing Labels WebInSight System Evaluation Developers Making Images Accessible

11 Web Studies: All Images != Significant images need alternative text  alt, title, and longdesc HTML attributes Insignificant images need empty alt text  Decorative or structural <img src=“graph.gif” alt=“annual growth: 1982 to 2004” title=“Annual Growth” longdesc=“growth_descrip.txt”> Making Images Accessible

12 Image Significance More than one color and both dimensions > 10 pixels An associated action (clickable, etc.) Making Images Accessible

13 Web Studies Previous studies  All images: 27.9% [1], 47.7% [2], and 49.4% [2]  Significant images: 76.9% [3] Concerns  Variation  Consideration of Image Significance and Popularity [1] T. C. Craven. “Some features of alt text associated with images in web pages.” (Information Research, Volume 11, 2006). [2] Luis von Ahn et al. “Improving accessibility of the web with a computer game.” (CHI 2006) [3] Helen Petrie et al. “Describing images on the web: a survey of current practice and prospects for the future.” (HCII 2005) Making Images Accessible

14 Web Site Study GroupSignificantPages > 90%PagesImages High-traffic39.6%21.8% Computer Science 52.5%27.0% Universities61.5%51.5% U.S. Federal Agencies 74.8%55.9% U.S. States82.5%52.9% Percentage of significant images provided alternative text, pages with over 90% of significant images provided alternative text, number of web sites in group, and number of images examined. Making Images Accessible

15 University of Washington CSE Department Traffic Web Traffic Study Significant images without alternative text. Significant images with alternative text.  ~1 week  11,989,898 images including duplicates  40.8% significant  63.2% alt text Making Images Accessible

16 Part II: Accessible Images Web Studies Providing Labels WebInSight System Evaluation Developers

17 Providing Labels: Context Labeling Many important images are links  Linked page often describes image  What happens if you click People of UW People … Making Images Accessible

18 [4] Jain et al. “Automatic text location in images and video frames.” (ICPR 1998) Providing Labels: OCR Labeling Improvement through Color Clustering [4] ColorNew ImageText Produced,,.,,,,n Register now! (Optical Character Recognition) Improves recognition 25% relative to base OCR! Making Images Accessible

19 Providing Labels: Human Labeling Humans are best Recent games compel accurate labeling WebInSight database has only 10,000 images Could do this on demand [5] Ahn et al. “Labeling images with a computer game.” (CHI 2004) [6] Ahn et al. “Improving the accessibility of the web with a computer game.” (CHI 2006) [5] [6] Making Images Accessible

20

21 Part II: Accessible Images Web Studies Providing Labels WebInSight System Evaluation Developers Making Images Accessible

22 WebInSight System Tasks  Coordinate multiple labeling sources  Insert alternative text into web pages  Add code to insert alternative text later Features  Browsing speed preserved  Alternative text available when formulated  Immediate availability next time Making Images Accessible

23 The Interne t Proxy Context Labeling OCR Labeling Human Labeling Database Blind User Making Images Accessible

24 The Interne t Extension Context Labeling OCR Labeling Human Labeling Database Blind User Labeling Service Making Images Accessible

25 Concerns Accuracy Distribution of Tasks – who does what? Authorization – who can use the system? Privacy Copyright Making Images Accessible

26 Part II: Accessible Images Web Studies Providing Labels WebInSight System Evaluation Developers

27 Evaluation Measuring System Performance  WebInSight tested on web pages from web site study  Used Context and OCR Labelers  Labeled 43.2% of unlabeled, significant images  Sampled 2500 for manual evaluation  94.1% were correct Proper Precision/Recall Trade-off Making Images Accessible

28 Making Images Accessible

29 Part II: Accessible Images Web Studies Providing Labels WebInSight System Evaluation Developers

30 Developers: Prior Work A-Prompt  U of Toronto as part of W3C initiative, 1999  Registry for alternative text  Provides suggestions using heuristics on filenames ALTifier  Proxy-based system  Used filename/URL as alt text Making Images Accessible

31 WebInSight Developer Video

32 Conclusion Lack of alternative text is pervasive WebInSight formulates & inserts alt. text Appropriate precision/recall tradeoff Users and developers can use same technology Making Images Accessible

33 Part III: Future Research Support Web Users and Developers Automation and Suggestions Independence Sharing and Collaboration Future Research

34 Understanding our users Blind web users  Remote observation with proxy server  User diaries Web developers  Focus groups  Surveys Future Research

35 Technical Challenges Relaying Content Structure  tables, div, columns Dynamic Content  DHTML, mouse overs Rich Internet Applications/Web Applications  , word processing, spreadsheets Requires new ways of reading the web Future Research

36

37 Scripting Accessibility Greasemonkey reshapes the web Accessmonkey facilitates accessibility  Getting technology to people  Multiple platforms and implementations  A conduit for collaboration  Web users and developers share technology Future Research

38 Independence Automation means independence Helping users create scripts Helping users share scripts Future Research

39 Part IV: Related Projects Related Projects

40 Graphic Translation preprocess text extract clean image original scanned image pure graphic text image location file Tactile Graphics

41 Graphic Translation pure graphic text image location file y (0,20) x= O x x+y=20 (15,0) (15,5) y (#0,#20) x.k#15 #15 #10 #5 O x #5 #10 #15 #20 x+y.k#20 (#15,#0) (#15,#5) text Braille Tactile Graphics

42 Challenges: Limited network bandwidth Limited processing power on cell phones MobileASL Project ASL communication using video cell phones over current U.S. cell phone network

43 WebInSight Thanks to: Luis von Ahn, Scott Rose, Steve Gribble and NSF.