html5 accessibility support (2013)

HTML5 Accessibility

Where's it at?Leonie WatsonNomensa

Steve Faulknerthe paciello group

You laugh now, wait till you join the HTML working group

all the excitement

all the work

HTML is BIG

web technology stacked

MathML

new UI

controls

HTML5 makes using stuff easier

audioARIA

SVG

video

new semantic

structures

Date and Time input

Local Date and Time input

E-mail input

Month input

Number input

Range input

datalist

details

menu

meter

progress

new UI

controls

New UI controls = potential accessibility improvements

New UI controls = potential accessibility improvements

new UI

controls

1. browsers need to implement the new controls

2. browsers need to implement accessibility support for the new controls

and really the 2 should not be separate, but they are...

Accessibility APIs

MSAAIaccessible2UI automationAXSTK+ input device support

roles

states

properties

interaction

Accessibility API

role=button

action=press

state=focused

value=submit query

browser

Input device:presstouchclick

form controls demo

new UI

controls browser implementation

Accessibility support implementation is a further subset

when will browsers expose HTML5 features via accessibility APIs

?

?

?

?

?

when will browsers implement HTML5 UI features?

When will browsers implement HTML5 UI features in a way that developers will want to use them?

or more to the point

When will the CSS hooks be implemented to allow flexible, atomic styling of control and their sub elements?

audio

video

captioning

accessibility information

new structural elements in HTML5

Using WAI -ARIA Landmark Roles | Screen reader support for HTML5 sections

matching features to semantics

<figure>

<figcaption>Film photograph. <span lang="fr">Séraphin Médéric Mieusement </span>, 1936.</figcaption>

</figure>

• HTML5 Accessibility Chops: the figure and figcaption elements

• HTML5 Accessibility Chops: using nested figure elements

alt="The castle lies in ruins, the original tower all that remains in one piece."

figure Accessibility API mapping

HTML to Platform Accessibility APIs Implementation Guide

figcaption Accessibility API mapping

HTML to Platform Accessibility APIs Implementation Guide

HTML5accessibility.com

HTML5Accessibility.com

Accessibility testing tool

aViewer

thank you

https://twitter.com/LeonieWatson

https://twitter.com/stevefaulkner

http://html5accessibility.com