Responsive Design: What’s the Deal?
Over the last few years the web development community has been full of buzz over “Responsive Website Design“. Over the last few years, roughly 2010 – today, you may have noticed a change in the style of many sites on the web toward “mobile friendly” designs. Over the next few paragraphs I will try to explain why this style has become so popular and also the issues that have held up the advancement of Responsive Web Design and other web technologies.
Early in the history of the web (1990 – 2000) nearly every site was designed and developed by the same people. These were usually engineers and programmers who moved into web development from another segment of the IT landscape. When an engineer “designs” a site they are mostly concerned with functionality. This tendency meant that during the early era of the internet websites were built using tables or other highly structured layout schemes similar to the spreadsheets that were familiar to them. During this era the job of Web Designer didn’t even exist; except, perhaps, in the largest and most technically savvy companies.
Slowly, web design become a much more practiced and accepted field of web development. The difference in the overall ascetics and user experience began to be enhanced greatly with the eye of the designer. It didn’t take long however before it became clear that what looked good in Photoshop couldn’t always be done on a real site. Often this meant that developers needed to use clumsy tricks in order to display the new beautifully designed sites while maintaining expected functionality. During this period (roughly 2000 – 2004) a developer would often cut apart an image into multiple images and stick them all together to give the illusion of a single image. It was becoming apparent that new techniques were needed in order to develop beautiful sites that were also well constructed. As developers and designers began working more closely new ideas and techniques began to start popping up. It was during this period that WordPress and many, many other frameworks and attempts at standardizing web development techniques began appearing.
Fast forward a few years to the era of the smart phone (iPhone release, 2007) and now we really begin to see the need to standardize web techniques to accommodate for all of the different screen sizes and browsers. At first most companies decided the best approach was simply to build a 2nd site for mobile visitors that would be able to provide a good mobile experience. While this worked well for creating really beautiful and useful mobile sites it became apparent to developers that this meant creating and maintaining twice as much code.
Around 2010 web development teams began the shift towards Responsive Design in an effort to develop a single site which would look good on any screen and only require a single code base that needed maintaining. Perhaps the biggest break for Responsive Design was the release of the Twitter developed Bootstrap framework. Now, anyone could download Bootstrap and begin developing a site using well tested and proven methodologies. Today, you cannot waste any time on the internet without seeing a site developed using Responsive Design techniques, many of which are based upon the Bootstrap framework.
Today there are still some issues preventing Responsive Design and other modern development techniques from fully maturing. Namely, Internet Explorer (IE). Although there have been and still are many different web browsers, there are really only four worth mentioning: Apple’s Safari, Google Chrome, Mozilla’s Firefox and, of course, Microsoft Internet Explorer. The problem with IE is that it is fragmented into multiple different browsers ranging from IE version 6 to IE version 11. Unlike other companies which decided to only have one browser which are updated regularly; Microsoft decided to separate each version of its browser into its own (sometimes very different) browser. This means that someone who was using Windows XP and Internet Explorer 6-8 may still be using the old browser instead of a newer version. Over time the older versions of IE (versions 6-8 specifically) have become very outdated and are no longer considered “Modern”. Yet, web designers and developers still need to make sure their sites will work (mostly) with these older browsers. That means many of the features and functionality that are now possible with modern browsers cannot be used without fall backs and fail safes. This often means significantly more development time for an ever decreasing segment of the population.
Soon however, Microsoft will stop supporting IE8 and begin forcing older IE users to use more modern web browsers. Once that occurs I think we can finally expect to see the real arrival of the Web 3.0 and Responsive Design is going to be the de facto standard for the new web.