Are you looking at your website the way your customers are? If you're only viewing and testing your site on computers (i.e. desktops and laptops), the answer is no—and it could spell problems for your business.
Your website's visitors will be increasingly using a variety of devices to access the internet: cell phones, MP3 players, game consoles, televisions, you name it! As I said in December:
"The way people connect to the web has changed. It's no longer good enough to assume that they will be sitting behind a laptop or at a desk browsing your site. Instead, they might be sitting in a park with a smart phone in hand. Or they might be at the gym using an iPod to connect. In short, they could be just about anywhere, and pretty soon they could be using just about anything to browse the web."
If your site doesn't play well with these devices (the industry jargon is "device agnostic"), then you have some work to do.
This is especially true in the exploding realm of mobile devices. At Inspire Consulting, we are already seeing a huge spike in the number of mobile devices that access the websites we manage. This trend will only increase as smartphones and the accompanying wireless data plans become more and more affordable.
So if every man and his dog will be surfing the web via their mobile phone, what can you do to get your site working well for them?
Analyze Your Audience
The first thing you should do is look at your website's usage data and determine if this is something you want address immediately. While I recommend you get your website mobile friendly (and ideally totally device agnostic) as soon as possible, if none of your visitors are using mobile devices you might have better uses for limited resources.
While it will depend on your business, 5% is a good threshold. Anything below that probably means you can wait a little while longer if you need to. If more than 5% of your users are on mobile devices, however, you should make it a high priority to ensure mobile compatibility.
The next thing to consider here is what devices your visitors are using. The most common ones we see are Blackberries and iPhones, although Android is on the rise and neither Palm nor Windows Mobile are uncommon.
Whatever devices and mobile operating systems appear the most commonly are the ones you'll be want to sure to test your site on.
You Don't Need a Separate Website
The good news is that you shouldn't need a separate website to accommodate mobile users.
In fact, I'd actually recommend against a separate site even if your budget is unlimited. The reason is that they invariably end up getting neglected, and the duplication of content is just pointless.
What you should do instead is have your website detect the type of device being used and then adjust the way the site is displayed accordingly.
If your site is well built (i.e. if it is built using modern, best-practice, standards-based HTML and CSS), it is very easy to change the way it is displayed. You'll simply need your developers to create an alternate style sheet to display the site in a mobile friendly way. Doing this will become even easier once CSS3 garners more browser support.
It might sound a little technical, but it's pretty straightforward for your developers to do. You're basically going to be telling your website to use one set of design rules for PCs and another set of rules for mobile devices.
Design Considerations
A good website design for PCs is not the same as a good design for mobile devices. Here are some factors you'll want to consider when making your website mobile friendly:
Prioritize Your Content
The content you choose to display to mobile users may be a little different to what you display to PCs. You'll want to get rid of any large banner images or Flash animations. You may leave out some sections of your standard page, and you may also display some other sections solely to mobile users.
Single Column Design
Just as horizontal scrolling is a pain on a PC, having to zoom and pan around a website is a major hassle on a mobile device. Even on the iPhone, which has by far the best implementation of this type of functionality, it gets really old really fast. To improve the user experience on your website, you'll want to make your site one long column. That way the user just has to worry about scrolling up and down, not side to side too.
Fonts and Font Sizes
As a general rule, you'll want to increase the size of the font. This may sound counter-intuitive since you have much smaller screens, but as mentioned above, zooming is a pain. Sure, you may only get 5-10 words per line, but your users would much rather scroll down than squint or zoom.
No Roll-Over Effects or Drop Downs
Do away with fancy roll-over effects and drop down menus on mobile devices. On a PC, these can work perfectly, but there's no mouse pointer on a mobile device. If your users have to "hover" over an element to get the site to work, they won't be able to do it from a mobile device.
Flash: Forget About It!
Remove any Flash from the mobile design. While some mobile operating systems can display Flash, the two most important ones do not. The iPhone has zero support for Flash, and the increasingly popular Android's support for Flash is, well... pretty crap. The web is increasingly about content, not fancy gizmos and golly-gee-whiz graphics. This is especially true of the web on mobile devices, so just lose the Flash.
Hop To It!
The mobile web is currently roughly where the regular web was in about 1997. In other words, it's about to explode! Within the next 2-3 years we'll see a giant increase in the number of people using mobile devices to access the internet.
You can prepare for this onslaught and get your site ready to embrace these mobile users, or you can be left in the dust. The choice is yours.
Comments, questions, agreement, disagreement? Sound off below!
Posted on
Sunday, May 31, 2009 10:42 AM