For the past few years, it’s been common for websites to have a “normal” version of their site and a separate “mobile” version. This works fairly well, but is beginning to have some issues as time goes on.
- What do you consider to be a “mobile” device these days? Your phone, of course. How about a 10″ tablet? A 7″ tablet? Maybe a 10″ netbook? The problem is that many of those devices should see the full version of the site, but are forced to view a special mobile version instead.
- Google and Bing have both come and said definitively that mobile responsive sites are a better solution to help your site rank well in the search engines.
So what exactly is a “responsive” site?
In short, a responsive site automatically adjusts and moves content around to help fit any kind of screen that it’s being displayed on, from desktop to tablet to phone. This video helps explain it a bit more:
Another good resource for learning about responsive design comes to use from ReadWriteWeb, which has a great article about the process that the Boston Globe went through to make their site responsive.
How can I make my site responsive?
Unlike installing plug-ins that give you website a separate mobile version, responsive themes need to be designed that way from the ground up. While it’s technically possible to convert an existing theme to become mobile responsive, you’re usually better off selecting a new design and rebuilding your site with it. The “twentyeleven” theme that comes built-in to WordPress is responsive, as are dozens of themes at StudioPress or Elegant Themes, or you can search for others such as the aptly-named “Responsive Theme“.
To see a good example of a mobile responsive site, you’ve found one! Try dragging the edge of your browser as I demonstrated in the video above and you’ll see the content shift around automatically to keep things suitable for reading. You can also check out my personal blog as another example.
Is your site mobile responsive yet? If not, are you planning to move to a responsive theme soon?