It has been 5 years since Responsive Web Design (RWD) came out as a recommended way to design websites, because fixed width layouts were outdated and new devices with different resolutions were coming. Today, we are in the time where we have too many devices with multiple resolutions and RWD is the go to technique. It is not the perfect solution, but it is the best option available at the moment. In principle, RWD is very similar to its forgotten older brother that has been ignored for the majority of the new developers: Progressive Enhancement (PE).
Progressive Enhancement is focused on the content (HTML) and use CSS and JavaScript to enhance the experience in the platforms that support them. By using PE, you will have a functional application, even if CSS and JavaScript fail. I am not going to cover or go further into Progressive Enhancement, because Aaron Gustafson already wrote an article about it years ago for A List Apart.
Progressive Enhancement is for users what Responsive Web Design is for devices. RWD tries to cover smartphones, tablets, and desktop computers while PE covers users with little technical knowledge, disabilities, experienced users, and casual users. So, by applying PE, you are putting your users first. PE is built with accessibility in mind which helps and support users with disabilities. As the foundation of PE is the use of pure HTML, all browsers would be able to understand and parse HTML even if they don’t support CSS and JavaScript. So everybody is covered by Progressive Enhancement.
RWD Is Not Enough
Responsive Web Design is not enough, because it only take in consideration the screen without considering the environment where your page is loaded. You may have designed a very good responsive page. But, it could be unusable (if a script or stylesheet fails) if you did not apply Progressive Enhancement. Let’s stop and think about it, Progressive Enhancement and Responsive Web Design are about providing the best experience to the user no matter how users are accessing your site. So, if you use one without the other, you are braking the base principle of both of them.
Some developers may argue that Progressive Enhancement is expensive and not very practical. However, the main purpose of the web is to deliver information and be accessible for anyone. If you cannot work with such a basic principle, why did we decide to build it for the web in the first place? Why not go for a mobile or desktop application? In desktop or mobile environments, you can control what operating systems can install your application. In the web, we need to respect whatever browser the users have, and having in mind that even if you prompt a message to the users asking to update their browser, some users cannot or don’t know how to do it. There is a very large amount of companies that don’t allow the browsers to be updated because they have legacy systems that depend on proprietary features of older browsers or simply security reasons.
Keep in mind that not all browsers are modern or at least have the latest version. Some web browsers are not updated automatically and with the speed of the Web, they could become obsolete soon. However, progressive enhancement ensures that you support those browsers even if there are newer versions. So, RWD and PE combined if done right, would take care of of most of the problems with browser versions, browser engines, usability, user experience, accessibility, etc.
Progressive Enhancement is not as expensive as some developers argue considering that you will reach a larger audience. You will receive less calls complaining about your, broken site because most users would be supported by default. Also, if Progressive Enhancement is planned from the birth of the project, it is easy to just apply modern CSS and JavaScript to enhance the user experience.
Conclusion
It is unfortunate that some developers tend to ignore Progressive Enhancement, because they think it does not have enough value for their products. However, they get obsessed with best practices, responsive web design, page performance, and user experience when they are just a leg on the same table. If we have to make a list of best practices for web development, PE will be definitely included in that list.
I hope that I can convince some of the developers and designers that PE is something to be embraced and not ignored because at the end of the day, your decisions affect the users.
Further Reading
The Uncertain Web by Rob Larsen
Understanding Progressive Enhancement
Progressive Enhancement at Wikipedia
Progressive Enhancement is still important
Examining the Benefits of Progressive Enhancement
Progressive Enhancement is not about JavaScript Availability