Practices to avoid for accessible apps (HTML)
Looking for the C#/VB/C++/XAML version of this topic? See Practices to avoid for accessible apps (XAML).
- Don't put static text or other non-interactive elements into the tab order (for example, by setting the tabIndex attribute for an element that is not interactive). Having non-interactive elements in the tab order is against keyboard guidelines because it decreases efficiency of keyboard navigation. Also, it can confuse users who expect only interactive elements in the tab order (buttons, check boxes, text input fields, combo boxes, lists, and so on).
- Avoid using custom Cascading Style Sheets (CSS) absolute positioning of UI elements. Whenever possible, lay out UI elements in document or logical order to ensure that screen readers can read the UI elements in the correct order. If the visible order of UI elements can diverge from the document or logical order, use the aria-flowto an x-ms-aria-flowfrom attributes to define the correct reading order.
- Don’t use color as the only way to convey information. Users who are color blind cannot receive information that is conveyed only through color, such as a color status indicator. Include other visual cues, preferably text, to ensure that information is accessible.
- Don’t automatically refresh an entire page. If you need to automatically refresh page content, update only certain areas of the page, and mark the areas as live regions.
- Don’t use UI elements that flash more than three times per second. Flashing elements can cause some people to have seizures. It is best to avoid using UI elements that flash.
- Don’t change user context or activate functionality automatically. Context or activation changes should occur only when the user takes a direct action on a UI element that has focus. Changes in user context include changing focus, displaying new content, and navigating to a different page. Making context changes without involving the user can be disorienting for users who have disabilities. The exceptions to this requirement include displaying submenus, validating forms, displaying help text in another control, and changing context in response to an asynchronous event.
Build date: 11/26/2013