
Inserting accessible images/Creating "alt" tags
First, update your DreamWeaver preferences to prompt you to enter the "alt" tag when you add an image.
-
Place the insertion point in the Document window where you want the image to appear.
-
Do one of the following:
-
Choose Insert > Image.
-
Click the Image button on the Common tab of the Insert bar.
-
Drag the Image icon from the Insert bar into the document.
The Image Source dialog box appears.
- Click Browse to choose a file or type the path for the image file.
If you are working in an unsaved document, Dreamweaver generates a file location reference to the image file. When you save the document anywhere in the site, Dreamweaver converts the reference to a document-relative path.
- Click OK.
The Image Tag Accessibility Attributes dialog box appears.

- Enter values in the Alt and Longdesc text boxes. (Currently, the School of Medicine is not using the Longdesc option, however, we do require that all images contain Alt tags.)
For more information see Setting the Image Tag Accessibility Attributes dialog box options.
- Note: You can enter one or both text boxes depending on your needs.
- Click OK.
The image appears in your document.
Note: If you press Cancel, the image appears in the document, but Dreamweaver does not associate accessibility tags or attributes with it.
- In the Document window, select the image.
-
Do one of the following:
-
Edit the Alt value in the Property inspector.
- Edit the appropriate image attributes in Code view.
-
Right-click (Windows) or Control-click (Macintosh), and then choose Edit Tag Code.
The purpose of this dialog box is to set image tag accessibility options. You can enter one or both attributes depending on your needs. The screen reader reads the Alt attribute for the image.
-
In the Alt text box, enter a name or brief description for the image.
The screen reader reads the information you enter here. You should limit your entry to around 50 characters. For longer descriptions, consider providing a link, in the Longdesc text box, to a file that gives more information about the image.
- (Currently, the School of Medicine is not using the Longdesc option, the following is for information purposes only.) In the Longdesc text box, enter the location of a file that displays when the user click the image or click the folder icon to browse to the file.
This field provides a link to a file that is related to, or give more information about, the image.
- Click OK.
Note: If you press Cancel, the image appears in the document, but Dreamweaver does not associate accessibility tags or attributes with it.
|