When you look at the development cycle of a piece of software like a web application, compatibility is probably one of the least fun aspects of a project.
With websites specifically, developers have a handful of browsers and rendering engines to test, each of which still supports an array of versions. This task can seem a little insipid at times, which is why many smaller sites undergo minimal testing.
Progressive enhancement and graceful degradation are the two different paradigms you can employ to ensure your web project looks (and works) great when rendered on any client with the least amount of superfluous testing possible.
They’re both good models to adopt when working on your project and the one you pick will likely depend on the nature of the project and the way you approach the front-end development stylistically.
Also read: Buffer App: Social Media Automation Tool
Graceful Degradation
Graceful degradation typically involves building your front end out to the point where it’s a finished product, then testing in other (sometimes less sophisticated) browsers and then building and testing “fall backs” for lower supported versions of those browsers.
This allows a front-end developer to creatively design interfaces using the latest technologies, but also ensures that the site functions on older clients.
Pros
- Easier to create a complicated or specialized user interface
- Affords the developer the luxury of focusing on working on the site itself rather than constantly thinking about compatibility nuances
- When done properly fall-back functionality is considered for every situation
Cons
- Sometimes, developing a suitable fall-back may be a time consuming process, especially when a project uses technologies that were recently adopted by browsers
- May result in (sometimes unnecessarily) bulky applications that are slower and less readable by crawlers
- Can sometimes override the users’ preferences
- Many developers simply tell users to update their browsers rather than developing fall-backs for the actual functionality. As a result, these users miss out on the experience unless and until they perform the update.
Progressive Enhancement
Progressive enhancement entails starting simple and building up. By not depending on any novel technologies and keeping essential functionality simple, one can swiftly ensure it’s compatible in various versions of all common browsers. More c0mplex features are then added, but they’re usually almost entirely visual and non-essential to the site’s purpose.
Pros
- Less time is spent on compatibility testing
- Maintains simple design and clean, easy-to-manipulate code
- Content is highly accessible, both to users on any client and to important bots like search engine crawlers.
Cons
- Some applications with complicated front-end interfaces simply can’t be built this way
- Many aspects of the application may need to be made from scratch as involving 3rd party code can also mean involving code that depends on newer browser versions.
My choice on which to use depends on what it is I’m doing: if I’m building something without using very much 3rd party code and if much of the logic will be done server side, I can safely take the progressive enhancement route. If I’m building a unique and complex user experience, graceful degradation is the more prudent choice.
In those occasional instances where either options would seem to be equally advantageous, I think of the site’s future and purpose and use that as gauge. Progressive enhancement feels sort of Zen and fits well when I’m trying to keep the project succinct. Graceful degradation affords the ability to have a little fun and experiment with developing interesting elements.
Author: Orun Bhuiyan
