Inserting Images

These are instructions on how you add images in your HTML document. The steps are repeated for each image you need to add.

  1. To start adding images, place the cursor inside a div tag (in HTML) that you want to place an image.

    Make sure you have your header logo image file saved in the "images" folder.

  2. To insert the header logo image, place your cursor inside #header_logo.

    "Inside" a tag means the code must be after the opening <div>tag and before the closing </div> tag

    3. 
<div id="header_logo">
<a href="index.html" target="_self">
<img src="images/HeaderText_lrg.png" width="461" height="80" alt="Header Title Description"/></a>
<!--Closing Tag for header_logo--></div>

    Adobe® Dreamweaver Shortcut

    1. Choose (from menu) Insert > Image
    2. Browse to find the image. Select “Choose” This image should be in the "images" folder.
    3. Type a decription in the Alt tag when the window comes up (this gives visually-limited users a chance to know what the image is)
  3. Insert images in other sections, such as the gallery. Remember to add the appropriate alt text to describe the image.
    4. 
<div id="header_logo">
<a href="index.html" target="_self">
<img src="images/HeaderText_lrg.png" width="461" height="80" alt="Header Title Description"/></a>
<!--Closing Tag for header_logo--></div>
  4. Repeat these steps every time you want to add an image.