All technologies that support images or presentation markup.
This failure relates to:
This document describes a failure that occurs when a change in the appearance of text conveys meaning without using appropriate semantic markup. This failure also applies to images of text that are not enclosed in the appropriate semantic markup.
The author intended to make a heading but didn't want the look of the default HTML heading. So they used CSS to style the P element to look like a heading and they called it a heading. But they failed to use the proper HTML heading element. Therefore, the Assisitive Technology could not distinguish it as a heading.
Example Code:
<style type="text/css">
.heading1{
font-family: Times, serif;
font-size:200%;
font-weight:bold;
}
</style>
<p class="heading1">Introduction</p>
<p>This introduction provides detailed information about how to use this
........
</p>
Note: In this case, the proper approach would be to use CSS to style the H1
element in HTML.
Chapter1.gif is an image of the words, "Chapter One" in a Garamond font sized at 20 pixels. This is a failure because at a minimum the img element should be enclosed within a header element. A better solution would be to eliminate the image and to enclose the text within a header element which has been styled using CSS.
Example Code:
<img src="Chapter1.gif" alt="Chapter One">
<p>Once upon a time in the land of the Web.....
</p>
The following example fails because the information conveyed by using the CSS font-weight
property to change to a bold font is not conveyed through semantic markup or stated explicitly in the text.
Here is a CSS class to specify bold:
.yell {
font-weight:bold;
text-transform: uppercase;
}
And here is the corresponding HTML:
<p>
"I said, <span class="yell">no</span>, not before dinner!",
was the exasperated response when Timmy asked his mother for the
fourth time for an ice cream cone.
</p>
No resources available for this technique.
For images of text:
Check if any images of text are used to convey structural information of the document.
Check that the proper semantic structure (e.g., HTML headings) is used with the text to convey the information.
For styled text that conveys information:
Check if there is any styled text that conveys structural information.
Check that in addition to styling, the proper semantic structure is used with the text to convey the information.
If check #1.1 is true, then #1.2 is true.
If check #2.1 is true, then #2.2 is true.
Techniques are informative—that means they are not required. The basis for determining conformance to WCAG 2.0 is the success criteria from the WCAG 2.0 standard—not the techniques. For important information about techniques, please see the Understanding Techniques for WCAG Success Criteria section of Understanding WCAG 2.0.