It is rare to see a website without a form that you will use for contact or to register. The interaction on this type of web pages requires a lot of processing when you have to check the validity of the user input. This article explores the testing of web forms from the usability perspective.
Author: Nataliia Syvynska, TestMatick, https://testmatick.com/
Concept of Web Forms
A web form is a specific set of fields, lists and check-boxes. Its completion and submission could provide the users to full access to a particular functionality of the website or data, authorization to perform some operations or permission to leave personal information on this resource.
Since some users can often interact with various types of forms, the convenience of filling out and submitting such forms is important for websites and for web testing. There are many approaches and methodologies on how to build feedback between the users and a web form when they fill it with information. If the fields are filled in incorrectly, a user should immediately receive a notification that mistakes have been made and information on how to correct them.
Errors can be displayed to a client in two popular ways:
- Immediately after sending data (validation process after sending information);
- Instantly (built-in validation mechanism – when a focus has been lost on some part of a form).
Validation after the process of sending data is very common, but from the technical point of view, it is not considered the most successful option. With this method of validation, a website user first fills out all the forms, then sends the information to a server by clicking on the “Submit” button, the data is verified for validity on the server, and only after such a process, the data is displayed on the user’s screen as an error message. In this situation, the process of filling out the form may take a long time and this will make the users wait. In this case, they will have to fix all the errors inside the form and send it again. In this situation, they may not make a mistake again.
You need to be very interested in this resource to not leave everything halfway and start searching for a better option. With numerous similar websites for many thematic resources, a user can quickly find a better option. To prevent such situations, you should use the built-in validation mechanism on a form: when filling in the fields, the users will immediately receive an error message and this means that they will spend less time to correct them.
Messages can be displayed inside a form in different ways:
- In the form of a green check-mark – the correct filling of the form;
- Red cross – incorrect filling;
- Highlighting a field without errors with a special green frame;
- Highlighting a field with a mistake with a special red frame;
- A text message with a specific hint, in case the user has incorrectly filled in the field;
- Pop-ups with prompts.
Many experts on web quality agree that the built-in validation mechanism greatly affects the impression of users when they interact with a particular resource. Data from some studies says that the effectiveness of built-in validation and validation after sending information are shown by the following statistical calculations:
- The success rate of filling out forms has increased by 25%;
- The number of mistakes made has decreased by 22%;
- Product satisfaction has increased by 31%;
- Form filling time has decreased by 41%;
- The number of eye fixation has decreased by 47%;
- The number of users who claim that filling out the form was worth the effort has increased by 22%.
Additionally, the level at which a user must enter information in the fields affects the level of interaction with a form on a site. There are two types of validation policies:
- Complex validation policies;
- Simple validation policies.
Complex Validation Policies
With this policy, a user will have to enter information in one specific format. This will allow entering extremely accurate data into a form and prevent the occurrence of unexpected errors which will especially help in the situation when working with fields for important and confidential information. A good example of this is working with the field to fill in a mobile phone number: the system will not allow the user to enter more than 9 digits, 2 of which must be the code of the current carrier.
Simple Validation Policies
Soft validation allows users to enter data in a form that is convenient for them, and the process of converting data into the required format is responsibility of the system. For example, in the phone input field, the user isn’t required to put brackets. This method allows achieving the maximum level of usability but it also contains a lot of risks that are directly related to its realization. Implementation of information conversion requires additional resources. There is a big risk not to take into account some kind of data entry and to make an error inside the program code.
Usability Testing of Validation Forms
During usability testing of forms, special attention should be paid to several extremely useful rules that will help you to qualitatively check the current level of usability of any form.
Testing of Tooltips
Tooltips help users understand why they should enter this or that information and in what specific format it should be done. They allow you to rapidly and correctly fill out the forms.
Error Message
Users must receive a special message about mistakes regardless of the type of validation used on the site. It is also very important that the information entered by the user should not be edited even if a user has submitted the form. It is always worth remembering that an important characteristic of clear error messages is maximum simplicity and brevity.
Excessive Cavil
This is an extremely unpleasant situation for users when information can be entered only in a strictly defined format, and all other options are categorically excluded. For example, a field for entering a date of birth where the system allows you to enter a double format for the year of birth: 1900 or 00, and the symbol “.” or “/” must be allowed between the numbers. When requesting a phone, a good option is the complete absence of the necessary “+” character, brackets or dashes. A user should be able to enter data in a way that is most suitable for him/her.
Conclusion
The process of testing a form for usability is extremely important during full testing of websites, since the clarity and simplicity of a product, its user-friendliness are extremely important characteristics to make software attractive for an end user. Having made the forms as simple, convenient and concise for customers as possible, you can earn maximum trust and greatly increase the number of users who will like using software.