Designing for the Mobile User
Twentyfourten read recently that 2012 is expected to be the first year where mobile users will exceed traditional desktop users. There are more Internet-capable (smart) phones than desktop computers in the U.S, UK, Germany, France and Japan.
True, the number of smart phones capable of web browsing doesn’t necessarily mean you will record more mobile devices hitting your site than desktop PCs, but it’s still a significant pointer towards web viewing habits.
Twentyfourten have always delivered websites aimed at the desktop user. Each build always has a cross-browser check (IE6-9, Firefox, Chrome, Safari etc) and cross-platform check (Windows/Mac) checking for styling issues across browsers is a massively time-consuming part of the job. It’s especially annoying (as of course), it’s the browsers that all choose to interpret the HTML code differently to one another not the web developer who has written ‘bad’ code, Twentyfourten have to write ‘work-around’ code that targets those specific browsers having problems, and it can take a long time to get a consistent look across all browsers.
“As the shift to mobile continues, handheld device support will become increasingly important”
So, at what point in the future does a website build include mobile considerations? It’s a good question. And what even defines ‘Mobile’? Should it be concentrating on designing for iPhones only as they are the most popular in market share, or should it cover Android mobiles too? Should tablets come into it as well?
There are many ways you can code a site to appear differently for different devices, some are reasonably quickly implemented, more direct and are ‘tweaks’, whilst others require a lot of thought and a complete website overhaul. This more thorough approach would require creating a single fluid design, that scales down perfectly from a high resolution monitor, to a small resolution mobile device, and covers everything in between. This is known as “Responsive web design” and is probably the best solution, but also the most expensive in terms of time to produce.
Content slim down
How mobile devices display your website is one thing, but you should also consider how appropriate your website content is for mobile users:
- Should content be tailored to device?
- Is the Mobile user wanting the same thing from your website that a desktop user does?
There are already many websites that serve out a different version of the website to mobile visitors. There is a school of thought that says — yes, your Mobile users are different to your Desktop users, and they might require a different type of more simplified navigation, less graphics and certain content might not be appropriate to offer to them at all.
How we can help
Twentyfourten plan to create a mobile specific version of our website soon. We can then discuss and demo solutions at that time.
For now, we have one of those more simple ‘tweak’ options mentioned earlier that we can offer, aimed specifically at the iPhone.
You might have noticed that the iPhone has a really annoying way of deciding that certain text areas should be bumped up in size to appear more important than other sections of text, meaning that as a consequence pixel perfect beautiful layouts can get easily broken, leaving alignments ruined by the iPhone over-blowing text size way beyond the intended look and feel.
If you look at the Twentyfourten website on an iPhone you’ll see that this isn’t happening. We are using some device recognition code to single out the iPhone and ask it nicely to stop messing with the text in the way described. It leaves the affected text still zoomable with a double-tap and now looks exactly as you’ve come to expect your layout to look on a desktop view.
This solution is a couple of hours work to implement (depending on scale of issue), if any clients are interested in enabling this styling to their website — just get in touch.
Update — 23rd May 2012
U.S. President Barack Obama has ordered all major government agencies to make key services available on mobile phones within a year, in an effort to embrace a growing trend toward Web surfing on mobile devices.
“Many government services are not optimized for smartphones or tablets, and other services aren’t available at all on those devices”, Obama wrote.
A heads up there for UK public sector to expect similar directives before too long?