This browser does not support basic Web standards, preventing the display of our site's intended design. May we suggest that you upgrade your browser?

HTML Coding

Techniques for Creating Accessible Web Pages

Note: The HTML pages are out-of-date and will not be updated.

The following table is a quick reference on the techniques available to create accessible web pages  for those who are disabled. For additional information, refer to the LTS Online Help Web Publishing Series.

Text

 

Basic Formatting 

RECOMMENDATION: Use of <EM> and <STRONG> for emphasis.
The EM and STRONG codes provide structural emphasis and will influence how a speech reader will read the content. The I and B codes only provide visual text formatting and do not aid the visually impaired in understanding your message. 

Font Size 

RECOMMENDATION: Use of <SMALL>text</SMALL> or <FONT SIZE=”2”>text</FONT> is recommended over indicating a specific font size. 

Colors

 

 

Selection of a color combination requires careful study of color swatches. Various websites are available to help make the selection, including sites that focus on browser-safe colors.  

Font Color 

<FONT COLOR="006600">text</FONT> 

Table Cell Color 

<TD BGCOLOR="006600">cell contents</TD>   

Table Color 

<TABLE BGCOLOR="006600"> … other table code … </TABLE>   

Background Color 

<BODY BGCOLOR="006600"> …. Page content … </BODY> 

Links

 

 

The technique for creating a link accessible to those with disabilities is not very different from the usual technique. The key to creating accessible links is choosing text appropriately. It must be representative of the link as the screen reader reads only the linked text.  

Images

 

 

Alternate Text 

<IMG SRC="filename" ALT="the alternate text" WIDTH="10" HEIGHT="10"> 

D-Links 

A D-link is a descriptive link that provides a narrative of the image (e.g., a chart). The link is generally placed immediately after the image and links to another HTML file.  

Image Maps

 

Using client-side image maps (supported by the UWEC web server) and including text links for your image map is recommended. 

Tables

 

 

Indicate header cells by substituting <TD> with <TH> 

Lists

 

 

Creating a Numbered List (Preferred Method) 

<OL> 

<LI>first item of list 

<LI>additional items 

</OL> 

Using a List with Bullets 

For the screen reader to pause, either a period or a blank line is required between items.   

Using Images as Bullets 

<IMG SRC="filename" ALT="*" WIDTH="2" HEIGHT="2">list item 

Repeat as necessary. 

Frames

 

 

In addition to providing a non-frames version, the frames HTML page (the controlling page that references each of the individual pages), add title=”frame name” to each of the frame coding references. 

Original 

 <frame name="main" src="toc.htm" TARGET="_top"> 

Recommended 

<frame title="main contents" name="main" src="toc.htm" TARGET="_top">

Java and Scripts

Use alternate forms of delivery (e.g., an alternate page or text links on the page). 

 

Excellence. Our Measure. Our Motto. Our Goal.