One of the biggest mistakes I have seen people make when working with a website design firm is the mobile readiness of a site. The advancement of the mobile phone has steadily increased mobile searches to record high numbers and each new model of phone produced increases the number of people and searches. People demand instant and local searches from the internet and websites have to be able to present their visitors the requested information within a timely and visually appealing manner or they will simply choose another website.
Unfortunately, I have heard stories from my own clients about how the last design firm they worked with charged them extra for a “mobile friendly” version of their site or told them that the mobile version of their site was automatic and couldn’t be changed. People are confused about what is mobile friendly and what is mobile responsive. Why don’t we take a look and see if we can clear up some of the mystery and maybe save you alot of money.
A Mobile Friendly Website Design
The easiest way to describe a mobile friendly website, is to say that what you see on your desktop monitor is simply shrunk down to fit onto a smaller screen. That is to say that your website is designed to work and look exactly the same way across all devices. Nothing about the look or layout of your website changes, they are just simply smaller. This means your visitors have to use the 2 finger pinch on touch screens in order to expand your website to a readable size. But when a visitor does this, it caused portions of your website to be off the screen so now they also have to move your website around in order to read it all. The picture to the right is an example of our own website on a mobile phone in a mobile friendly format.
A Mobile Responsive Website Design
A mobile responsive website is one that physically changes its form in order to maximize content based on the size of the device that is viewing it. This means that your website will actually check to see what kind of device is requesting it, redesign itself by removing complex elements, move content around and change the layout of the design in order to best fit the specific size of that device. In the example to the right, this is our own website again but this time we have returned it to a responsive mode. As you can see, the menu items have been reduced to a dropdown, the slider has been removed and the text content has been enlarged and arranged in a manner that will allow the user to read it comfortably without zooming in.
Here is a little trick you can use to test the mobile effectiveness of your own website. Open your website in your favorite browser and simply reduce the size of your browser window from full screen to very small. If your website simply shrinks with the screen and does not modify its own layout, then your website is not mobile responsive. If however, your website changes the appearance of the menu, text and images as the screen gets smaller, then your website is ready for the mobile generation.