Reducing Checkout Friction on Mobile Devices

Came across this really interesting article by Baymard Institute with examples of mobile sites where form fields (think checkout pages) weren’t configured properly with keyboard ‘type’.  Do your site checkout pages make any of these mistakes (see notes below screenshots)?

auto-correct
At HP.com, ‘str’ is auto-(in)corrected to ‘ate’ because they haven’t disabled auto-correction.  Lesson— Disable autocorrect for address form fields.  Better still disable autocorrect for all checkout form fields.

At Cabela's, the e-mail keyboard isn't invoked despite customized the placeholder text.At Cabela’s, the e-mail keyboard isn’t invoked despite customized the placeholder text.
At Amazon, the credit card field doesn't invoke a numeric keyboard, increasing the likelihood of typing errors.
At Amazon, the credit card field doesn’t invoke a numeric keyboard, increasing the likelihood of typing errors.
At Amazon, the phone keyboard isn't invoked, presenting a bunch of alphanumeric characters instead.
At Amazon, the phone keyboard isn’t invoked, presenting a bunch of alphanumeric characters instead.

2 thoughts on “Reducing Checkout Friction on Mobile Devices

  1. These small tweaks absolutely make a difference based on my past testing experience (especially invoking a numeric keyboard on phone and zip code fields). I didn’t know you could disable the auto-correct feature. I’ll have to try that one – thanks again for the great articles Rishi!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s