The second element of your mobile strategy is your website. Sure, your site might look great on a desktop or laptop computer screen. But how does it look on a tablet or a smart phone? Chances are the answer is “not good.” That’s why all companies need to re-think thier "mobile stratey" and design their websites for mobile first and make their website adaptive.
To get a better idea of why a traditionally designed website doesn’t work for mobile devices try this little experiment: Using a laptop or desktop, go to your company’s website. Depending on the size of your screen, the website will either fill the entire screen or there will be a border on the right and left side.
Using your mouse arrow, grab the bottom right corner of the browser window for your website (exit full screen mode first). Drag it from the right to the left diagonally up and start making the window smaller. If your website is not adaptive, you’ll see that all you’re really doing is covering things up. And as soon as the window gets smaller than the pre-defined width of the site, you’ll see scrollbars appear on the right and bottom. Now the only way to move around on the page is to scroll.
Keep making the window smaller until it’s about the size of a smart phone screen. How does it look? You’ll see that it doesn’t look good at all. As a matter of fact, it’s probably not useful either.
If your website was adaptive, as you move that window and make it smaller, the text would automatically reformat and the pictures would move accordingly to fit the smaller screen size. The menu would also adapt and change so your website and content would work on any device.
That last point is important, because not all smart phones have the same size screen. An Android screen is different from an iPhone screen, which is different from a Blackberry screen. Even tablets have different size screens. So if you don’t have an adaptive site, the person viewing your site on their tablet or smart phone will end up having to scroll somehow, somewhere, because of the wide variety of screen sizes.
To see a real example of how an adaptive site would look, go to one of my websites www.visionaryapps.com and give it a try. View it on your laptop, your tablet, and your smart phone. Shrink the screen as described earlier and notice how the site changes to fit any size screen. This site has a very simple design, but it is a good example of an adaptable site. The good news is that any website developer can do this once they understand the concept.
To address the mobile revolution, many companies have created a second mobile version of their website so their content can be viewed on smart phones without a problem. But there are big problems.
First, you have to design, maintain, and pay for two separate websites. When you update one, the other is not automatically updated. Additionally, the mobile site is designed for a specific mobile screen size. If your user does not have that phone model, they will still have to scroll around to see it.
So the message is clear: The time to create an adaptive site is now. That means you have two choices. You can go back to whoever designed your current site and have them take your current look and make it adaptive, or you can start over and design a new website.