Inserting Images
In this lesson's final task, you'll add some images to the page template.
1. | Position the insertion point after the placeholder text, "Special content area," and press Enter/Return to create a new line. Choose Insert > Image from the main menu. |
The Select Image Source dialog appears.
2. | In the Select Image Source dialog, browse to the images folder within the jade_valley site folder. Select label_products.gif and click OK (Windows) or Choose (Macintosh). |
This graphic was exported from the original (simplified) Fireworks design, and was placed inside the images folder for you. Now it appears at the top of the left column.
[View full size image]

3. | In the Image Tag Accessibility Attributes dialog that appears, enter Jade Valley Products. as the Alternate text. Click OK. |
This dialog appears by default to help ensure that you don't forget to add the alt attribute to any images.

4. | Delete the "Special content goes here" text. Click the yellow PRODUCTS graphic. Press the right arrow key once and then the Enter/Return key to move the insertion point below the label image you just inserted. Repeat Steps 1 and 2 in this task to insert banana.jpg just below the Products label image. |
You're almost finished reconstructing the original design.
[View full size image]

5. | In the accessibility dialog, enter Ad for organically grown fruits and vegetables. as the Alternate text. Click OK. |
Once again, you're providing a meaningful summary of the graphic for those visitors who can't see the graphic.
The graphics may appear misaligned; you'll fix that problem using CSS in the next lesson.
6. | Save and close the file. |
In the next lesson, you'll develop a style sheet and create a template for the Jade Valley Web site based on this page.