Inclusive Web Design
For the Future
with Progressive Enhancement
Steven Champeon and Nick Finck

Delivered March 11, 2003
at SXSW Austin, TX
Permanently archived at:

En Español (Traducido por: mort (Manuel González Noriega) para Simplelógica)


Web design must mature and accept the developments of the past several years, abandon the exclusionary attitudes formed in the rough and tumble dotcom era, realize the coming future of a wide variety of devices and platforms, and separate semantic markup from presentation logic and behavior.

The goal of Web design is not merely to dazzle, but to deliver information to the widest audience possible.

Compromise is possible and desirable, but such compromise should not come at the expense of the user, but rather in terms of the native capabilities of the user's choice of device.

Given the powerful capabilities of modern graphical desktop browsers, it is now possible to provide a progressive, gradually enhanced experience across a wide array of browsers, using one markup document and a variety of different stylesheets, not selectively delivered to the user through browser sniffing, but rather requested by the client itself.

Leave no one behind.

A Brief History of Web Technologies

SGML becomes ISO standard
CERN linemode browser
NCSA Mosaic et al.
Netscape Navigator released, W3C Founded
Microsoft Internet Explorer
The Browser Wars, CSS1, JavaScript, DHTML
HTML 3.2, CSS2, HTML 4.0

Obsolescence of Browsers

“graceful degradation”

Dates back to 1994 WRT the Web, earlier in computer science, other fields. Basic idea is that so long as less capable browsers can handle documents containing newer, perhaps unsupported technologies, and still get at the basic information and/or functionality, everything is fine.

In recent years, though, this has come to mean producing one version of the site without designing in support for less capable browsers, on the assumption that a few alt or title attributes are enough.

Mostly, this is because visual designers and others rightly believe that graphical desktop browsers are what most people use, and so the judgement is made on the basis of economics. But this ignores some basic realities:

  1. browsers, even modern browsers, have widely varying capabilities
  2. accessibility is for everyone, not just the disabled
  3. it is possible to support all browsers with X/HTML and CSS

The Rise of Baseline Standards

Conflicting Approaches to Design

Rise of Web apps and Dynamic HTML

Problems with graceful degradation

Problems posed by new platforms/devices

Progressive Enhancement

Progressive enhancement is a strategy that reaches back into the history of the semantic markup technologies that gave rise to HTML and inspired XML. By making use of new presentation technologies such as CSS, it allows the Web document designer, visual designer, and developer to play to their own strengths while enabling each to deliver the information and interactivity demanded by users, while embracing accessibility, future compatibility, and determining user experience based on the capabilities of new devices.

Instead of placing responsibility on server to determine what to send back to the client, PE uses longstanding characteristics of markup, bugs in various browsers, and other tactics to place a renewed focus on information delivery. Rather than hoping for graceful degradation, PE builds documents for the least capable or differently capable devices first, then moves on to enhance those documents with separate logic for presentation, in ways that don't place an undue burden on baseline devices but which allow a richer experience for those users with modern graphical browser software.


Progressive Enhancement Strategies

Strategies, continued

Strategies, continued

Strategies, continued


CSS Hacks