Tap is the gesture that replaces the click, but unlike a pointer mouse that has pretty good accuracy, our fingers can often activate the wrong thing. And when things are difficult to activate, a user can give up.
Jakob Nielsen’s research on iPad usability consistently shows that “read-tap assymetry” is a major problem. (English translation: text that is large enough to read but too small to tap). When links are too close together, it’s all too easy to tap the wrong link and load (very slowly) the wrong content, or take the wrong action such as selecting the wrong size, color or payment option.
The beauty of the iPad is that it renders regular websites so well, so there’s little you need to do to design websites for the iPad. But the downside is we can think we don’t need to make design changes for usability. We should be aware that our current site designs may be problematic on tablets, and ensure our navigation menus, calls to action and configuration features are touch-screen friendly.
Website problems on tablets
Tiny menu text
Many sites use simple text menus in the left-hand column of the home and category results pages, which look clean and can fit more items above the fold. But on tablets, it can be harder to
click tap these targets.
Zappos pads its text links just enough to be tap-friendly.
Tiny link targets
Cabela’s makes great use of space around link targets in it’s promotional header.
Like what you're reading?
Subscribe to our weekly newsletter.
Join over 20,000 ecommerce leaders who have subscribed
and receive expert advice about the world of enterprise commerce.
Let’s not forget pagination — a usability nightmare under the best circumstances, small numbered links are very difficult to tap properly. Consider a large “View All” link or turn your page numbers into fatter buttons.
Be careful when stacking calls-to-action buttons. Golfballs.com could swing a bit of extra space between its More Info and Buy Now buttons on category results pages.
Whether intentional or not, Zappos does a great job styling its CTAs on product pages. They are all large buttons, spaced nicely.
Check out how tappable your links are on the iPad itself or a simulator like iPadPeek. Making very simple styling changes can really pump up your usability on touch screens.
Looking for help with mobile commerce strategy? Contact the Elastic Path consulting team to learn how our ecommerce strategy and mobile strategy services can improve your business results.