A Look at Responsive Web Design.
So first of all you might ask what is it? Then you might ask, why do we need responsive web design?
What is Responsive Web Design?
The most simplistic answer to the first question is that responsive web design is a method of design which allows a web page to visually adapt and respond to various screen widths. Main sections of a web page will resize and reposition in response to changes in the size of a given device’s screen width used to access the page. In a responsively designed web site both textual and graphic elements will adjust based on a given design and the size of the viewport used to access the site.
In contrast to responsive design, most web sites up until recently were designed with specific static screen widths in mind, usually the desktop monitor. Which brings us to the why should we care whether or not a site is designed using more of a responsive design pattern.
To answer the second question. Let’s take a quick look at how users access the internet.
Why we need Responsive Web Design
For many years there had been a trend for internet users to access the web using ever larger monitors. In some cases that trend has continued as we see a plethora of high definition wide screen monitors in use with many of today’s desktop computer systems. At the same time it will come as no surprise to most people that for the past several years there has been a parallel trend of large numbers of people accessing the internet on a wide variety of small and mid-sized devices.
So, in answer to the need for more mobile friendly web sites, many web site owners had separate web sites, or portions of their web sites dedicated specifically for mobile web users. So while it appeared that we had the obvious solution to provide the best user experience for mobile users of our sites, enter the ever more popular tablet devices which feature mid-sized screens. So now, with ever increasing web-ready devices of so many different screen sizes, with often variable orientation, it is now more difficult than ever to predict how our web sites might be viewed.
Responsive Web Design the solution
It must be stated that in some cases having a separate mobile specific web site is the appropriate solution. That being said however, for many web site owners a web site designed responsively is the perfect solution. A web site designed responsively allows a site owner to provide a good user experience for most if not all visitors to their site, while not requiring the investment of developing and maintaining distinct web sites for mobile and desktop users.
While Responsive Web Design is quickly becoming a de-facto standard for newer and redesigned sites on the web, a web site must be explicitly designed as a responsive web site to function properly.
For more information about Responsive Web Design, a good read is an article that was written by Ethan Marcotte, who first coined the phrase in his now seminal article ‘Responsive Web Design‘. This linked article was published on his blog on A List Apart, on May 25th, 2010.