Accessibility (Web) Keeping your Web Site Accessible
SHSU Technology Tutorials | Web Accessibility
How do I make my web site accessible to people with sight related disabilities?
- All Images must have alt tags.
All images inserted on to web pages must be given an alt tag, or alternative text, with sufficient information describing the image, or a blank alt for simple images (images that are just there for design purposes and have no importance if not seen). A blank alt tag in HTML would appear like this:
<img src="imagename.gif" alt="">
As a general rule if the image has text on it, then it is best to use that text in the alt tag as well. For example, if the image is a button that says "Home" then an appropriate alt tag would be "Home".
- All pages must have the required meta tags.
The required meta tags are as follows:
Title - page topic or subject.
Description - brief description of the subjects covered.
Keywords - specific to the page subject, and should not exceed 25 words.
Author - State of Texas and state agency name which for SHSU is "Texas, Sam Houston State University, SHSU, 753"
<meta name="description" content="Sam Houston State University, founded in 1879, is one of the oldest universities in the state of Texas. Sam Houston Sate University currently offers 86 undergraduate programs, 47 masters programs, and 4 doctoral programs. Sam Houston State University is located near the Sam Houston National Forest in Huntsville, Texas." />
<meta name="author" content="Texas, Sam Houston State University, SHSU, 753" />
<meta name="keywords" content="texas university, shsu, huntsville, sam houston state university, college, undergraduate, graduate, education, business, arts, sciences, criminal justice" />
- Do not have any page that contains priority 1 or 2 accessibility errors.
The definition of a priority 1 and priority 2 error are as follows:
Priority 1 error - An HTML coding error on a Web page that will cause persons with visual disabilities to be unable to access information on the page.
Priority 2 error - An HTML coding error on a Web page that may make it very difficult for persons with visual disabilities to access information on the page.
The easiest way of check for these errors are to use Bobby. Visit The HiSoftware Cynthia Says portal page and paste the link of the page you would like to check in the link box and submit. The page will run a check and report any errors. You are only concerned with errors and not user checks. It is also a good tool for checking for missing alt tags. The results should be used as a guideline to correct any of the above issues.
- Pages using frames must drop the frames when linking to web sites outside of their own.
We recommend not using frames unless it is necessary. If frames are used the page must drop all frames when linking to a web site outside of your own web site. This keeps people from dealing with frames and content from your web site once they have left.
- Web sites must comply with all applicable federal and state laws intended to protect minors.
Since Sam Houston State University has visitors under the age of 18 viewing web sites, as in considering SHSU as a possible college, web pages must not have anything that is not intended for minors.
- All pages must be accessible using generally available browser software.
All your web pages should be checked against the most current browsers and using this website: http://validator.w3.org/
- All pages must comply with all applicable federal and state laws intended to protect privacy
What other things do I need to check for?
Sam Houston State University also checks for load time on web sites as part of our accessibility guidelines. Load time is the amount of time it takes for a web page to load on various connection speeds. We use the lowest common denominator for our checks which is a 28.8 kbps connection. We ask for web pages to load in less than 15 seconds on a 28.8 kbps connection for the main page of the web site and 25 seconds on all sub pages of the site.
Images are the biggest factor in load time. The more images on a page, the longer the load time is. Dreamweaver has a great feature that shows you the current load time as you are working on a page. Down on the bottom right of the page workspace is where it shows you. The load time will appear 0K / 0 sec. The first number is the total Kilobytes of the web page plus all the images on the page. The second number is your load time in seconds. By default, Dreamweaver has the time set for a 56 kbps connection. To change the speed of the connection, go to "Edit" at the top pull down menu and select "Preferences". On the left side under categories, select "Status Bar" and you will see drop down box for connection speed. Change this setting to 28.8 so you will always be aware of the load time.
A common mistake in Dreamweaver is to resize the image by clicking a dragging the sides of the image. This does not make the image file size smaller and does not make the load time of the image smaller. Always resize your images in an image editor like Adobe Photoshop, Paint Shop Pro, or any other program you have available.
Other things we check for are broken links, spelling errors, links back to the main page of the web site, and that contact information is easily accessible.
What else can I do?
When navigating through the web as a sighted user, you see everything on the screen and know exactly where you want to begin reading. Folks with visual impairments, however, are forced to tab through every link on the screen until they get to the "meat" of the web content.
In order to make your information more accessible, you can insert what is called a "skip to" or "jump to content" image. This image is usually a 1 pixel by 1 pixel transparent image at the very beginning of the page that is linked to an anchor set at the beginning of the page content. You can also use the same technique to insert a "Jump to Navigation" image link. This makes navigation through your web site more accessible to your visually impaired web visitors.
- Information Technology Web Checklist - these are the things we do to ensure that our pages are compliant with state and federal guidelines.
- The HiSoftware Cynthia Says portal - a tool used to diagnose your web page's accessibility.
- Web Accessibility Initiative (WAI) - World Wide Web Accessibility headquarters.
- Federal IT Accessibility Initiative - (Section 508)
- Web Content Accessibility Guidelines
- Curriculum on Web Content Accessibility Guidelines
- PESO Working Group - established to provide a forum for addressing policy and technology issues related to improving access to government information and services via the Internet/Intranet or Extranet
- State Web Site Rule
- Making Accessible PDF's (Adobe Acrobat documents)
- Web Developer Tool bar for Firefox