Four Tips For Mobile Website Design

Posted On: 2012-07-06

You would have to live in a cave with absolutely no Internet access not to know that more and more people are surfing the web on mobile devices and the mobile web is not just a passing fad.

Yes I know that I've talked about the need to get into mobile web design several times before but this is serious ... if you're not designing for mobile then you're like a few mainstream designers I know who are just hoping it will all go away ... but it won't go away ... it's here to stay.

People of all ages are walking away from their PCs and laptops and using their mobile phones or tablets to access the Web from wherever they might be. We're not just talking about people who are comfortable with hi-tech things here ... we're talking about ordinary people everywhere.

The middle-aged barista at our favorite coffee shop ... a really non-tech grandmother that Steve knew when they were kids in high school ... a local cab driver ... a guy who runs a fishing website and another who runs a tire shop and gets his hands dirty working in the tire bays himself. Just ordinary people and they're embracing the mobile web far faster than they embraced early computer technology.

So what are you doing about it? What are you doing to reach out to these people in an effort to sell something to them?

Well hopefully you've already started building mobile websites to market the products you're selling ... or at the very least you're experimenting with mobile website design. If you haven't started then for goodness sake make a start ... the world is moving on and you're being left behind!

So let's look at four simple tips for mobile website design just to get you started ... there are a whole lot more than just four things you need to know about mobile website design but these four are a good starting point.

Simplicity
While you're going to be designing your mobile sites on the big screen of your PC or laptop the people who are looking at what you produce are going to be viewing it on a much smaller screen so keep everything simple.

Don't go crazy with intricate navigation that uses lots of drop-down menus ... in fact try and avoid building mobile sites that have lots of pages ... keep your navigation very basic and keep it big too. Fingers aren't the most precise tools to use to click a link but that's all you've got when you're surfing the web on a mobile device.

File size
Big images ... big graphics ... sweet looking background images ... stuff that has big file sizes ... forget them!

As far as most users are concerned there's no difference between mobile devices and PCs when it comes to download times. Users still expect websites to load just as fast on a mobile device as sites do on a PC. They don't realise that mobile devices are going to take more time to download stuff simply because their connections aren't as fast as the ADSL connection they have at home ... and they won't cut you any slack if the site takes time to appear.

So you've got to compensate for the slow connections. You have to ditch pretty design elements that are going to slow the download time and you've got to cut the file size of every image you use right down to the bare minimums. Never take an image that you've used on a non-mobile site and simply use HTML to resize it.

Design for all devices
One of the biggest problems I believe that's facing the mobile app market is that some designers focus on just one operating system. They'll design their apps for Apple and ignore Android or they'll design for Android and ignore Apple and to me that's just crazy. It's not rocket science to design an app that both operating systems can cope with so why not do it?

When you're designing your mobile websites don't fall into the same trap that those app designers seem oblivious to. Make sure that you use basic HTML and CSS ... avoid Flash ... and if you want to get some fancy effects happening use HTML5 to achieve the outcomes you want.

Why build a killer mobile website if a large proportion of mobile users can't see it?