Smashing magazine addresses designing efficient web forms on structure, inputs, labels and actions. A form is a type of conversation. And like any conversation, it should consist of logical communication between two parties: the user and the app. Structure includes the order of fields, the form’s appearance on the page and the logical connections between multiple fields. Input fields include text fields, password fields, checkboxes, radio buttons, sliders and any other fields designed for user input. A form should be made with one column, if a form is in a single column, the path to completion is a straight line down the page. Validation errors are inevitable and are a natural part of data entry (because users are prone to making errors). Yes, error-prone conditions should be minimized, but validation errors will never be eliminated. In summary the website offers sound design principles to designing web forms.
Hubspot offers 15 tips for better web form design. Companies implement forms on their websites to provide visitors with a way to sign up for an account, purchase a product, pay for an item, and more. That’s why online form design matters so much. Be simple and straightforward. If a form asks for too much information, you risk losing submissions and conversions. When creating your form, include only the most crucial information you need and refrain from adding any unnecessary fields and questions. Use one column. Single-column layouts are easier to follow, understand, complete, and submit for your visitors. Arrange your form fields from easiest to hardest Start your form with the easiest field questions (like name and email) before asking your visitors the more time-consuming questions (such as billing and shipping information). Clearly title your form. Give your form a title that helps your visitors understand exactly what they’ll receive once they submit it. This site offers many ways to improve form design but these are just a few of them.
Contact me at ethanjohandang@gmail.com.