Progressive Enrichment

There are some great new features rolling out with CSS3 and HTML5 that will make life fun for web designers/programmers. Simple rounded corners, integrated video and fancy transitions are just a few of the many new options provided to developers. To varying degrees, browser makers are bolstering their support for these advancements in their latest versions.

Whenever new browser versions arrive, the question is raised on what features are widespread enough to take advantage of, and what level to design for. Users have many options for browsers, and then many versions of each browser. Some keep updated to the latest versions, others lag behind.

How do you know if your visitors will have the capability to experience the fancy new additions you spent so much time building? You could target the most common browser and avoid creating anything that isn’t compatible. Instead, I want to suggest and idea proposed by people smarter than me, called progressive enrichment. I love this idea.

In his book Handcrafted CSS, Dan Cederholm skillfully asks, “Do Websites Need to Look Exactly the Same in Every Browser?” His answer is no. Instead of being disappointed that the new features don’t show up in older browsers, shift your thinking to the standpoint that newer browsers are rewarded with enhanced features. Think about benefits instead of problems. This may be a big change in thinking for decision makers who expect one design to be rendered exactly the same in all browsers. If properly built, the layout, readability, and features could be developed similarly in each browser, but the finer details would differ as browsers support them.

Dan also suggests that the degree of your progressive enrichment should be tempered by your site’s specific stats. He quotes another smart guy, Eric Meyer who said it doesn’t matter what the global stats are for a browser, but it does matter what your specific site’s stats are. If your particular audience is full of early adopters, you have more freedom to enhance the site with the latest and greatest. However, if many of your site’s visitors are on earlier browser versions, you should focus on more widely supported features.

So if you're skimming this, here is my point: Because there is a delay between the release of new browser features and the adoption of browser software, you can’t simply develop sites dependent on advance features. On the other hand you shouldn’t develop to the lowest common denominator. I suggest using progressive enhancement to enable advanced browsers to enjoy new features while still providing a great experience to lesser browsers.

Further Reading:

Handcrafted CSS

Designing with Progressive Enhancement