hostmonster-Host Unlimited Domains on 1 Account   coolhandle offering reliable webhosting since 2001
Unlimited Hosting Space - FREE Site Builder   Smart Website Solutions for Your Small Business=

Nine excellent examples of web form design

Filling in forms online can be a pain, but good design can make a lot of difference to the user experience. 

To coincide with our new Marketer’s Guide to Form Optimisation, produced in association with Fospha, I’ve collated some examples of great form design, or aspects of forms that are worth learning from.

Schuh: easy address entry

Schuh uses this predictive postcode entry tool on its checkout, which suggests matching addresses as you begin to type them in.

This has two benefits:

  1. The customer doesn’t have to spend time typing out their whole address.
  2. It reduces the risk of making mistakes and subsequent delivery problems.

form-opt10

Threadless: use of micro copy

Some form fields can create confusion among customers, perhaps due to uncertainty about entry formats, or the information required.

This can often be solved with some explainer text placed next to the relevant form field.

Here, Threadless clearly explains what it expected in terms of card entry, and clarifies the security code format for different card types.

form-opt6

AO.com: easy input formats for mobile users

While form entry is always likely to be a little more difficult on mobile devices, thanks to a smaller screen, there are ways to use the features of smartphones to make it easier.

For example, AO.com defaults to the most appropriate mobile keypad depending on the type of data required – numerical keypad for phone numbers, email keypad for email addresses, and so on.

form-opt12

Booking.com: card scanning on mobile

Booking.com and other sites provide a card scanning option which uses the smartphone camera to shorten the process of entering payment details.

form-opt14

Moneysupermarket: addressing questions about form fields

Here, Moneysupermarket provides useful information next to many form fields which explain why some information is needed and how it will be used.

moneysuper

Autoglass: clear error messaging

Error messages should be clear and helpful. They should also be placed next to the relevant form field.

form-opt7

Lowe’s: offer registration at end for guest checkout

Guest checkout is an essential option for most retailers but it’s also important to encourage customers to create an account. The key is to avoid making it a barrier to purchase.

Here, Lowe’s presents this option at the end of checkout, and is only asking for the creation of a password.

form-opt-17

Reiss: explaining why information is required

Some sites ask for information which some may not consider to be necessary for checkout. For example, some may wonder why a phone number is required, and worry that it will be used for marketing purposes.

Here, Reiss reassures customers that it will only contact them if there’s an issue around the order.

reiss

Selfridges: clear CTAs

Sites  shouldn’t leave users in any doubt about where they need to click to complete or move on to the next step of forms.

Selfridges makes sure that the CTA for delivery is clear and unmissable on a mobile device.

form-opt13

The report, A Marketers Guide to Form Optimisation is available to download free of charge now. 

Graham Charlton is Editor in Chief at ClickZ Global.

Related reading

google amp project

Accelerated Mobile Pages (AMP): one year on – stats and infographic

We’ve written an awful lot about Google’s open source accelerated mobile pages project (better know as Google AMP) over that last 12 months.

Email Marketing

Eight tools to help manage every step of the email marketing process

Email marketing can be overwhelming, especially if you are new. Lots of tweaking, designing and testing. These eight tools will help you manage email marketing like a champ!

click meeting

10 best tools for generating super-hot leads

What tools do you have in your toolkit to help you find prospects? LinkedIn, Twitter, Facebook, an email subscription list, etc.?

telephone book

Guide to Excel VLOOKUP basics and top five rookie mistakes

An Excel VLOOKUP can be a marketer’s best friend because it can save you hours of work.

Article source: https://searchenginewatch.com/2016/10/19/nine-excellent-examples-of-web-form-design/

Tags:


Submit a Review




If you want a picture to show with your review, go get a Gravatar.

1&1 has shared hosting and dedicated hosting solutions for every budget and free domains with all hosting packages!  StartLogic - Affordable hosting: Free setup/domain, unlimited emails, PHP, mySQL, CGI, FrontPage. As low as $3.95/month
Cloud ecommerce platform delivers more traffic, higher conversion and unmatched performance

© Copyright 2008 Tyconia International, Inc. All Rights Reserved.