Sunday, 7 December 2014

Putting a Face on Accessibility Part 2

Professor Chris Olson has had a really busy year.
Chris recently bought and moved into a house.
Like many home purchases, there was a bit of remodeling that took place before the move to make the space more usable.
Chris will be sharing that new home with his fiancé Cindy.
Chris and Cindy were engaged on New Year's Eve. Chris has been teaching graduate and undergraduate level computer and web programming classes for the past seven years.
In March 2013, he successfully defended his doctoral dissertation, "Awareness of Accessibility in Computer-based Instructional Materials and Faculty Demographics in South Dakota Public Universities.
" Chris is quadriplegic-paralyzed from the shoulders down.

In 2001, he was in a car accident and shattered his c5 vertebrae.
While he has limited use of his bicep muscles, he has no movement or sensations in his hands.

Typically the first thing many of us think of when we hear web accessibility is the need to use a screen reader.
A screen reader is not the only kind of assistive technology used. Chris relies on typing sticks to operate his various computer input devices, and also relies on Dragon Naturally Speaking for dictation.
He does not use a computer mouse; instead, he relies on keyboard navigation.
Some additional assistive technologies Chris relies on include Windows mouse keys, and Windows speech recognition. In addition, Chris uses a Samsung Galaxy smartphone, a Kindle reader, and is looking into a Nest Learning Thermostat for his house, which he can control from his smart phone.
Too often, we forget to put a face on people with disabilities, instead lumping them into categories: · Blindness or Low Vision · Deaf/Hard-of-Hearing · Learning Disabilities · Medical Disabilities · Physical Disabilities As web developers, here are a few additional methods that will assist your users that utilize non-mouse assistive technologies.
Tab order Tabbing navigation is the ability for a user to navigate between focusable elements with the tab key of the computer keyboard.
Usually, pressing [Tab] will move focus to the next element, such as hyperlinks or form fields.
The order of focusing can be controlled by using "tabindex.
" According to the W3C, the "tabindex" attribute is "the position of the current element in the tabbing order for the current document.

" "Tabindex" works sequentially, tabindex="1," tabindex="2," etc. Elements with no tabindex set will appear after, in the order they appear on the page. Labels on form elements The label tag is a HTML forms tag that allows developers to tell the browser or user-agent that text appearing on the page is actually a label for a form element.
The label tag says, "This content is describing a form element and should be associated with it.

" The label tag also provides a larger clickable area for items like radio buttons.

You can click on the text that the label tag encloses as well as the radio button itself.
Adequate clickable space on a link Make links, buttons and checkboxes easily clickable.
A label on form elements, as we just talked about, is an example of increasing the clickable area.
Linking block elements, instead of individual text, is another great way to increase the clickable area.

You may choose to increase the padding of an element with CSS to make the clickable area larger.

Visible keyboard focus Visible keyboard focus is a critical factor in ensuring access for sighted users who rely on a keyboard for navigating the Web. Unfortunately, design aesthetic has outweighed this important practice.
CSS reset files are notorious for removing this visual element.
Remember that focus is listed in WCAG 2.
0 as success criterion 2.
4.

7 for a reason.

Work with your designer to create some form of visual identifier for focus - you don't have to rely on the "ugly dotted border." When you sit in on one of Dr. Olson's programming classes, prepare to be inspired by his coding prowess, as well as his typing speed-30 words-per-minute.

Chris will continue to amaze as you observe his influence on the next generation of professional web developers.

No comments:

Post a Comment