Mobile Website Design Mini-Course Volume IV: Design Principles Unique to Mobile

So what makes mobile website design really different from tabletop website design? There are two sides to the answer: the technical side and the usability side.

Technically
Technically, the mobile designer has to deal with three basic issues: screen sizes, touchscreen issues, and mobile connections.

Screen sizes are the least standardized thing about mobile devices. According to research by StatCounter, as of the beginning of the year, 20% of all mobile screens were 320×480 (hint: that’s an iPod Touch) — but 40% of all mobile device screens didn’t fit into the survey’s 14 categories of standard resolution sizes. In short, even a responsively designed mobile site isn’t going to be able to completely customize itself to every screen out there without a stupidly complex coding effort.

Touchscreen issues are actually the least of the issues — as long as you stick to simple buttons and don’t make the user hover, click-and-drag, or mousewheel to accomplish their goals, you should be good.

Mobile connection issues, however, are brazenly annoying. Mobile users need everything to be quick and low-bandwidth, but at the same time they’re always looking for more information and they just love to look at videos. Figure that one out, and you can be a millionaire.

(There is the issue of SEO, too, but you can check the in this series for a discussion of how organic SEO interacts with mobile design considerations.)

Usability
Part of their desire for video, we believe, isn’t so much pro-video as it is anti-text. Mobile devices can be pretty darn small, and even text that looks ample in testing can come out poorly from time to time. Designing a website that has minimal text and focuses on big buttons that make it very clear to the user how to do what they want to do despite the fact that they have a baby over their shoulder is a huge part of the usability side.

That unfortunately means intuiting what a user will want to do with your page and designing for those needs up front. And there will always be users who want to do something different as well, so creating a second page with more “here’s where to do X task” links and making it prominent on the first page may be wise as well.