skip to content | home | umb a-z
UMB logo
Web Accessibility and Usability : Campus Standard :Style Sheets

Pages make sense when style sheet is disabled

Requirement: A page should remain readable and functional when an attached or inline style sheet is removed or used on different browsers.

When using style sheets, be sure to check the page in a browser with style sheets disabled or in a text-only browser such as lynx.

Developers also should check that pages display adequately across common browser configurations. Generally, problems may arise if you fail to set both foreground and background colors in the style sheet or if you use the style sheet to control positioning of items or text line height. In such cases you may end up with light text on a light background, content out of order, or text overwriting other text.

Appropriate page markup and style sheets should be used to control the appearance of elements on a page. Non-standard markup (use of the <blink>, <layer>, <marquee> tags, etc.) should never be used and contradicts the Massachusetts Information Technology Division's Web Accessibility Standards for state agencies.

Some thoughts about structure vs. style

HTML is a markup language. It's purpose is to describe the structure of a document -- not its appearance. Many people have trouble grasping this concept of a document's structure vs. its appearance. However, the reality is most of us read a document based on its structure. We just don't realize it.

Think of a newspaper story that features a headline, several subheads, a photo and a caption. Appearance-wise we could describe the story as blocks of text with different attributes. For example, 32-pt Old Bookman, 10-pt New Century Schoolbook and so forth.

However, these attributes convey no meaning about the function of the items, and function is very important to how we read. With the newspaper story, many people will search for the headline. Others perhaps start at the image, read its caption, and then move to the other parts of the story. Especially if the story is long, many readers will skim it, using the subheads as keys.

For computer programs, function is even more important. For example many search engines rank a page based on how keywords are used. If keywords are in the title of a page or the heading of a page, this page will rank higher than one that has the keyword only in the body copy of the page.

For someone who is visually impaired, knowing the function a piece of text serves is very important because they will not be able to deduce clues about its function from visual attributes such as size, color, weight, etc.

Therefore, it is important to use good markup to describe how your document is structured (headings, lists, body copy etc.), and then to achieve appearance you desire, use a style sheet to define how to display these elements

UMass Boston Home | Contact UMass Boston
CEEB Code:3924
Title IV School Code: 002222

100 Morrissey Blvd.
Boston, MA 02125-3393
617-287-5000
Directions

This page of the University of Massachusetts Boston
was last modified: Tuesday, January 11, 2005
Content Provided By: unknown

Valid XHTML 1.0