Live Training: Accessible HTML Forms

Are you a designer, developer or tester that works with custom web based HTML forms? This accessible form training features a sample form using HTML, CSS, and Vanilla JavaScript coding best-practices that meet all WCAG 2.1 requirements as well as inline form validation. We will cover keyboard-only, browser zoom 400%, mobile device emulators, text resize 200%, Windows high contrast theme, and NVDA screen reader testing.

Attendees will experience a live demo reviewing a sample form and its HTML, CSS, and JavaScript code focusing on accessible validation best practices.

At the end of the training, you will get access to the example files and a detailed word document outlining everything covered during the training.

In this session you'll learn how to:

• Using native HTML elements to create accessible forms and form elements
• Review CSS requirements for accessible form elements
• Write clear form instructions, helper text, and field labels
• Use color in addition to an error icon to indicate error messages (don’t use color alone)
• Learn about the “autocomplete” form attribute requirements
• Indicate required fields using visual cues and ARIA
• Write descriptive and accessible error messages
• Programmatically associate error messages with form fields
• Test keyboard focus
• Verify screen reader support
• Test using Windows high contrast theme
• Test using browser zoom and mobile device emulator (Google Chrome)
• Review best practices including when to validate form elements