This is the second in a three-part series introducing people to Responsive Web Design. Read Part 1 here
Why Haven't Websites Always Been Responsive?
Many times, a client has a site that's 3-5 years old, and they don't understand why their site wasn't built to be responsive in the first place. After all, they made a significant investment, and they (understandably) think the site should work on everything.
Frankly, the answer to this question is simple: older websites didn't have to be responsive, so the technique didn't exist. When the only internet-capable devices were desktops or laptops, web designers and developers could reasonably expect the visitors to be viewing the site on a device that was at least 800 or so pixels (px) wide. Because of this, there was no reason to consider what the site would look like - or more importantly, how it would function - when rendered on a device as narrow as 300 px.
Mobile and Tablet Devices Changed Everything
As internet traffic from users on devices other than laptops or desktops continued to grow, it quickly became apparent that a solution was needed to ensure those users were getting an equally enjoyable (and useful) internet experience, even at small sizes.
One solution was to have the website's server detect what type of device the visitor was using to view the site. If they were on a desktop or laptop, they would then see one version of the site. If they were on a smartphone, they'd get a mobile-only version. This technique is known as Adaptive Web Delivery (AWD).
This was a good solution (one one still used today by some very large companies), but one that ultimately posed a problem for most. First, this solution is more expensive, as there are literally two (or more) independent versions of the same website. That means more design, development, and maintenance. Need to update the site? You need to update each version separately. Want to change the homepage graphics? You're going to be doing that more than once.
A Better Solution Was Needed
This is where RWD comes in.
The term Responsive Web Design wasn't coined until a May 2010 article by Ethan Marcotte in A List Apart, who also described the theory and practice of RWD in his 2011 book, Responsive Web Design. Since then, its become one of the most singularly important web design trends: .net magazine listed RWD as #2 in the Top Design Trends for 2012, and Mashable hailed 2013 as the Year of Responsive Web Design. Forbes magazine published a piece, Why You Need To Prioritize Responsive Design Right Now, which argued that having a mobile version (AWD) of your website isn’t enough anymore.
Since then, countless designers and web developers have taken advantage of its flexible frameworks and size adjusting methods as a cost-effective technique for mobile web development. As opposed to Adaptive Web Development, there is no need for a separate mobile site. Updates are made to one site, which then automatically adjusts itself through a flexible framework to render on small screens.
We'll explore the benefits and advantages more in The Responsive Web, Part 3.
