HTML Forms: Accessibility

44mIntermediate2024-03-27

Authors

Ifeoma Nwosu

Course details

Web developers have a tremendous responsibility to ensure that their products are inclusive and accessible to everyone. Forms are one of the most common and important elements of web applications, as they allow users to interact with the system, provide feedback, submit data, and perform various tasks. However, forms can also pose many challenges and barriers for users with disabilities, and if not designed and coded properly, they can prevent users from accessing the information and services they need.

In this course, software engineer Ifeoma Nwosu shows you how to create accessible forms that follow the best practices and standards of web accessibility. Learn how to improve form accessibility with form controls. Discover ways to help users input data into forms, including various input types like checkboxes, radio buttons, and text. Finally learn how to manage data entry errors and how to help users avoid putting the wrong data into form fields.

Skills covered

HTMLAccessibilityCSSWeb StandardsWeb DesignDiversity, Equity, and Inclusion (DEI)Front-End Web DevelopmentUser ExperienceWeb DevelopmentOpen SourceOne-Off

Concepts

0. Introduction

01 - Be an HTML forms MVP
02 - What you should know

1. Introduction to Form Accessibility

03 - Course use case
04 - What is form accessibility
05 - Appearance

2. Improving Form Accessibility with Form Controls

06 - Introduction to HTML form controls
07 - Input, textarea, select, and button form control
08 - Label element

3. Helping Users Input Data into Forms

09 - Introduction to HTML form attributes
10 - Input types - Checkbox, radio button, text, password, and email
11 - Aria-describedby and aria-labelledby attributes
12 - Name and for attributes
13 - Placeholder, label attribute
14 - Focus indicator

4. Managing Data Entry Errors

15 - Required attribute
16 - Autocomplete attribute
17 - Min-length and max-length attribute

Conclusion

18 - Next steps