[thelist] Accessability for web survey questions

[Ian Anderson]

Sam Carter wrote:
> Are there any special accessibility considerations for coding a <form> 
> block which contains a few radio buttons to gather a user's response to 
> a survey question?

Special considerations apply for radio buttons and checkboxes in forms 
for screen readers.

Radio buttons have always been tricky for access in screen readers 
because they usually need two labels, in effect: e.g.

Are you happy right now?
(*) Yes  () No

In a screen reader tabbing through the the form in forms mode, the user 
would typically hear simply "Yes radio button checked" - provided the 
yes and no labels were properly positioned and marked up - *without* 
hearing the heading that explains what the choices relate to.

Not terribly informative. Users who can see the form don't have the 
problem because they can see the information that the screen reader 
skips over.

Most screen reader users (in my experience) will not read a whole form 
before commencing its completion, and when they have to come out of 
forms mode, read around to figure things out and go back in, they often 
get lost. They may end up moving off the page, and lose their place 
completely so that they have to start over, or abandon the task.

Wrapping each radio group in a FIELDSET with a LEGEND like this

<fieldset>
<legend>Are you happy right now?</legend>
<input type=radio blah> Yes
<input type=radio blah> No
</fieldset>

would give the user something like

"Are you happy right now? Yes radio button checked"

in the most commonly used screen readers. This markup has been tested in 
  JAWS, Window Eyes and HPR, though not current versions.

Using headings and lists would have absolutely no benefit to the user 
*in forms mode* in most screen readers.

Trouble is, the most recent version of JAWS seems to have done away with 
forms mode, and senses when you are in a form automagically. This could 
make things better for users in general, as they may hear more of the 
incidental content between and around form elements, whereas previously 
they heard ONLY the labels and form field contents, typically.

But it seems to have broken the ability to use LEGEND in the manner I 
describe above, so that even with the legend as well as labels, radio 
button labels were read without context - haven't had time to experiment 
much with it, though, so could have missed something obvious.

Definitely worth downloading JAWS most recent trial version and testing 
your forms in it, but be aware that this seems to behave differently 
from previous versions, and see PS below.

Where possible, if you can write the form labels so that they *don't* 
need an extra piece of information to decode them, then the form design 
is much safer:

e.g. (*) Yes, send me information ()No, don't send me information

will always be clear, whereas

Send me information?
(*) Yes   () No

may not.

Otherwise, the only other advice is to ensure that every form field has 
a label, and that critical instructions appear either
a. At the top of the form
b. Within LABEL markup for the relevant control

Final note - good idea to ensure that the LABELs use the FOR/ID feature 
to increase the clickable area (as in your example) and that there is a 
clear visual association between related radio button and labels.

This last is because users may become confused when three or more radio 
buttons are presented in a row, because label text in the middle could 
visually relate to the control on either the left or the right. It's not 
so bad with two side by side, or with controls that are stacked vertically.

HTH

Cheers

Ian

PS You can expect JAWS users (and all screen reader users) to be 
exceptionally slow to upgrade their software for several reasons, so the 
likelihood is that the majority of screen reader users will have the 
experience described for quite some time to come.


-- 
_________________________________________________
zStudio - Web development and accessibility
http://zStudio.co.uk

Snippetz.net BETA - Online code library
File, manage and re-use your code snippets online
http://snippetz.net