Opera accessibility

Henny Swanhennys@opera.com

Twitter: @iheni

Why bother?

It costs money...

It only serves a small market...

Blind people don’t browse car websites...

It makes developers go insane...

Screen readers are the poster child of accessibility

But that’s not even half the story

Vision, cognition, mobility and hearing

Temporary disabilities (RSI, broken wrist...even hangovers)

and you...

Mobile users

Children

No one plans on dying young right?

The aging market is only going to get bigger

You are that market

Shopping, banking, e-gov, TV

Blogs, Twitter, photo sharing, IM

via desktop, mobile, devices

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

WCAG 2.0: technology agnostic test criteria

Combine with user testing

Validate

Section 508 (US), UK Government Guidlines, EU directives and more

Text

JavaScript is the work of the

devil right?

Not so...

WAI-ARIA to the rescue!

Web Accessibility Initiative Accessible Rich Internet

Applications

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

WAI-ARIA: Role and state

Role: I am a slider, therefore I slideState: Feeling pretty good actually

<input type="image" src="thumb.gif" alt="How are you doing?" role="slider" aria-valuemin="terrible" aria-valuemax="excellent" aria-valuenow="good" ...aria-labelledby="leffective">

WAI-ARIA: Landmark roles

Define areas of a web page<div role="banner">...</div><div role="navigation">...</div><div role="main">...</div>

WAI-ARIA: Live regions

Notifies users of page updates

polite assertive RUDE

Opera Tools

Opera Debug menu

Enable and disable CSS, JavaScript, images, multimedia

Check headings, lists data tables and semantic markup

Mobile view

Opera Dragonfly

JavaScript debugger

DOM / CSS inspection

Error console

Remote debugging

Opera Dragonfly

Web Standards Curriculum www.opera.com/wsc

Opera Developer Networkwww.opera.com/developer

Thank you and questions

hennys@opera.com www.iheni.com @iheni