Progressive enhancement

The essence of the web is that it should "work" for everyone in every possible context. This means that all users must have access to all content. This seems very logical, but an increasing number of website nowadays are mainly focussed on a feature-driven user experience. This can only be done by design from the base up. First, just make it work, after that improve it.

  1. The first thing you design is the content. Define what the goal is of a certain element or page and translate that to just text.
    It's very tempting to start concepting and come up with all sorts of exotic interface solutions and patterns, but it is crucial to take a step back and define which content is needed and what the basic structure is. The right hierarchy and semantics are key for making content accessible; this is your working foundation.
  2. On top of that we can design whatever suits best with the brand. This layer can provide advanced functionality to enhance certain content or to adapts it to a specific user-context.
    Things like visual brand representation, fonts, specific responsive layouts, touch optimisation, animation, and everything else that enhances the content, are in this category and are crucial for the right experience. But they should not have our primary focus. First tell the story without styling (CSS or Javascript) and then add all the bells and whistles that enhance the experience.

This layered approach detaches the content from any additional presentation layers and this separation allows for true accessibility; this way, the content is available for everyone and works no matter what. Additional features to make the information more pleasurable are designed as an add-on and are available for anyone that can access it. Accessibility is not only very important to make the content available for disabled people, it is crucial for everyone. This is what makes the internet work; it guarantees that content is available through all types of interfaces; speech, touch, click and in all types on context. You don't have to have the fastest internet connection, the biggest hi-res screen, the right plugin, or the newest operation system, the content is always within reach.

Although the goal is similar, "graceful degradation" is quite different because the solution is more of an afterthought in stead of a starting point; that's fixing problems afterwards and the whole point is that the content must be solid, so the web works for everyone.

Often the metaphor of an escalator is used to explain the principle of progressive enhancement; the nuance from an interaction design perspective though is that you should not start with designing an escalator and think of the stairs "fall back" when you cover all of the unhappy flows. The design process should be focussed on primarily delivering the right content for the right user needs, and design improvements build on top of that foundation. I find the moving walkways you find at airports a better metaphor; they simply enhanced the corridor that was already there, but makes your trip to the planes a lot easier. As a bonus, and unlike escalators, the walkway is still wheelchair friendly, even when the machine is not operating.