Posts Tagged ‘ARIA’
Tuesday, March 8th, 2011
Yahoo’s HackU events allow Yahoo! engineers to hang out with college students for a week as they explore the latest technologies and spend 24 hours in a caffeine powered hack-a-thon. The University of Washington features several accessibility related research programs. So it was great to visit the campus and deliver this presentation on the existing accessibility challenges and future innovations.
This year’s HackU event featured some amazing hacks. The Accessible Hack award winning team attempted to translate data charts into readable text.
You can skip the slide movie and go straight to the presentation transcript with notes.
Continue reading Yahoo! Hack University: Accessibility Innovations and Challenges
Tags: ARIA, CSS, hack, hacku, images, Seattle, University of Washington, Washington, Yahoo!
Posted in Presentations, Slideshow |
No Comments »
Wednesday, February 16th, 2011
ARIA roles give us much more control on defining how assistive technologies should interact with a page. The application role gives us complete control. But remember complete control can also lead to complete chaos. So how do you use this powerful role? When should it be used?
Application vs. Document
Before diving into the application role it’s useful to understand the difference between application and document based web pages. Your average web page is a document. The user expects to read content and it may feature some interactive behaviors. Applications are more like a desktop application. The user has expects tool sets, instant changes, dynamic interactions.
Continue reading When should you use ARIA role=”application”?
Tags: application, ARIA, document, role, webapp, widget
Posted in Dynamic Pages |
No Comments »
Wednesday, February 9th, 2011
Dirk Ginader gave this presentation on the 5 layers of accessibility at a Skills Matter event in London. Dirk pushes the traditional view of web development as three layers (HTML, CSS, JavaScript) by adding CSS for JavaScript enabled users and ARIA functionality. This presentation also uses the Yahoo! Finance Currency Converter as an example of progressive enhancement.
Continue reading Five Layers of Accessibility
Tags: ARIA, CSS, Dirk Ginader, HTML, JavaScript, London, YDN
Posted in Video |
No Comments »
Tuesday, February 8th, 2011
This form has clearly labeled required fields
It’s important to let users know when a form input is required. Most developers do this via visual tricks; such as placing an asterisk near the input, using color, or other background images. While this helps the sighted viewers, we need to define the labels clearly for screen reader users.
The most direct method is to actually tell the user within the label the input is required. Wrapping the required text in a strong allows the CSS to modify the colors and screen readers will emphasize the text.
<label for="tc">I have read and approve terms and conditions <strong>(required)</strong></label>
<input type="checkbox" value="yes" name="tc" id="tc"/>
Continue reading How to define required inputs with ARIA and HTML5
Tags: ARIA, aria-required, forms, HTML5, inputs, required
Posted in Forms |
No Comments »
Tuesday, February 8th, 2011
What are form labels
Each input on your form needs a label. Yes, that includes radio buttons, check boxes, and file uploads. Labels tell people what an input expects. They also provide larger targets for those with less motor control.
Continue reading Form labels: visible and hidden
Tags: ARIA, form, forms, input, label, labelledby
Posted in Forms |
No Comments »
Friday, January 28th, 2011
As web pages become more interactive, there is a need for adding semantic information about our content.
ARIA landmarks let us define the sections of our web page and their purpose.
The Yahoo! home page with possible pre-defined ARIA landmarks
There are several benefits to using ARIA:
• Enhances document semantics and browsing
• High-level document structure/layout will be perceived by users of screen readers
• Screen readers provide keyboard shortcut for moving between landmarks
There is already a long list of pre-defined ARIA landmarks that you can begin using on your web site. If you want to define a module on your page that does not fit into a pre-existing role you can use the generic role=”region”. This article discusses how to use the region landmark role.
Continue reading Use ARIA region for modules
Tags: ARIA, label, landmark, role
Posted in Accessible Content |
No Comments »
