Testing HTML code, Cascading Style Sheets, Accessibility, Browser and Web Standards Compliance

This section provides information on testing the following:

In all cases web sites are identified that allow compliance of web pages to be checked in a few minutes.

Methods of testing for compliance when courseware is being created using Dreamweaver® are also discussed.

 

Testing Cascading Style Sheets

 

Cascading style sheets (CSS) control the layout of a site and its appearance.

If errors are present in the style sheet the appearance of the site, that is pages within the site, may not render correctly.

There are 3 major issues with cascading style sheets:

  1. The syntax of the style sheet should be correct
    Errors in syntax can cause incorrect rendering of site pages

  2. Elements in the style sheet should comply with accessibility requirements
    It is possible for a style sheet to be syntactically correct and not to comply with accessibility requirements

  3. Newly created style sheets should not use deprecated elements
    The W3C sets standards for HTML code and style sheets- when elements are to be discontinued at a future date they are referred to as deprecated elements. Using deprecated elements may cause site problems in the future.

Cascading style sheets may be validated for correct syntax in a few minutes using validation tools that are available on the Internet.

An example of CSS validator is jigsaw:

To check the validity of a CSS controlling the page you may enter the CSS file URI, upload the file or enter the file code directly.

You will receive a status report in a few seconds.


Testing for Accessibility Compliance

It is possible to check the accessibility conformance level of a web page in a few minutes, using tools available on the Internet.

Follow the link below to check the accessibility conformance level of any web page.

Wave: a web page accessibility checker

Enter the URI of the web page you wish to check and the arrow next to the URI.

A report is presented listing errors, if there are any.

This view is close to what a screen reader would use to convert text to sound for a blind user. Ideally the page should make sense with the style sheets disabled.


Validating HTML code

HTML code may be validated in a few minutes using Internet based tools. An example is the W3C Markup Validation Service.

You can validate a web page by entering its URI, by file upload or by direct entry.

You will be presented with a report stating the validation status of the document.


Testing for Browser Compatibility

The methods of validating web pages and testing them for compliance we have considered in previous sections depend on using resources and tools available on the Internet.

It is possible and advisable to test for browser compatibility when they are being created.

A list of the major browsers in use is shown below:

Each browser has several versions operating on computers world wide.

If web pages are not made compatible with the range of browsers in use they will not display properly on some computers.

Important

The techniques introduced below have been implemented with Adobe Dreamweaver® CS5

Figure 1 Testing for Browser Compatibility using Dreamweaver

Figure 1 Testing for Browser Compatibility using Dreamweaver

 

Click on the browser small drop down arrow next to Live Code.

 

 

Then click on the "Check Browser Compatibility" option.

 

 

Dreamweaver then carries out the browser compatibility test.

 

 

 

 

 

 

After a few seconds a "Browser Compatibility" report is produced, which identifies any compatibility issues.

 

In the example shown no issues were found.

To open the Dreamweaver target browser list, click the small down arrow below the search tab.

Then select Settings.

The target browser list is displayed.

Figure 2 The Dreamweaver Target Browser List

Figure 2 Browser List

The browser list includes the major browsers.

 

The minium version number of each browser to be tested for

can be set using the drop down menus.

 

We have set the minimum version of Internet Explorer to 7.


Note it is possible test all the links on your site using Dreamweaver.