More than 10 million Americans tuned in to PBS for the fifth season premiere of Downton Abbey, the hit series about an aristocratic English family in the early 20th century. Unfortunately for PBS, the show’s mobile website design is about as technologically advanced as its characters.
We came to this conclusion when we used a smart phone to access www.pbs.org in search of a recap of the show’s second season. It took us almost 4 minutes, with plenty of frustrations: tiny, unreadable text; incorrect clicks; cluttered pages and long load times throughout. Most mobile users would not put up with this for more than a few seconds.
Effective mobile website design needs to be finger-friendly.
If you think mobile is something to worry about later, think again. The mobile future arrived a year ago. January 2014 was the first month in history when Internet traffic from mobile devices exceeded traffic from personal computers. It’s a near guarantee that some of us are accessing your website via smart phone.
Our plodding thumbs and pointers just can’t match the precision of a mouse cursor, so mobile sites need to account for that with easy navigation and thoughtful design. If you’re not sure whether your mobile site is finger-friendly, here are some best practices to follow:
- DO increase font size and line height so that the text is readable on a small screen.
- DO ensure buttons are large and enough space is left between touch targets. Apple recommends a minimum of 44×44 pixels for buttons on the iPhone.
- DO enable contextual keyboards. Since mobile keyboards are dynamic, make sure to program the form fields for specific input content. For example, if the input field requires an email address, the keyboard should feature an “@” symbol, underscores and hyphens. If the user has to enter a phone number or zip code, provide a numeric keypad.
- DON’T crowd your page. Clean, simple design translates best to mobile. Put text in easy-to-read fonts and display it in black on a white background. This will not only please users’ eyes and thumbs, but also save them time with faster page loading.
Need help with design for your business website, publication or marketing collateral? Email Kim Landry or call 484.829.0021.