Text Styling Rules

HTML Markup Details

font element
The font element is a deprecated (outdated) feature of HTML 4.0 and was orginally defined to provide inline styling changes to text content.
If the text content being styled by the font element is a section heading, then the heading elements (h1-h6) should be used in place of the font element. If the text content is a paragraph, sentence, phrase or word then CSS color, font-family and font-size properties should be used to achieve author styling preferences.
center element
The center element is a deprecated feature of HTML 4.0 and was orginally defined to center text content.
If the text content being styled by the center element is a section heading, then the heading elements (h1-h6) should be used to replace the center element. If the text content is not a heading but a paragraph, div or other block level elements with the CSS text-align property should be used to achieve text content centering.
u element
The u element is a deprecated feature of HTML 4.0 and was orginally defined to underline text.
If the text content being styled by the u element is a section heading, then the heading elements (h1-h6) should be used to replace the u element. If the text content is a paragraph, sentence, phrase or word, then the CSS text-decoration property with a value of underline should be used.
b element
The b element is a deprecated feature of HTML 4.0 and was orginally defined to bold text.
If the text content being styled by the b element is a section heading, then the heading elements (h1-h6) should be used to replace the b element. If the text content is a paragraph, sentence, phrase or word, then the CSS font-weight property with a value of bold should be used.
i element
The i element is a deprecated feature of HTML 4.0 and was orginally defined to italicize text.
If the text content being styled by the i element is a section heading, then the heading elements (h1-h6) should be used to replace the i element. If the text content is a paragraph, sentence, phrase or word, then the CSS font-style property with a value of italic should be used.
blink element
The blink element has never been a part of any W3C HTML specification, but is supported by many browsers and can be used to create a blinking effect on text. Blinking text should be not be used due to accessibility issues with people with visual impairments and photosenstive epilepsy.
marquee element
The marquee element has never been a part of any W3C HTML specification, but is supported by many browsers and can be used to create a scrolling text effect. Scrolling text should be not be used due to accessibility issues with people with visual impairments.

Accessibility Evaluation Rules

no. Testing Description Implementation
FAE Firefox
Accessibility
Extension
1 Fail/Pass

The font and center elements must not be used for text styling, instead use structural markup should be used with CSS for styling.

Implementation Notes

  • If the text content is used for section headers the styling elements should be changed to header elements (h1-h6).
  • If the text content is used to style an entire paragraph or other block level element use the CSS color, background-color, font-family and font-size and font-style properties to style the block level element.
  • If the text content is part of a sentence, phrase or word then the replace the styling elements with the em, strong or span elements and use the CSS color, background-color, font-family and font-size and font-style properties to style the inline element.
1.0 1.5
2 Fail/Pass

The b element must not be used to bold text content, instead use heading (h1-h6) elements for heading text or the strong element for emphasizing words, phrases or sentences.

Implementation Notes

  • If the bolded content is used for section headers the styling elements should be changed to header elements (h1-h6).
  • If the bolded content is part of a sentence, phrase or word then the replace the b element with the strong element.
1.0 1.5
3 Fail/Pass

The i element must not be used to italicize text content, instead use heading (h1-h6) elements for heading text or the em element for emphasizing words, phrases or sentences.

Implementation Notes

  • If the italicized content is used for section headers the styling elements should be changed to header elements (h1-h6).
  • If the italicized content is part of a sentence, phrase or word then the replace the i element with the em element.
1.0 1.5
4 Fail/Pass

The u element must not be used to underline text content, instead use heading (h1-h6) elements for heading text or the em or strong element for emphasizing words, phrases or sentences.

Implementation Notes

  • If the underlined content is used for section headers the styling elements should be changed to header elements (h1-h6).
  • If the underlined content is part of a sentence, phrase or word then the replace the u elements with the em or strong element.
1.0 1.5
5 Fail/Pass

The blink and marquee elements must not be used. Blinking and moving text are an accessibility problems for people with photosenstive epilepsy and visual impairments.

1.0 1.5

FAE Rule Implemetation

Illinois Functional Accessibility Evaluator 1.0
The Illinois Functional Accessibility Evaluator is a web based tool to help developers evaluate web resources for the use of the iCITA HTML best practices.
Web interface cannot currently analyze content generated dynamically with javascript.
Illinois Firefox Accessibility Extension
The Illinois Firefox Accessibility Extension is a Firefox add-in that is designed to identify accessibility features for both static and dynamically generated html content.
Useful for identifying the location of specific accessibility problems for failures and warnings indentified in FAE reports.
Create FAE reports for a page that uses javascript to generate page content with the FAE DHTML Report feature.