What do the best mobile websites avoid?
Going mobile (or GoMo, for short) for your website might seem a huge task as you try to reconcile squeezing all your content onto a screen no bigger than your hand.
It doesn’t need to be, breaking the project down into blocks of tasks is where to start and it’s a good idea to have a set of rules, a framework, that everything fits into. Different devices typically support different types of content and with the browser market moving to one third desk/laptop, one third mobile and one third tablet you need to consider the needs of all devices. During the planning phase you will need to consider your existing (or planned) content and where possible AVOID the following;
- Anything rendered in Flash. Put simply, it won’t work on any Apple device. Due to the high battery power demands of Flash, fewer and fewer folks are running it on mobile or tablet device.
- Non-standard web code. HTML5 and CSS3 is best practices so that is what you should use, no exceptions.
- “Clever” mobile rendering solutions. These solutions (such as Dudamobile), whilst they might suit a small budget and low expectations they are not really practical long-term solutions if you’re serious about mobile. They do, however, tick the box.
- Elements that require a mouse. A surprising number of website elements such as navigation, expanders and the like require a mouse to operate them. Mobile devices don’t have a mouse equivalent.
- Complex and busy navigation. Mobile and tablet is about fat thumbs and jabbing at the screen when holding an unstable phone or tablet. Make it simple (harder than you think) and leave lots of white space around actions, fields and links.
- Skeuomorphic representation. Whilst Apple might have driven us down the “looks like real-life” rendering of buttons, sliders and the like, these days are over. All the other players (Android, Microsoft and Mozilla) moved to “flat UIs” a while back and Apple has done the same with the next release of it’s operating system (iOS7).
- Pop-overs, modal windows and Javascript layers. They may work fine on a desktop but take too much room on a mobile device, force new windows to open or simply break.
- Fat pages. Mobile speeds are better than they once were and 4G promises much faster delivery but not everyone gets decent download speed. The other challenge with mobile is called “the round trip”; this is much slower on a mobile device than on a hardline so sites that need to load 100 elements will take, regardless of logical size, a long time.
- Lots and lots of short pages. Loading a new page takes time (and a click action) and most mobile users prefer simply to scroll down to see content. This is a good time to consider if you can get your entire, first-touch, journey onto a single page.
- “We have an ace App, please download it”. If you have an app then don’t try to force every visitor to download it. They won’t and they will hate you for it. Google suggests a prominent advert or a smaller link on the home page.
- Interstitial pages. They used to be called intro pages but if you put a page in between the users’ click and your content they will hit and leave your site.
- Big hero banners. Sites frequently have 500 pixel high images at the top of the site. They will usually block out all the content and the so-called hero images become a conversion block. The same applies to overly tall logos and header areas. If you must plonk stuff there then why not put some information and links above them to allow the visitor to directly access content.
- Images rather than content. A telephone or email address rendered as a lovely graphic might look pretty but won’t work. A plain text telephone number becomes an action on a mobile site as clicking on it will initiate a phone call – pretty useful on a mobile phone, I’d say!
Some agencies and designers feel this restricts them in terms of how creative and brand-like they can get. They’d be true, but users care not a jot about brand, design and cleverness; they want 1. simple to use, 2. fast to operate and 3. easy to navigate digital experiences.
Listen to your users and not to your agency; often the agencies were the last ones to climb aboard the mobile bandwagon anyway so why listen to them now?