Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Frank West

Front end web developerLover of cats

@frankjwest

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Getting the most out of yourwebsite visitors

Types of forms

Trying to find something• Search• Filters

Conversations• Comments• Reviews• Chat

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

More forms

Giving you something• Add to basket• Checkout process• Sign up• Newsletters

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

In fact, there are loads!

Other• Contact• Login

Negative experience• Forgotten password• Complaints

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Understand your audience

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Left aligned

• More cognitive loading• Easier to scan

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Right aligned

• Less cognitive loading• Harder to scan

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Above the field

• Can view label and field at the same time• Much faster to complete• Long forms look even longer

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Things to think about

• Short vs long forms• The visual impact of the website design• Form complexity– Radio Buttons– Check boxes– Drop downs

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

More things to think about…

• Audience– Device being used• Field zoom

– Browsers– Experience– Helping you / Helping them?– Region

• Consistency– Which forms are most important?

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Quick and easy

• Show progress• Need certain data? Explain why.• Clear terminology– "Shop more" and "check out now" are better than

"continue"• Be friendly, not forceful• Make it easy– If just need the year, don't ask for the date

• Every field can cost a sale– What business reason is there for that data?

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Concept by Moby

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

No one likes to be called stupid

• Keep error text succinct• Highlight error fields• Keep errors within the viewport• Tell users how to fix the error• Show progress• Track errors with analytics

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

It never ends

• Keep formats the same when requesting real data

• What is the value for the user?• Optional registration• Tricking users to do things is easy– But what do you gain?

• The perceived experience– Security badges

• New form elements

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013

It is easy

Understand their needs and give them the right, personal experience.

Forms - Getting the most out of your website visitors by Frank West, 6 August 2013