[Skip navigation]

DEMOS Project

Online Materials for Staff Disability Awareness
: DEMOS Techniques

General techniques used

Valid and accessible design and code

This site was designed in compliance with the latest standards developed by the World Wide Web Consortium (W3C) and using the latest accessibility techniques as recommended by the Web Accessibility Initiative (WAI).

In December 2001 the code base of the site was switched over to XHTML 1.0 Transitional. In November 2002 the site was further improved by changing it to a CSS layout, which is used to position elements on the page without the use of tables. The only layout table left is the one holding the header: logo, search box and top navigation icons.

Cascading Stylesheets are also used for all presentational markup and a separate print stylesheet has been supplied.

The code was validated using the W3C Validation Services.

Valid XHTML 1.0! Valid CSS!

Accessibility

This site should 'transform gracefully' in all user agents, meaning that even if the layout is lost due to lack of support for the used techniques, the content should still be accessible and the website usable. It should cause no problems for screenreaders and other assistive technology. Check the Help page for a list of Accesskeys and how to customize the look of the site to your liking. If you should encounter any problems, please email me immediately at <iris at manhold.net>. Feedback is not only welcome but essential to improve the site.

The site has been tested using the Bobby and the Wave Accessibility Checkers. It is AAA compliant, which means that it meets all 3 levels of accessibility.

[Bobby AAA Approved]

Testing the new design

Examples of what the site looks like in a variety of browsers can be found here.

Netscape 4

One of the biggest constraints for achieving standard-compliance and accessibility on the DEMOS site was the fact that an older browser (Netscape 4.7) is used as the default browser by many academic institutions, the target audience for this site. This browser understands just enough of CSS to be right in-between those browsers that will ignore it and simply display pages in a simpler fashion with presentational extras stripped, and standard-compliant browsers that will display pages coded according to standards correctly.

For this reason two separate stylesheets are supplied with this site, one stripped-down stylesheet is read by Netscape 4 browsers, while additional information for standard-compliant browsers are supplied in a second stylesheet that is only read by those browsers. For this reason the site does not look as 'pretty' in Netscape 4 but the imporant thing is that all information is still accessible.

To do

There are still a few problems that need ironing out. Strucural mark-up needs improving by using headers correctly. Some of the forms don't work with the CSS layout yet and are still in tables. The accessibility of forms needs improving.


[Previous] | Previous || Table of Contents || Next | [Next]