Accessibility - Part 7
Article ID: KB101570
The third W3C Web Content Accessibility Guideline says:
Guideline 3. Use markup and style sheets and do so properly.
In other words, "Mark up documents with the proper structural
elements. Control presentation with style sheets rather than with
presentation elements and attributes."
This is possibly the hardest guideline for web designers and
people who use FrontPage to follow. That's because most people are
concerned with what their web site looks like in a browser
like Internet Explorer or Netscape. As a result, most people
gravitate towards web sites with complex layouts built by tables,
with images used for navigation buttons and design, and with fancy
animated effects. But these features often cause havoc with markup.
And, if you aren't a programmer, like most of the world, you may not
understand what "markup" is, and why it's important for
accessibility.
So, let's start at the very beginning...
HTML (the "programming language" of the web) is based on another
language called SGML. Both HTML and SGML, when created, were meant
to help define a logical structure for documents. For
example, think of an article or essay with headings, subheadings,
and paragraphs. HTML provides a way to label which lines are
headings, which lines are subheadings, and which lines are
paragraphs. HTML can even label which parts are quotations or
citations. This is what is meant by "markup" - portions of the code
are "labeled." Here's an example of some HTML code:
<h1>This is a heading (h1 stands for heading 1)</h1>
<p>This is a paragraph (p stands for paragraph).</p>
The <h1> and </h1> "mark" where the heading begins and ends. The
<p> and </p> mark where the paragraph begins and ends.
Theoretically, HTML information can then be presented in lots of
different, useful ways. For example, many web browsers will display
headings in larger text, so that you can tell visually which lines
are headings or subheadings. Or, you could create a different kind
of program or web browser that only takes all the headings from an
article and makes a quick table of contents sheet. People with
disabilities may have special browsers to help them "view" a web
site. For example, a blind person may have a browser that reads web
pages out loud.
Well, over the years, creative web designers have figured out how
to take HTML code and force it to create designs and layouts that
are pleasing to the eye -- often at the expense of a
"well-structured" document. We can't blame them -- after all, if
every web page looked like an outlined research paper, it wouldn't
be as much fine to surf the web. Almost every web designer in these
days creates tables that are used to create a certain kind of layout
on the page, although tables were originally designed to provide a
way to "mark up" rows and columns of data. And in order to get the
fonts and text colors they wanted, designers started using the
<FONT> tag excessively. Even on some sites today, you can see more
than 200 instances of the <FONT> tag on a single page!
You may be catching a glimpse of the problem this poses for
accessibility. If a screen reader is expecting "tables" to hold
data, what does it do when it comes with a crazy table that has all
kinds of layout information in it?
Now that you've got a basic idea of the problem, next month we'll
look at some of the checkpoints of Guideline 3 and how to implement
them in your web site.
Next: What's Up With Markup? Pt 2
Contributors
Corrie Haffly:
Corrie is the author of the Accessibility series, which appeared
in the PixelMill Newsletter. Though you may not know her name,
Corrie has become one of the top experts in the FrontPage Template
industry. You may know her work better under the name John Galt's
Templates. See Corrie's stunning products today!
John Galt's Templates
John Galt's Tools, PixelMill Newsletter, Volume 2 - Issue 12 : 12/01/2002
Back to top
Was this helpful?
Please rate this article:
Email address: (not required)
(Please provide your email address if you would like PixelMill support to follow-up with you about your comment. You're email address is NOT REQUIRED to submit a comment.)
Comments: (How can we improve this article?)
Clicking "Submit" will not clear this page.
link to this page:
http://www.pixelmill.com/support/al0/kb101570.htm
permalink to this article:
http://www.pixelmill.com/support/kb101570.htm
Back to top