HTML Images - Lesson 2

Now you know how to change the text to make it bold, underline, italiczed and so on, it's time to know how to use images. Images are the things that make pages more attractive. It's great having the information, but graphics will make your website appealing, and without them, it's unlikely anyone will stay. If you have your image, upload it to your server or a free host (there are plenty). Now you have your image link, you can begin.

Adding an image requires a tag, as with everything else. The <img> tag to be precise. Except this time, it contains no attributes and has no closing tag. That is to say that in HTML </img> doesn't exist. To display an image, you must use the src attricute, which stands for "source". This is where you define the source link (the URL) of your image.

The code you will need to add an image using HTML is as follows:

<img src="URL">

The HTML uses a basic formatting style. If you enter some text, the image tag, and then some more text, the HTML will know the image should be in between these two areas of text, and will display it as such.

The alt attribute is used to show the user what they are missing, if the images are failing to load. If for example you have a boat image, but it isn't displaying properly, you can enter "car image" as the alt text, which will display instead. To do this, copy the following:

<img src="URL" alt="car image">

This isn't used that much anymore, but it's a simple function to add, and it's good practice adding the alt attribute. Now you know how to add an image to your website, there are more complex functions, such as defining the size, and making the image a link.