AUX-04 Pre-Class Assignments
Accessibility and 508 Guidelines
Alt Tags and Equivalent Text
Ever heard the expression, "You gotta see this." Imagine if you had impaired sight, what would you do? The answer for web programmers is to provide alternative text and text equivalents to the image, video, and multimedia (such as an animation)
USCG Auxiliary Internet Policy and just good practice requires the web designed to include alternative text for ALL images on their website. Your alt text is an attribute to the image. If a viewer of your website has his/her browser graphics turned off or they are using a text reader, then instead of the image, they will see (or hear) the description of the image via the alternative text.
Multimedia Alternatives
Providing a video or audio track for any purpose is not against the law. You should however provide an alternative to multimedia. Your television is capable of this accommodation by providing Close Captioning. Televisions available today all have this option that can be turned on or off while viewing your televised programming or while watching a video.
If you provide video, there needs to be a text equivalent for the audio and a text that describes the action occurring in the video. With some training this is easy to provide using the SMIL programming language. This will link a video with audio with text equivalents so that they are linked when presented. While SMIL is easy to learn, implementing it and trouble shooting it is an intermediate to advanced programming level.
If you provide audio, you should also provide text equivalent, the transcript, but it does not have to synchronize to the audio. Synchronization is only required for video multimedia presentation. If your website plays music, the audio text equivalent would inform the visitor to the website about basic information such as the title of the music, the musician of musicians, the arrangement, etc. For example, playing the U.S. Coast Guard anthem when first visiting the website should include the information about the band, the date of recording, the conductor, and any other information such as the fact that the audio is the audio of the Coast Guard anthem entitled "Sempar Paradus".
Information Conveyed with Color is available Without
You might not be blind or know someone who is blind, but odds are that you know someone that is color blind. Imagine telling someone to press the green button to go to the next screen and they see red and green as shades of grey.
This doesn't mean that you have to eliminate color, only design your website with some consideration. Instructions directing someone to follow a particular color link or to read text in a section defined by color should be replaced in favor of directions that are not dependent on color.
Web Page Documents should not require a pre-defined stylesheet.
In the World Wide Web today it is a standard to use a cascading style sheet or CSS. The purpose of the CSS is to code for the visual presentation of the text contained in the HTML Document. In practice it is best to separate the content in your web page from how it is presented.
For example, a font style or size is a visual reference for the basic content. On this page the text font is presented as Arial at the default font size. The content is what you are reading now. Visitors to a website might employee special software or browsers that allow them to apply there own styles such as increasing the font size and strength (bold) in order for them to read it.
Today, this is an even better idea since the visitor to your website could be using a computer, cell phone, PDA, or other device to view your content. Each device would over ride your style sheet and employ there own to format the content for the device. This is why the standard requires that the content be readable whether or not a style sheet is used. To test this, if you're using CSS file to format content, move or delete the CSS file to see how the web page appears. If it is readable, then your in compliance with this standard.
Overcome image maps with text
Don't know what an image map is? Well, you have probably used one if you have visited MapQuest or the Yahoo Map feature. Click on the map that is displayed after finding your location and the map will redraw a zoomed in image centered around where you click with the mouse. This is an image map that responds to the location on the image where you click.
Often an image map is used to provide navigation to different features. The problem is that it is difficult to see where the mouse pointer is if you cannot see the mouse pointer. Satisfying this requirement is a simple as providing a text based navigation menu on the same web page. Usually this is demonstrated by a list of links at the bottom of a web page and is called a text navigation menu.
Client side image maps preferred over server side.
The client is the visitor to your website and the server is where your website is stored. Of course, both computers must be connected to the Internet. A server-side map appears on the client's computer but the coding for it is on the server and not imbedded in the web page that was delivered to the visitor or client. It is best to place the image map code in the web page so that when the web page is delivered to the client, the image map code is on their computer.
Basically, if you do not use an image map, then you comply with this requirement.
Tables should be coded (marked up) completely
Tables are allowed in the coding of a web page. The preference is that the table be used for the presentation of data or information easily presented in the form of a table. You may use tables for page layout purposes but the markup must indicate this for the screen reader.
Frames should be titled and identified within the markup or code
Frames are BAD! It is easy to see why framing was made possible within the browser, but the technical issues are a nightmare. AVOID FRAMES AT ALL COSTS. This will mean you do not have to worry about this requirement.
However, if you insist on using frames for your website then be certain that each web page uploaded into a frame has a clear <title></title> tag specification and that the frames are clearly labeled and identified within the framing document.
Avoid Screen Flicker within the range 2 Hz to 55 Hz
Do remember blinking text? You do not see it much anymore because for some visitors it would cause an epileptic attack. If a object on your web page flickers greater than 2 Hz or less than 55 Hz you need to remove it for fear of triggering a epileptic episode in susceptible visitors.
A 2 Hz flicker is anything that repeats 2 cycles per second. In other words and animated gif that goes on and off is a single "cycle." If the gif repeats the cycle so that 2 complete cycles happens within one second, you have a 2 Hz flickering animated gif. You are okay if the flicker is less than 2 cycles per second, or more than 55 cycles per second. By the way, most monitor-video card combinations display at 60 Hz or greater. This means that it will be difficult to show an image than cycles more than 55 times a second and have the monitor show every on-off cycle. So it is safe to say you should keep any repeating on-off cycle to less than one per second.
Text only optional page
Okay, you have a killer website made with the latest greatest software and none of it complies with the 508 guidelines. The solution is simple! Provide a document, web page or text only, that can be viewed easily within a screen reader.
Often I build or visit web pages built with Macromedia's Flash program. Flash is really bad at accommodating accessibility unless the programmer pays special attention to their work. The easier solution is provide a text link that a user can view your content on without all the graphics and animation.