Jump to beginning of the overview page

W3C logoWeb Accessibility Initiative (WAI) logo

Overview Before and After Demonstration

Improving a Web site using Web Content Accessibility Guidelines (WCAG) 2.0

About the Demo

The Before and After Demonstration is a multi-page resource that shows an inaccessible website and a retrofitted version of this same website. Each web page includes inline annotations that can be activated to highlight some of the key accessibility barriers or repairs. Each web page is also accompanied by an evaluation report to inform the developers on the level of conformance to the Web Content Accessibility Guidelines (WCAG).

Note: This Demo is intended to illustrate some of the aspects of web accessibility. It does not cover every type of accessibility barrier or accessibility requirement. Some of the inaccessible Demo content may not be easily usable by all readers.

Demo Contents

Download: Entire Before and After Demo (BAD) as zip-archive (~600 kb). Note that the survey form requires a web server with PHP scripting to work; submitting the survey form will not work locally on your computer.

Using the Demo

This Demo serves a variety of purposes such as raising awareness on web accessibility or for providing practical examples for developers. Some of the common ways of using and navigating through the Demo include: