ALT Text Explanation

This is Scary. I have ALT Text popping out of me!

I have some questions about ALT Text. First: What is it? Second: Why would I use it? and Third: How do I do it?

ALT Text is something not many webmasters use to its full potential. Let me try to answer your questions here.

Compliments of the FrontPage Guru at:
http://www.frontpageguru.com/frontpagetutorials.html

What is it?

The "ALT" attribute of the image tag provides the browser with text information to be displayed whenever it is not possible to display the graphic.

This will show up if your image is broken, if your reader has turned off images in his or her browser, or if the reader is using a text-only browser. In addition, this is a simple way to ensure that visually impaired readers using a "text reader" device will have some sense of what the graphic is about.

Using the "Alt" attribute adds value -- and it doesn't increase the load time for the page.

It is the text that pops up when you mouse-over a graphic on a Web Page. "ALT" Text is something not many webmaster use to its full potential.

Alt text is part of the image tag.

Here is the HTML Code that produces the "ALT" Text when you place your cursor over an image:

Wow I have ALT Text on me. HEHE

Place your mouse over the FrontPage Guru

Ok, so why do I need it?

Some people surf the web with their graphics turned off. They will not see the image, but if you have alt text they will know what was supposed to be there.
Sometimes due to server problems the graphic may not be displayed.
If the image is a hyperlink it will be useful to describe the link they are going to.
Sometimes useful in adding keywords to your website. Search engines rank your page on the number of times you use keywords on your page. You can get extra instances of your keywords on those pictures. Sneaky little webmaster trick =)

Here is how you place "ALT" text for the FrontPage Guru using FrontPage 2000: For other browsers and editing software (i.e., Netscape Communicator 4.X - Netscape Composer, FrontPage 98/2000, DreamWeaver 2.0, and Notepad and other text editors, view the How To Add ALT Text To Graphics web page.

Using Alt-text in Microsoft FrontPage web pages

Web pages specify pictures in HTML source code using IMG (image) elements. These elements can carry various attributes, among which is ALT-text, an alternative representation describing what an image or animation depicts -- (if not visible).

A comparison of how an image may display with
and without graphic capability. The text shown on the
right is supplied via the image's ALT-Text attribute.

ALT-text descriptions can help certain handicapped visitors and those that browse pages in text-mode. This alternative description could contain a keyword -- hopefully reinforcing your page theme with certain Engines. Its a good idea to ensure that all your (visible) images carry this text to describe what was visually intended. This makes your site a bit more accessible and friendly.

There are two ways to enter and edit alternative (image) descriptions in Microsoft FrontPage. We will take a quick look at each method.

Method-1: Edit direct in HTML view

The text can be entered directly, using the HTML view of the FrontPage Editor. But this is not an efficient way to accomplish the task. It is better to find each image in the Normal editor view and bring up a dialog that allows precise control over Image attributes.

Microsoft FrontPage 2000
Editor View tabs

Method-2: Use the Picture-Properties Dialog

Pick an image on your page and 'right-click' it. From the popup menu, scroll the selector-bar down and choose 'Picture Properties' as shown below.

The pop-up menu to select the Picture Properties

After making this selection, you are presented with the Picture-Properties Dialog. In this Dialog you'll notice a number of edit-line fields and areas. Among the areas is one labeled Alternative representations. Below that are two text edit boxes, the sentence shown as WHITE on BLUE identifies the one you want -- as pictured next

Picture Properties Dialog

After entering your ALT-Text description in the box labeled 'Text', click OK. You are done -- your image now carries an associated alternative text description.

My Webmaster Friend, Al Kish

(We will use Al's picture, at the Web Group Meeting, to demonstrate how to attach an "Alt" text message to the his picture.)

A Picture of the Webmaster, Al Kish