Web Services

Web Services Internal Development Standards

HTML Standards

This section discusses the standards for HTML markup and page layouts. However, you can avoid having to read all of this by simply using the template files that are provided for each site. The main CSU, Chico template can be found at: http://www.csuchico.edu/weblogos/templates/. Custom templates for sites developed by Web Services can typically be found in a "templates" folder within the site in question.

XHTML Strict Document Type

In order to insure compatibility with current and future standards-based Web browsers, as well as to meet CSU ATI accessibility requirements, we have standardized the XHTML Strict document type declaration. This declaration establishes that the pages conform to the XML-based XHTML Strict standard and causes modern browsers to treat the page in a particular way. Pages that declare a document type must validate to the standard in order to be valid.

All XHTML Strict pages MUST begin with the following DOCTYPE declaration at the very top of the page (above the <head> tag):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

There are a number of other rules that apply to XHTML pages, but the easiest thing to do is simply convert the pages to XHTML in Dreamweaver.

  1. Open the desired page in Dreamweaver
  2. Choose File>Convert>XHTML
  3. Save the file

Converting the file is only the first step, however. To comply with Web standards, a page must also be valid XHTML. To validate a page in Dreamweaver:

  1. Open the desired page in Dreamweaver
  2. Choose Window> Results>Validation
  3. Click on the green triangle and choose "Validate Current Document"
  4. If you see "No errors or warning found," congratulations!
  5. If there are errors, these will have to be resolved before the page will comply with standards.
  6. You can also go to http://validator.w3.org/ and enter the page's URL.

CSS Page Layouts

The current trend in Web design is a move toward completely Cascading Style Sheet-based page layout. The primary advantages of this approach are device-independent layouts and increased accessibility. This approach also adheres to the philosophy that HTML markup should be structural only, and that all layout and presentation should be handled by CSS styles. This separation of structure from presentation makes changing or updating the look of a Web site a rather trivial task, instead of the major surgery required to change the layout, design or appearance of table-based sites.

Table-based layouts are also highly problematic from an accessibility perspective, since screen-readers will read rows across that may be intended to be viewed verticially. Although a table-based layout may "pass" basic accessibility testing, such layouts rarely, if ever, provide real accessibility to disabled users.

As a result, all sites developed and supported by Web Services will and must use CSS-based layouts. These layouts provide the highest level of accessibility, maximum flexibility of display for different display media, as well as the greatest ease of maintenance and redesign.

Liquid vs. Fixed Width Page Layouts

For many years the standard design rule was to create pages that would display on 640x480 pixel monitors. Now pages are being designed to fit 800x600 pixel monitors. However, such static width pages leave large, unused blank areas when viewed on larger monitors. To reclaim this space, Web pages may be based on "liquid" layouts. Such pages automatically stretch or shrink to fit the width of the browser window. At present, the minimum recommended design width is 710 pixels, in order to fit on 800x600 monitors

However, fixed width layouts are also acceptable. The standard Web Services templates include both fixed and liquid width layouts.

Top