Designing for Accessibility - Scripting

Scripts essential to the functionality of a page

• Include <noscript> tag to provide alternative content so that the page will make sense and can still be used when scripts are turned off or not supported.
• Do not use scripts to provide blinking and moving text
• Use server side scripting for background functionality that is essential to the web page, for example, making calculations in background.

Image roll overs - image changes when it receives focus with mouse or keyboard

• None if used for visual effect only (non-essential)
• If image roll-over provides information, place the information in the alt tag of the rolled images

Emulating browser functions like back, close window, print page etc

• None as they are available within the browser

"Programmatic Animations" or timed events like timed presentations

• Provide controls to stop, pause or restart event

Page refresh, redirects and event timeouts

• Avoid script links within the < a> tags
• Avoid page refresh especially within the Meta tags
• Provide user controls for "time-out events"
• Provide warnings that the page will refresh or event will time-out

Change focus to a different window without warning - Links to pup-up or new windows

• Provide warning of change of focus or opening of new window
• Provide alternative content in <noscript> tag

For events that do more than just change the presentation of an element

• Use device-independent event triggers like "onFocus", "onBlur" and "onSelect" rather than user interaction-level triggers like "onmousedown" or "onclick".
• If you must use device-dependent triggers, provide redundant input mechanisms; for example, specify two handlers for the same element. Use "onmousedown" with "onkeydown" or "onclick" with "onkeypress".
• Do not write event handlers that use double-clicking ( "ondblclick" ). There is no keyboard equivalent device-independent handler.
• Do not write event handlers that rely on mouse coordinates because this will prevent device-independent input.

Dynamic menus or fly-outs (mouse dependent)

• Make sure each of the top level menu items is keyboard navigable
• Make each item a link in its own right
• Provide a link to the same menu options (as in the dynamic menu) using static text links.
• Provide a method for users to switch to alternative menu formats
• Do not create fly-over or drop-down menus that cover content

Menus using style sheets and form controls like drop-down combo boxes

• Create menus that work when scripting or style sheets are turned off.
• Do not use absolute positioning to construct menus. This prevents someone from resizing the menu to suit their needs, such as using large fonts.
• For menus that use drop-down combo-boxes do not automatically launch the link "onchange" but provide a "Go" button. This will help ensure that the correct option is selected before launch.

Forms

• Do not move focus automatically from one form element to another when the end of field size is reached. This makes it impossible to use SHIFT-TAB to move back through the fields to correct errors.
• Alert user to form-timeouts and provide a mechanism to disable time-out feature
• Do not automatically submit the form after validation.
• Ensure the form information and cues make sense and can still be used when scripts and style sheets are turned off.
• Ensure that placeholder text used as prompts within form fields are ready for edit when focus moves to that field.
• Provide a static version of forms that have fields that are dynamically altered when the form is filled.
• Do not reset all form content when information is not validated. Provide a mechanism to automatically move the user to the first invalid field and clear the field and give the associated error message.