Day: March 6, 2012

Almost all websites need some kind of form to be filled, either for membership or registration. Sometimes, these forms may be required for voting or choosing certain functionality as well. While it is easy to create forms using HTML, visually attractive forms are not very easy to create. What Are The Must Have Features Of A Web Form? It is very important to make sure that web forms are visually attractive, and that they finish the form completion process as quickly and as efficiently as possible. There are several reasons why a web form has to be at its best. People’s attention span is very short. When they realize that they need to fill in a form to access what they want to, there are chances that they actually give up their goal and close the page altogether. The idea is to understand that people do not like filling forms, and thus it has to be as short, concise and simple as possible. People’s visual attention is centred on a vertical line and they always need to know how the job could be completed in less time. Thus, web forms should be lined up in an aesthetic manner. The submit button must be attention grabbing but be simple as well. No one likes to see endless and lengthy forms that don’t get over until one scrolls down for a long time. To make the form filling process easier, one should really know what information is being collected, and how the information collecting process can be simplified. One must also try and allow auto-filling of forms so that people can use their custom auto-filling software in order to fill as many details as possible. Arrow marks tell the visitor which direction he needs to click further to reach submission button, and progress indicators reveal how best to communicate the position, scope and status. Web Form Validation: Why It Is Necessary Of course, people do fill forms when they really need to move ahead. However, they may also enter wrong details and information. This is one of the reasons why web designers must consider web form validation. The idea behind web form validation is to make sure that users provided the right and properly formatted information in order to proceed further. It also makes sure if a user provided all the necessary information without missing anything deliberately or otherwise. Inputs that users make can be validated in two different manners. One is to validate it on the client’s (web browser) side, and another is to validate it right on the server side. When validation takes place on the server-side, information that is sent to the server is validated with the help of a server-side language. If it fails, the error feedback is displayed on the client’s screen. It is a secure method which works even if JavaScript is turned off. However, it takes a longer time to load and refresh. While server side validation is good enough for secure form validation, for a better and richer user experience, one might want to use client-side validation. However it relies on JavaScript, which is not always a preferable method. However, by combining both server-side and client-side validation, one could get a faster response, secure validation and amazing user experience. Ten Best Practices To Keep In Mind While Designing Forms Can Be Listed Below: Must be visually attractive and simple. Must be as short, concise and crisp as possible. Formats must be defined prior to creation of forms and it is always not a good idea to be very strict with them. Sometimes, users may not want to care about upper case or lower case as much as a web designer would. Passwords must always be confirmed, and once a form is filled it is a good idea to allow the user to confirm if the information is correct or not. Once information is validated, feedback should be given in a supportive manner. It is always a good idea to let validation take place upon submission of information in the form. Lesser the time, better is the user experience. If possible, using real-time validation is a much better option. If possible, OAuth options could be used as well, wherein clients can use Facebook or Twitter to fill in forms, if they are logged in. Combining server side and client side validations. Using HTML5 instead of flash-heavy pages. Some Of The Factors That Must Be Avoided Are: Single error pages are not pleasant. Once a form is filled and submitted, users would have to press the back button if they want to fix errors. JavaScript popups can be avoided. Lengthy and redundant forms have to be done away with. Textual forms look cluttered. It is better to have forms that are graphically rich instead. Avoiding help information in order to make a page look cluttered is not a good practice either.