Friday, March 8, 2013

Design trends: understanding responsive web design



I'm not a professional web designer, and I don't expect you to be one either, nor to be very technically aware on the subject. But if you are a serious marketer, you need to understand some basics around web design, and stay aware of trends. Digital is growing very fast, in particular for mobile and tablets, and this changes everything in the way we access content online. So it is crucial that your site reacts well on these devices - one thing that responsive websites do.

What is responsive web design?


Here is the definition from Wikipedia: "Responsive Web Design" is a web design approach aimed at crafting sites to provide an optimal viewing experience - easy reading and navigation with a minimum of resizing, panning, and scrolling - across a wide range of devices (from desktop computer monitors to mobile phones)".

In other words, when your website is responsive, it will adapt itself to the type of device used by the reader: menu elements might go from a horizontal alignment to a vertical one, images will scale themselves, etc.. It all happens in a very dynamic way without the viewer needing to scale anything or click a button to access the mobile version of the site.

5 examples of responsive websites


Below is a list of 5 responsive websites that I find particularly attractive (love the Tattly concept of temporary tattoos by the way, created by a Swiss designer). How do you check how they react? Either browse for them on your phone, or simply resize your internet browser window to a smaller size.

1. Think Traffic





2. Microsoft



3. Starbucks

Starbucks

Startbucks website

4. Tattly

Tattly website

Tattly Website

5. Illy

Illy Website

Illy Website

How do you make your website responsive?
Depending how your site it built, it might take a lot of work to make it responsive, but in any case, your web agency or developer will be your best friend there. They can modify the code of your site or use plugins to modify its behavior. The good news however is that you can purchase some website templates that are responsive, at least if your website is created with Wordpress. So this is definitely something to keep in mind if you are in the middle of a redesign, or if you are planning to create a new website.

Question: How does your site react on mobile devices?

No comments:

Post a Comment