Electric Type

Multimedia

About Us

News

Help

Accessible HTML

Page 2 — Use Meaningful alt Text

The easiest way to make your pages hold up through a text browser is to use the alt element of the <img src> tag properly. Many people include alt text without thinking about what it's actually for: describing what the image is. If you use a text browser, or you're like me and still run Netscape 1.1 at home because your machine is old, and you don't have the cash to upgrade anything, surfing without images is only possible with comprehensible <alt> text.

The alt element goes within your <img src> tag, like this:

    <img src="usefullmatt.gif" alt="photo of Matt Stevens">

Don't do this:

    <img src="usefullmatt.gif" alt="photo">

This doesn't work because the alt text doesn't communicate what the image is to someone who can't see it. More importantly, if the image is used as a link, the alt text should say where the link will take the user. Otherwise you cast off users to float forever without a point of reference.

A common mistake is to do something like this:

    Before you go on, choose one:

    <img src="logon.gif" alt="button">
    <img src="signup.gif" alt="button">
    <img src="exit.gif" alt="button">"

Instead, try this:

    Before you go on, choose one:

    <img src="logon.gif" alt="logon">
    <img src="signup.gif" alt="signup">
    <img src="exit.gif" alt="exit">

next page»


Tutorials  

User Blogs  

Teaching Tools  

Authoring  

Design  

Programming help  

Advanced Flash  

Javascript  

Glossary  

PHP Coding  

User Blogs

Screen Shots

Latest Updates

Contact Us

Valid HTML 4.01!
Valid CSS!

Breadcrumb

© ElectricType
Maintained by My-Hosts.com
Site map | Copyright | Disclaimer
Privacy policy | Acceptable Use Policy
Legal information.