How to make your forms accessible
Filling out forms. It’s probably one of the most used actions on the internet. Sure, it’s easy enough for what we often perceive as the ‘average user’. But there’s the catch. There’s no such thing as an average user.
Instead, we should design and develop these forms in the spirit of inclusive design: easy to use and accessible for anyone. Making your form screen reader-friendly is always a good idea, but have you really thought it through?
During some clients’ work, one of our teams developed a standard accessible form. To make the world a little more inclusive, they decided to share it with as many people as possible.
Below, you can find a demo of our accessible form. If you want the technical details and code, feel free to visit our Dev Blog.
Help your user navigate
First things first: give your user orientation and context. Let them know where they’re at, what kind of field they’re in, what’s expected of them and how they can continue.
Let them know what’s wrong
Don’t just tell there’s an error. Explain what’s wrong. In this example, the screen reader tells you which fields are invalid and why they are invalid. Once again, they repeat what input is necessary to complete the form.
Let them know when it’s right
Don’t leave your user wondering if he was successful or not. Make sure that he gets the message if everything went well.
Implementing this accessibility feature in your form isn’t hard. But it means the world for a lot of people. Make the internet a better place, and try to make the inclusive design reflex when you’re building your next digital product.
