Focus control and mobile accessibility

This post follows a presentation I gave at the Mobile+Web Conference in Boston, July 2013. This deals specifically with the impact of providing focusability in mobile applications, whether iOS, Android, or web applications. Each platform provides unique methods and requirements.

Continue Reading Focus control and mobile accessibility

Using aria-describedby to replicate fieldset and legend

Complex forms should use a fieldset and legend to group similar inputs. The legend is announced along with label text for each input. This is especially helpful when form inputs are repetitive, such as mailing, billing, and work address information.

This example fixes a form that included a form within a table. It uses the aria-describedby attribute to connect the individual form inputs with a header cell. It was inspired by DeQue’s recent article for using ARIA to replace fieldset/legend in a set of radio buttons: ARIA-Group: a viable alternative for Fieldset / Legend?.
Continue Reading Using aria-describedby to replicate fieldset and legend

Mobile Accessibility

I gave this presentation at the Silicon Valley Code Camp about mobile accessibility. I tried to reach all audiences by showing what can be done with mobile technology for accessibility, how the operating systems stack up, and the common problems with solutions. I also included instructions on enabling the screen reader for iOS and Android.
Continue Reading Mobile Accessibility

Debugging aria-label on elements

Sat, Sun, Mon - Forecast iconsI recently helped do some testing on the new version Yahoo! Mail for iPads and was stumped by an aria-label not working as expected. It was one of those gotcha moments, when you realize a confusion with a fundamental process. Are you wondering why your aria-label is not being announced?

It’s tempting to use the aria-label attribute in situations where the visible text is not adequate. For instance, you may use a background image to represent a value and you’d like the user to know that value via an aria-label on the parent.

This basic test page will walk through the simple assumption and show how the aria-label is meant to be used.

Continue Reading Debugging aria-label on elements