Month 2 Week 3

Simple Graphics

Adding An Image To Your Web Page

Now that you have an image ready to add to your web page, the next step is to add the tag needed to display a graphic. Images in HTML are displayed using the <IMG> tag and it has no "close" tag.

Open your test2.html and now re-save it as test3.html since you'll be making some big changes today. Next, locate the place in the body section where you want to place your image and start your tag -

<IMG SRC="

The SRC portion tells the browser to search for a file with the name you are about to give it. If your graphic were named "balloon.gif" then your image tag would read -

<IMG SRC="balloon.gif">

Just replace the balloon.gif with the name of your graphic.

You also should add a name to your graphic. This helps out visitors who are visually impaired to know what your graphic would show them. It also is the text that people see when they move their mouse over your graphic. You add a name by adding "ALT" inside the image tag like this -

<IMG SRC="balloon.gif" ALT="Drawing of a bunch of balloons.">

Try It Now!

Add your graphic into your page, making sure to give it a name as well, before moving on to the next section.

Now that your graphic is in your page, let's learn how to make small changes.

©2003, Gnosis 4-H Club
The 4-H name and 4-H logo are service marks protected under 18 U.S.C. 707.

Questions? Comments? Problems? Contact the Webmaster!


Home