Is Your Site Responsive?

2

One of the hottest web trends of 2013, is responsive web design. Most of us have heard of it, but very few of us know what it really is. Responsive web design is an approach whereby a designer creates a web page that “responds to” or resizes itself depending on the type of device it is being seen through. That could be an oversized desktop computer monitor, a laptop, a 10-inch tablet, a 7-inch tablet, or a 4-inch smartphone screen.

So, how do I know if my site is responsive? If you’re currently on a computer, drag the size of your window to something smaller – try half the screen. If the layout has changed and now looks more suited to that window size, then your website is responsive. If nothing changed, then your website isn’t responsive.

If you’re on a mobile device, does the website look like it’s been specially designed for your device? If so, then it’s responsive! If not, then it isn’t.

Whilst this article may all seem very repetitive, different websites have different ways of displaying the responsiveness. Most sites will simply change the layout, however, some websites will reduce the amount of content, to a more readable amount for a mobile device.

The wpContent website is responsive, and you’ll notice that the layout changes upon resizing the browser.

The responsive web technologies are still being tweaked and developed, however, there are a few plugins you can use to make your site responsive.

  1. Adaptivate: Make Any Site Adaptive/Responsive is a JavaScript element which makes any website responsive. This is a great starting place for responsive web design.
  2. Responsive Images Generator & Loader is a WordPress Plugin which generates smaller image files for mobile devices, meaning that the site will also load quicker.

Here’s a great example of a responsive website being displayed on different devices.

devices

Credits: What is Responsive Web Design – http://smallbiztrends.com/2013/05/what-is-responsive-web-design.html

What The Heck Is Responsive Web Design – http://johnpolacek.github.io/scrolldeck.js/decks/responsive/

Share.

About Author

Site Admin & Editor

Leave A Reply

  • http://audeemirza.com Audee

    My website is not responsive yet but I’m thinking to make it responsive :)

    Is there any particular responsive framework that you can suggest?

    My first experience was using the Bootstrap framework. I rely mostly on its grid to create the responsive layout.
    I heard it’s not easy to integrate it to WordPress CMS.

    It’s good that you write this article as not much people understand what’s a responsive website is :)

    • http://www.samberson.co.uk Sam Berson

      Thanks for commenting. I don’t know any responsive frameworks off hand which I could recommend, however, in the past Bootstrap has worked well for me. There are some tutorials on other sites about WordPress integration with that which should help you. I hope this answers your question!