webinsight: making web images accessible jeff bigham richard ladner ryan kaminsky gordon hempton...

WebInSight:Making Web Images Accessible

Jeff Bigham

Richard LadnerRyan KaminskyGordon HemptonOscar Danielsson

Some statistics

10 million blind people in the U.S. 55,000 blind children 5 million blind people over 65

Computer and Internet Use 1 million use computers < 200,000 have access to the Internet < 100,000 use a computer regularly 32% of legally blind adults employed

Source: American Foundation for the Blind Blindness Statistics http://www.afb.org/Section.asp?SectionID=15

Browsing the web while blind

Blind users use screen readers Alternative text is substituted for images When no alternative text provided

nothing filename (060315_banner_253x100.gif) link address

W3C accessibility standards “Provide a text equivalent for every non-text element” For images with purely visual purpose, a text equivalent is

an empty string

Outline

Web Studies

WebInSight System

Where Labels Come From

Evaluation

Future Work

Web Studies Images can be significant or insignificant Significant images need alternative text

alt, title, and longdesc HTML attributes Insignificant images need empty

alternative text(spacers, lines, wacky backgrounds, etc.)

Significance from size, color and function

Web Studies: Groups

CSE Traffic 1 week. 11,989,898 images. 40.8% significant

63.2% assigned alternative text

Popular/Important Websites 500 High-Traffic International Sites 100 Top International Universities 158 Computer Science Departments 137 Federal Agencies 50 States plus District of Columbia

Study Results

Group Significant Insignificant > 90% Number

High-traffic 39.6 27.4 21.8 32913

Computer Science

52.5 41.6 27.0 4233

Universities 61.5 70.2 51.5 3910

U.S. Federal Agencies

74.8 66.6 55.9 5902

U.S. States 82.5 77.1 52.9 2707

Result Graphs

U.S. Federal Agencies

0

20

40

60

80

100

0 20 40 60 80 100 120 140

High-Traffic Websites

0

20

40

60

80

100

0 50 100 150 200 250 300 350 400 450 500

Universities

0

20

40

60

80

100

0 20 40 60 80 100

Comp. Science Departments

0

20

40

60

80

100

0 20 40 60 80 100 120 140 160

Outline

Web Studies

WebInSight System

Where Labels Come From

Evaluation

Future Work

WebInSight

Add alternative text as a user browses

Coordinate multiple labeling sources

Avoid harming the user experience

Maintain security and privacy

Database

WebInSight Architecture

The InternetThe Internet

Context Labeling

OCR Labeling

Human Labeling

TransformationProxy

GET http://www.cs.washington.eduGET http://www.cs.washington.edu/

GET http://www.cs.washington.edu

Login: _______

Pass: _______

Login: _login___

Pass: _pass___

WebInSight as a Proxy

Transformation proxy Inserts alternative text into webpages Inserts AJAX hooks to allow later changes

Advantages Centralized control Simple setup and administration

Disadvantages Potentially a bottleneck Less control over user interface Secure connections don’t benefit or are less secure

Outline

Web Studies

WebInSight System

Where Labels Come From

Evaluation

Future Work

Providing Labels: Context Labeling Many important images are links

Linked page often describes imageFunction much better than nothing

Providing Labels: OCR Labeling

Original image not recognized(No Text)

Find major colors

Highlight major colors & try again

Providing Labels: OCR Labeling 2

Color Image OCR Text(No Text)

(No Text)

(PIC)t

(No Text)

,, ., ,, ,. ,., , ,,, .,,,n(PIC)(PIC)

Register now!

Providing Labels: OCR Evaluation

Tested 100 images containing text The OCR correctly labeled 52 Our processing correctly labeled 65

Providing Labels: Human Labeling

Humans are best labelers

Luis von Ahn’s games get people to do it

WebInSight sends images to such services

Outline

Web Studies

WebInSight System

Where Labels Come From

Evaluation

Future Work

Evaluation

Experiment Run WebInSight on pages from Web Studies 43.2% of unlabelled sig. images labelled Of these, 94.1% were correct

Evaluation:UCLA

Future Work

User Studies Does it help? What do user’s want out of alt text? When should WebInSight provide it?

Refactoring alt text Present alt text in the best way possible for users

Tool for Webmasters People will always be better but they need help

Demo