The information on this page is mainly directed at those who create their own forms from scratch. Certain content management systems have their own modules or add-on programmes that can help you create a form.
Things to remember when creating a form
Ensure you don’t shut out any visitors by providing non-accessible forms. Below are a few important points to remember:
- Consider again whether every field in the form is truly needed.
- It should be clear which fields of the form are mandatory to complete.
- There should be a guiding text for each field of the web form. The guiding text is a text that specifies to the visitor what they should enter in a certain field. See an example below these bullet points.
- Each guiding text must be linked to the correct field in the form using what is known as a label. This is entered in the HTML code, see the example below these bullet points. This occurs automatically in most web-publishing tools.
- Ensure that all fields are accessible and clearly marked for those navigating the form using a keyboard.
Guiding text for a field in the form
In the example below, “Email” is the guiding text for the field.
Guiding texts that are linked to the correct field in the HTML code
<input id=”email" type="text">
The HTML code above shows how the guiding text (Email:) is linked to the correct field in the form thanks to labels in the code. The value in “for” should be the same as the value in “id”.
A common accessibility problem in forms are error messages that are difficult to interpret. You have no doubt come across error messages yourself that are entirely incomprehensible and thus know how frustrating this is.
Review all error messages on the website to ensure they are concrete and easy to understand. Write clear error messages that explain what information needs to be entered into the form. Do not write that “the field contains forbidden characters” – instead, write which characters are not permitted.
Project group for web accessibility
Contact the project group via email: tillganglighet [at] kommunikation [dot] lu [dot] se