HTML tutorial - Picture this

Picture this

So, now you can put in text, with a title and headings. What about a picture? That's pretty simple too. Most web browsers let you include images on the page, as long as they're saved in GIF format. The line in the sample page that displays a picture of me is this

<img src="nigel.gif" alt="Picture of Nigel">

The 'img' stands for image, and the next command, 'src' says where the image is. If it's in a different directory, you can give the name inside the quotes as well, like "images/nigel.gif" - make sure that the slashes point forwards, rather than backwards, like DOS or Windows.

The final part of the command isn't necessary, but it's good practice to put it in. 'alt' stands for alternative, and the text inside the quotes will be displayed if your page is read by a web browser that doesn't display pictures. Many people turn off pictures to save time when they're web surfing, and they'll also see the text. If you don't use 'alt' people will either see a bare icon or the word "IMAGE" which won't give them much idea of what's happening.

The final parts of our first page aren't needed by some older web browsers, but you should always put them in, as newer browsers may be much fussier, and some won't even display your page at all without them.

So that new browsers know your document is a web page, your file must start with the <html> tag, and end with </html>. All the tags for your page must be between these two, and are divided into two sections - the 'head' and the 'body.' The head is used to give information including the name of the page, and the body is the page itself. The simplest page you could write might look something like this:

<html>
<head>
<title>This is a test page</title>
</head>
<body>
This is the text to appear on the page
</body>
</html>

Since web browsers format your page automatically, you don't need to have spaces between tags - you could put the whole page on one long line - but it's good practice to leave plenty of blank lines so that you can read the file easily.