Numerous estimates place the number of mobile-friendly web sites at less than 35%, and between 10-15% for mobile-optimized web sites. Mobile use keeps growing and growing, and is itself estimated at up to one-third of all Internet traffic. This article takes a quick look at the Opera Mobile Emulator, a handy tool for savvy web site developers to see what any given web site looks like across a wide range of devices – with different size screens.
(And we thought we had it tough back in the 1990’s)
First, you can download your free copy of the Opera Mobile Emulator. It’s fast and easy to install. When you open it, you get to select to emulate different versions of Amazon’s Kindle, and various devices from Asus, HTC, LG, Lenovo, Motorola, Nokia, Samsung, Sony and Toshiba. You also get to modify the resolution, pixel density, type of interface, windows scale, and other things that programmers use for debugging.
Here’s a screenshot of how a Motorola Photon 4G looks (right).
As an old website designer, this makes for a great tool to see how any given web site looks across a wide range of platforms. One of Opera Mobile Store’s own designers (Ryks!) made sure our blog looks good on mobile. Not every web site will be nearly so easy to read or navigate — and that includes your typical WordPress installs. In some cases, custom WordPress templates designed to present a catalog or magazine-style look-n-feel will be rendered completely differently than what you would expect. One magazine style WordPress site, for example, is rendered as an old-style, basic blog.
It’s even more important for online store owners to have (at least) a mobile-friendly site given the propensity for mobile users to buy online.
Do you need to redesign your existing web site or should you set up a second site?
The answer, as always, depends. My inclination is to believe that wherever possible you should optimize your existing site to be as mobile-friendly as you can get it. Taking the route of having two different web sites – one for PC’s and one for mobile – adds too much overhead and won’t leverage your existing SEO or backlink efforts. Every time you make an update, you’ll have to make it on both sites. Plus, other costs can creep in. So, do your best to work with what you already have.
If you have a site where know a mobile friendly version is going to be difficult, then consider offering a streamlined version that branches off from your main index. In this case you will want the link to your mobile version available in the uppermost, top left corner so mobile users will see straight away that they have a mobile friendly option.
Elements to consider:
1. Streamline your graphics.
2. Condense the amount of content on one page to roughly what you would see on a regular PC screen – without scrolling down further. Use your best judgement, some sites are so retro that you may never reach the bottom… heh…
3. Reduce the number of desired outcomes you might normally place on a page. Many people tend to <right click – open new window> for each link they want to explore further. In many cases, that is not available or not convenient for many mobile users. So, funneling becomes even more important in mobile design.
4. Experiment and don’t trust your WYSIWYG’s… These are days when everything you thought you knew has changed. With the latest stealth technology, “Picture or it didn’t happen” no longer applies — just because you can’t see it does not mean it is not there. With special effects becoming increasingly life-like, just because you did see it, doesn’t mean what you saw was real. Thus, with WYSIWYG’s (What You See IS What You Get editors) – just because you see it, have a picture of it and can prove it is there does not mean that everyone else will see it the same way as you do or see it at all.
This last point… should serve as general inspiration that regardless what time of day it is, it’s probably time for another cup of coffee and to make sure you’ve got your copy of the Opera Mobile Emulator.