Forms are everywhere in our applications. Whether they’re contact forms or login screens, whether or not they’re core to an application’s functionality, they’re truly omnipresent. The design of a form, however, can easily make or break the user’s experience. In this chapter, we’ll style a form and look at some of the accessibility considerations we need to make sure to address. We’ll look at some of the challenges that come with styling some radio and check-box inputs and drop-down menus, and we’ll cover some options for styling error messaging.
A form in this context is a section of code in an HTML <form> element containing controls (form fields) that the user interacts with to submit data to a website or application. Because contact forms are so prevalent across applications and websites, we’ll use a contact form as the basis for our project.