Accessible forms

Techniques

  • Accessible CSS forms
    "Websites have become less accessible and more complex over time according to recent studies. Learn how to buck the trend by creating fast, accessible CSS forms that work with modern browsers and gracefully degrade."
    (Andy King, Web Site Optimisation)

  • Accessible forms
    "This document is concerned with what the user of a website form 'sees' and interacts with. It outlines how you can create forms for the web that are more accessible and describes the appropriate use of label, fieldset and tabindex elements."
    (Roger Hudson, Web Usability)

  • Prettier accessible forms
    "It can be time consuming to make web forms both pretty and accessible."
    (Nick Rigby, A List Apart)

  • Speaking form labels - summary
    This article summarises some screen reader testing on various techniques for designing form labels and makes recommendations based on these tests.
    (Bob Easton, Access Matters)

  • Usable and accessible form validation and error recovery
    "Form validation is the process of testing to ensure that end users enter necessary and properly formatted information into web forms. Error recovery is the process of guiding the user through fixing missing or improper information as detected by form validation. The Web Content Accessibility Guidelines 1.0 state that you should, 'ensure that pages are usable when scripts, applets, or other programmatic objects are turned off or not supported.' Older browsers and new portable technologies may not support scripting; and there are many reasons why users may have scripting disabled. As such, developers should not require client-side scripting in order for the web form to be accurately completed and submitted. However, web developers can utilize the benefits of both server-side and client-side validation and error recovery to ensure that their forms are completed in a usable and accessible manner."
    (WebAIM)

Tools

  • Accessible form builder
    "A simple but very quick way of putting together a form that uses either CSS or table for layout, automatically creates label elements and the associated for and ID attributes, as well as (optional) title attributes for each text field. It's as simple as entering a list of fields that need to be captured and hitting return."
    (Accessify.com)