You may have noticed that my website has changed recently! I have been meaning to make my site ‘mobile friendly’ for quite a while but the plugin I was using (WP Touch) has given me problems. Sometimes it works and other times it completely messes the whole site up!

I don’t think there is a problem with the plugin itself but rather one of my existing plugins is perhaps not compatible with it. Since all the plugins I use are essential I knew the answer was to do something that didn’t include using WP touch!

Then I received an email from a subscriber that prompted me to look at getting my website responsive instead.

What Is A Responsive Website?

You might be wondering what the difference is between mobile friendly and responsive. Well, a mobile friendly website is one that when viewed using a mobile device looks different from the same site viewed when using a desktop computer. You create a mobile friendly version of your site – so you would change the font size, remove the sidebars, change the navigation tabs – things that will make it easier to use when using a small touch screen.

A responsive website means that the view you obtain will change depending on the size of your browser window. Therefore whatever device you use a responsive site will change so that the view fits into the available space of the screen. For example, here are some screen shots of my site using a full size browser window and a smaller window. Notice that when the window is smaller the layout automatically changes.

In other words the website responds to the size of the window it is being viewed in.

Online Tools For Viewing Your Site on Different Devices

If you want to see how your site looks on a variety of devices or browsers then there are some sites that you can use:

https://browsershots.org – gives you screen shots of your site in different browsers. This is a screen shot of just some of the results for my site!

https://mobiletest.me – you can choose which device you want to see your website in. This is what my site looks like using a Google Nexus 7:

Therefore by using a responsive theme you cover all options. However, I wanted to see what Google thought about it seeing as one of the factors they use in their algorithm has something to do with your sites user ‘friendliness’. I went to my Google Webmasters account to see how my site was doing and all the help pointed towards getting a responsive design.

Google has set up a page about website design for today – https://developers.google.com/web/fundamentals/layouts/

“Much of the web isn’t optimized for those multi-device experiences. Learn the fundamentals to get your site working on mobile, desktop or anything else with a screen.”

There is then information about responsive web designs and creating a fluid experience. So that is when I decided to get a responsive theme. There are loads of these themes, some of them free, others very expensive.

Responsive Website Theme

In the end I came across X-theme and liked what I saw. I particularly liked the forum and the huge amount of help they offered for tweaking designs. It is one of the most popular themes, used by over 184k people and cost me just $29. It’s easy to set up and now my site is getting a Google Webmaster ‘mobile user friendly’ score of 92%. Well worth it! 🙂