How to Display an Image in HTML

Displaying an image in HTML is simply a matter of creating a tag that names the image file and specifies a few of its attributes. Images are easy to create and add enormous appeal to websites.

Difficulty: Moderately Easy

Instructions

Things You'll Need:

• HTML or text file editor

Create the Image

1. Use a text file or HTML editor to help you insert your image on the web page.

2. Type the following:
   

3. Replace the "myImage.gif" with the name of the graphic file you want to display.

4. Switch out the "This is my image" line with the text you want to show to viewers who have opted to not view images. This way, these viewers will have an idea of what is going on and won't be tempted to click off your page.

5. Substitute the numbers following the width and height attributes with numbers that reflect the number of pixels wide and high you want the image box to occupy.

Tips & Warnings

• Though inserting an image is easy, there are many variations that affect its display. You can use attributes of the image tag to align, scale and hyperlink your images.
• If you find you're having a hard time getting your images to display, go over your HTML code to make sure each angle bracket has been properly inserted.
• Try to keep image sizes small, as viewers bore quickly while waiting for large images to display and may abandon your page before it ever downloads.
• Instead of linking to an image that you supply on your own server, you can link to an image elsewhere on the Internet, but this is inadvisable since you cannot be sure that image will always be found there.