One solution to Google’s Mobile-Friendly Ranking Algorithm is a responsive theme. In this post we will explore: What is a responsive theme? How can you get a responsive theme? How can you get it to look more like the site that you want?
What is a Responsive Theme?
WordPress themes are how you get basic format and styling for your blog or website. A responsive theme is one that will look good on mobile, tablet and desktop. On a site with a responsive theme, if you move your browser to a narrower width, you can see the format change so it fits on tablet or mobile (and other browser widths as well). As shown in the image at top, this Websites for Small Biz blog has a responsive theme. Try this now – take any website, re-size the browser slowly so you can see the changes as the size of the screen gets smaller – does the site move properly as you narrow the browser or does it stay fixed? If it looks good as you narrow the browser, that’s what’s called responsive design.
How can you get a Responsive Theme?
This leads to a basic question: how to pick a theme? Which one should you pick? Easiest, safest and cheapest method is pick any of the WordPress default themes. All WordPress default themes since Twenty Eleven are responsive. If you go to Administration Screen > Appearance > Themes (in your WordPress backend), you should find all default themes since Twenty Twelve.
You can also go to the WordPress Theme Directory and find themes labelled responsive. However, and this is a huge however, how do you know the theme is a good quality theme? Not easy for a non-expert to tell. User beware. Years ago someone I know used a free theme that looked great. Then one day her site got hacked. Why? Her beautiful free theme had security holes. Best bet is to choose a theme and check with other sources if it is reputable.
Then there are premium themes. In theory, this may sound good. You pay for the theme, support and updates. However, even if a company has a good reputation, you may be purchasing code bloat. Your theme may make your site slower than it need be, and it may be hard to make modifications. So, once again, proceed with caution! In general, I’ve heard great recommendations for sites built with the Genesis framework.
For my own clients, I built custom themes. Lately, almost all have been with the Underscores theme as a basis. This means all the code is lean and for a purpose. And if you think this costly, think again. Depending on your budget, I may be able to meet your needs.
Finally, there is an interested website called There is a Theme for That. No guarantees, but it’s a good place for searching.
Why Switch to a Responsive Theme?
Some of you may desire to keep your old themes and use some solution to keep those running. I would suggest now is a good time to update, because your old theme has old code of which you may not be aware. Using up-to-date code will give you more options for your website. Also, the newer WordPress theme code is cleaner and more succinct. You don’t want a theme that does everything; you want what you need, and that is all.
Let’s say you have an old theme with out-dated code. It is possible to take a basic theme and tweak it so it looks more like the one that you have now. There are several approaches to this. When I work for a client, I generally pick a framework such as Underscores and build the site on top of that. That would give one a custom theme with up-to-date code. Another approach would be a theme based on the Genesis framework. Using current theme code one can rebuild a site so it looks like the older site. To get each page or post to work, one uses what are called: media queries. A media query is code that tells the browser to display the elements of the page with different style rules for different media types/devices. So, for example, if you on a mobile device, you might not display a certain element at all. On a tablet, you might make the width narrower. There are infinite options – but the more you want to tweak, the more time it may take.
What if I want a specific design?
If you have a basic look that you like, it is quite possible to make this look on a website. The best method is to build a site for what you need, and add media queries (see definition above) to get it look good on various devices and browser widths.
This post was inspired by a post that Sherryl Perry wrote about the new Google Mobile-Friendly Ranking Signal update.