Jump menu should be device-independent | |
WAI / WCAG 1.0 Priority 2 checkpoint 9.2 | |
Issue Description The page contains a jump menu (i.e. a menu with a list of options each leading to a different page) based on a SELECT element with an ONCHANGE event handler that loads another page. This behavior prevents visitors using keyboards to scroll through the list to select an option. |
|
How to fix
There are two steps to make the jump menu device independent:
When adding a Dreamweaver jump menu object to the document, it is possible to automatically insert a button after the menu. Simply enable the checkbox 'Insert Go Button After Menu'. Remember to remove the ONCHANGE attribute of SELECT and to add ONKEYPRESS to the button. For example, the following code is wrong: <form name="select_country"> Select a country: <select name="country" onChange="MM_jumpMenu('parent',this,0)"> <option value="http://www.this_site.com/be" selected>Belgium</option> <option value="http://www.this_site.com/us">United States</option> </select> </form> An accessible version is: <form name="select_country" action="http://www.this_site.com/jump.cgi"> Select a country: <select name="country"> <option value="http://www.this_site.com/be" selected>Belgium</option> <option value="http://www.this_site.com/us">United States</option> </select> <input type="submit" value="Go"> </form> |
|
Issue Explanation The JavaScript code associated with the SELECT element does not allow the user to scroll through the available options when using a keyboard. It is not device independent.
JavaScript code is device independent if:
Generally, pages that allow keyboard interaction are also accessible through speech input or a command line interface.
Remember also that a jump menu works only if
JavaScript is enabled and available on users' browsers. There are
browsers that do not support JavaScript (e.g. for cell phones and
PDAs) and there are organizations that turn off JavaScript from
normal browsers for security reasons. Consider also writing a server-side script to process the URLs passed by the menu and to deliver the appropriate page. |