Accessible Forms Gaby de Jongh IT Accessibility Specialist

Accessible Forms Gaby de Jongh, IT Accessibility Specialist UW-IT, Accessible Technology Services gabyd@uw. edu | uw. edu/accessibility

Things to Consider • People with cognitive disabilities can better understand the form and how to complete it, making forms accessible improves the layout structure, instructions, and feedback. • People using speech input can use the labels via voice commands to activate controls and move the focus to the fields that they must complete. • People with limited dexterity benefit from large clickable areas that include labels, especially for smaller controls, such as radio buttons and checkboxes. • People using screen readers can identify and understand form controls more easily because they are associated with labels, field sets, and other structural elements.

Common Mistakes of Designing Forms: Gestalt Perspective (1 of 5) 1. Lack of Guidance for Mistakes/Unclear Error Messages a) Provide guidance and information to clarify why a form entry isn’t correct. If possible, provide feedback in real time so the user does not have to complete a form and hit submit before being informed of a mistake. b) Great forms specify details about an entry that may cause confusion. They provide in-context, specific, and actionable feedback to ease the process for a correct entry. c) Avoid only using color to indicate error. Instead, provide contextual guidance to correct the error by the form field where it occurs.

Common Mistakes of Designing Forms: Gestalt Perspective (2 of 5) 2. Lack of Sequencing a) Apply a logical sequence when asking for information in a form. Having questions in an intuitive sequence allows users to predict what they may be asked next. b) For longer forms, break up logical sections and show progress on the form to give more context for the user.

Common Mistakes of Designing Forms: Gestalt Perspective (3 of 5) 3. Multiple Columns a) Creating multiple columns disrupts a user’s flow of reading from top to bottom, left to right. Avoid having multiple columns in forms unless the entries are logically related. b) Do not use table formatting to structure a form.

Common Mistakes of Designing Forms: Gestalt Perspective (4 of 5) 4. Disappearing Labels/Using Captchas a) Don’t hide important labels for the sake of space and don’t make assumptions that the user will remember your prompt b) Captchas are sometimes necessary but are generally very annoying. In web forms they can present a real barrier to conversion.

Common Mistakes of Designing Forms: Gestalt Perspective (5 of 5) 5. Overcomplicating/Making Data Entry Harder Than It Should Be a) Only ask for crucial details in a form. Most users don’t have patience for a long form and may find it easy to drop off and/or make errors if the process is lengthy. b) It should be as easy as possible to complete a form. The smoother the process, the more likely users will complete them.

Conclusions • Provide clear instructions about what information is desired • Make sure the order in which form elements are accessed is logical and easy to understand • Instructions, cues, required form fields, field formatting requirements, etc. should be clearly identified to users

Resources • https: //envato. com/blog/designing-form-avoid-6 -commonmistakes/ • https: //www. w 3. org/WAI/tutorials/forms/ • https: //webaim. org/techniques/forms/