This post was written 8 years ago and therefore may not be as accurate as more recent posts.

Update – Peadig is a mobile responsive design framework making mobile design more effecient.

Millions of mobile phone users browse the web from their devices every day. Estimates are that somewhere between 8% and 10% of all Internet traffic comes from mobile devices these days. Mobile devices are simply extremely handy tools that, thanks to the steady march of technology, are far more than just phones that fit in your pocket and can use SMS to text message other people with similar devices. Today’s top-of-the-line mobile devices are practically fully-functional computers that fit into the palm of your hand.

People use them to upload, download, share, chat, email, take pictures, take video, and even create documents and send them to coworkers on the fly, not to mention browsing the Internet. Oh, my goodness do they ever browse the Internet! Mobile devices have become the new phone books; if you’re out and you realize you need something unusual, you don’t turn to the phone book anymore, you bust out your iPhone and look it up online.

And that, at the heart of it, is why mobile web design is such a vital field. If you’re not capturing those people who are in their cars looking for your business right now, one of your competitors is, and they’re enjoying all of the walk-in traffic that those mobile website hits bring.

There are 3 basic elements that separate a mobile website from a typical one.

The Screen
A mobile screen can be pretty surprisingly small, even if the resolution looks like it belongs on a desktop monitor (like the iOS line’s new retina displays), the actual size of the buttons you put up on your page will be impossibly tiny if you make them a typical 100×300. So a simple layout with plentifully-sized buttons is a necessity in the mobile web world. Responsive design techniques that can help your website automatically adjust to various screen sizes are readily available from most competent mobile designers.

Slower Networks
Most mobile devices are still running on the older 2.5G and 3G networks, and many mobile plans charge for bandwidth use beyond a certain amount. By setting up your website so that it loads with a minimum of elements and avoiding unnecessary audio, video, and other streaming, you improve usability (with faster-loading sites) and don’t strain your user’s bandwidth limitations. By using those limited elements to point your users directly at the most useful and valuable elements of your site, you keep traffic moving where you want it, and where it will most readily convert.

Touch Screens
The last key you have to look out for when you design for mobile websites is to design for a touch screen. Like the all in one computers and tablets that are their larger counterparts, almost every mobile device that browses the web does it using some form of touch-screen interface. Not only do your buttons have to be big enough to be easily touched, but you may also want to include touch-specific functionality like swiping and long-taps. Adobe Creative Suite, the layout tool of choice for most mobile web designers, interfaces flawlessly with Adobe Touch to provide this kind of support for mobile sites.

Categories: Web Design

Paul Delaney

Posted by

Paul is the owner of Paul Delaney Design, With a technical background in web design and development Paul has worked with online technology for many years and more specifically in SEO since 2006 both client and agency side. Paul is an industry speaker at the Search & Social Media Marketing course at the University of Salford.

Leave a Reply