Main content

Alert message

Spring 2019

Jim Allan, Accessibility Coordinator
Texas School for the Blind and Visually Impaired
1100 W. 45th St.
Austin, TX 78756
Phone: 512-206-9315
e-mail: 

Examples:

Syntax for image link to main content

<a href="#navskip"><img src="/someimage.gif" alt="skip to main content or other appropriate wording"></a>
...
<a name="navskip"></a><h1> The main content...</h1>

 Syntax for text link to the main content

<a href="#navskip">Skip Navigation Links></a>
...
 <a name="navskip"></a><h1> The main content...</h1>

Try it:

Add either "skip to main content" technique to this page.

If using image link use this image bullet to use in skip nav exercise

  • If you must use PDF include HTML or Text version (made from source document)

Examples:

bank.pdf PDF file

bank.txt Result using Access Adobe online conversion

bank.rtf Result using "Save as...RTF" in Acrobat 5

Tools

http://access.adobe.com/simple_form.html

How To Create Accessible Adobe PDF Files Booklet

Enhancing the Accessibility of the Web with Adobe Acrobat Software White Paper

Examples:

Problem implementation: Louisiana Department of Education Home Page

Good implementation: IBM Web Accessibility - Course Menu (view source - NOFRAMES)

Syntax for adding TITLE and NAME to frame

<frame src="/banner.htm" name="Course navigation" title="Course navigation" frameborder="0" scrolling="no" marginwidth="0" marginheight="0">

Try it:

Add TITLE and NAME to each frame declaration

The Texas Union Online - Informal Classes

  • TABLEs that are used for data should include SUMMARY, CAPTION, HEADERS, and structural tags (TH).

Examples:  

Goodwill Industries of Central Texas - Jobs

Unit 4 - Lesson 3 Working with Tables

Syntax for adding SUMMARY,  CAPTION and TH to tables

Cups of coffee consumed by each webmaster

Name

Cups

L. Smith 10
J. Allan 5
B. Jones 2.5

<table border="1" summary="This table charts the number of cups of coffee consumed by each webmaster.">
<caption >Cups of coffee consumed by each webmaster</caption>
<tbody>
<tr>
<th>Name</th>
<th>Cups</th>
<tr>
<td>L. Smith</td>
<td>10</td>
</tr>
......
</tbody>
</table>

 Try it:

 Add CAPTION, SUMMARY, and TH to the following table.

Shoe size and Favorite color of webmasters

Name Shoe size Favorite color
L. Smith 10 Camouflage
A. Allan 12.5 Pastel Navy Blue
B. Jones 6 Plaid

Example:  

Form with labels




 

Syntax for adding LABEL to form controls

<label for="Name1">Name</label> - this is the label tag

<input name="Name" id="Name1" size="30"> - this is the form control tag

be sure that contents of "for=" is identical (including case) to "id="

Try it:

Add labels to this form.

Form without labels
City: 
Address: 
 
  • Always use client side image maps and add ALT to AREA tags

Examples:

Problem image map: Links to Texas Education Service Centers

Better Implementation: TSBVI Links to Texas Education Service Centers

Syntax for AREA with "alt"

<area coords="0,0,52,52" href="url" alt="purpose of link, where will it take you">

Try it:

Repair this image map. Add "alt" to each AREA tag.

Yahoo

Example:

Space Camp for Students with Visual Impairments

Syntax for image tag with "alt"

<img src="/location of image" alt="short description of picture or its function">

Try it:

This is a picture of a man water skiing, add appropriate "alt" 

This button is a link to the start page of this workshop, add appropriate "alt"

Syntax for image with "alt" and "longdesc"

<img src="/location of image" alt="short description of picture of function" longdesc="souce of long description file-text or html">

Try it:

This is a picture of a woman walking with her guide dog with a book under her arm