Responsive Website Design: A Dummie’s Guide

| July 22, 2012 | Reply

Google has officially recommended Responsive Web Design as their preferred method  for building mobile websites. If you have a website or a blog, it is time that you seriously consider switching to a responsive design instead of maintaining a separate mobile-friendly (or tablet-friendly) website.

One Design, Multiple Screens

If you are new to the concept of Responsive Web Design (RWD), here’s a quick guide that should answer most of the common questions that you may have around this technique. Let’s get started.

Q1 – Why should I switch my website to Responsive Design?

A1 – Your website looks great of the desktop screen but the same may not be true when your site is viewed on a smartphone, a tablet or an e-reader (like the Kindle). Once you make the design responsive, the website will look good (and readable) on all screens and not just the desktop.

Q2 – What are the other advantages of switching to RWD?

A2: With Responsive Design, you can create one design and it will automatically adapt itself based on the screen size of the mobile device. This approach offers plenty of advantages:

  • It save time and money as you don’t have to maintain separate websites for desktops and mobile phones.
  • Responsive Website Design is good for your website’s SEO (search rankings) as every page on your site will have a single URL and thus Google juice is preserved. You don’t have to worry about situations where some sites link to your mobile site while other link to your desktop site.
  • Your Google Analytics reports will paint a better picture of your site’s usage since the data from mobile and desktop users will be consolidated.
  • The same will be true for the social sharing stats (Facebook Likes, Tweets, +1′s) since the mobile and desktop versions of your web pages will no longer have different URLs.
  • Responsive Designs are easier to maintain as they  do not involve any server-side components. You just have to modify the underlying  CSS of a page to change its appearance (or layout) on a particular device.
  • The earlier design methods looked at user agent strings to determine the mobile device name and the browser that is making the request. That was less accurate and with the number of devices and mobile browsers expanding every day, that matrix is very difficult to maintain. Responsive Design doesn’t care about user agents.

Read more at Labnol.org | Responsive Web Design FAQ

Share!
  • more Responsive Website Design: A Dummies Guide

    Related posts:

    Responsive Website Design

    Related terms: Responsive Web Design Definition, Responsive Web Design Gallery, Responsive Design with Images, Responsive Design Example

    Tags: , ,

    Category: Responsive Website Design Trends

    About the Author ()

    Sara is a Kent State University alumna with a degree in public relations.

    Leave a Reply