Forms can be one of the most common areas for problems on a newly launched web site. It can often be the case where a web site visitor takes the time to fill in a form, perhaps to enter a competition or make an enquiry to your company, they submit it and what happens to the details they just filled in? Nothing, the details do not get captured correctly and so are lost.
I have seen it happen many times where a contact form that was believed to be working correctly on a live web site was not sending the details correctly and so countless enquiries were being lost. This can obviously be extremely damaging to your company and very frustrating.
Even more worrying, sometimes this problem goes unnoticed for some time. Think about the forms on your web site, when did you last check that each one was working 100% correctly?
So what should you look out for when testing forms? Our quick guide aims to help you with the important points in 7 easy steps.
1. Fill in the form and check what happens to the data. If it is supposed to go into a database then either check the database yourself or have a developer check it for you and show you the results. Make sure that the data you input is placed in the correct fields in the database. If the form is going to be sent by email then make sure that the form does go to that email address and review the results.
If you are testing on a development or staging web site address, i.e. not the final live web site, then also complete this test once the web site is live. Put it on your post launch checklist now.
2. Some fields will most likely be required – fields such as Email Address are often mandatory. Make sure that they are labeled as being required (usually with an asterisk placed next to the field name) and test completing the form without filling in that field to check that the correct fields are mandatory. Also check the error message is display and make sure that it makes sense.
3. Some fields will most likely require validation – it is generally good practice to validate some fields to check that site visitors input the right type of data. For instance, you may wish to validate the email address field to make sure people type in correctly formatted email addresses. This will not check that the email address itself is correctly but at least the data input resembles a correctly formatted email address.
If you input an incorrectly formatted email address (or whatever validation you are performing) then check that the form does not submit and that an error message is displayed that makes sense to the user.
4. What happens if you don’t enter anything? – make sure that the form does not submit and highlights the fields that are required to be completed displaying helpful and easy to understand error messages.
5. Test that you cannot input html or sql code that you should not be able to do. We will cover code injection in more detail in a later post but for now please understand that code injection can be a serious security risk and it is important that any vulnerabilities are closed. For more information on sql injection please read the following article – https://www.owasp.org/index.php/Testing_for_SQL_Injection_(OWASP-DV-005).
6. Make sure that the form displays correctly and works as intended (and as already tested) for each of the web browsers that you have determined to support. This means going through the same points from 1 to 5 for each web browser.
7. If by submitting the form the user should receive an autoresponse response email, such as a thank you for submitting the form then make sure you receive that autoresponder email. Also check that the sender name, sender email and subject are correct, that the email does not go into your spam folder and that the copy within the email is correct. Finally, check that all links within the autoresponder email direct the user to the correct location. If the autoresponder email is graphical then make sure it displays correctly in all the main email clients.
By following those 7 steps you should have a pretty robust form that has been tested thoroughly, which not only works correctly but is also user friendly.
Right, I’m now going to make sure the contact form on this web site stands up to these 7 steps.