Webit Why bother? Help Make a website now
Step 1 Step 2 Step 3 Step 4

Adding images

You can include images on your site with this tag: <img></img>

Image tags follow the same format as other HTML tags, with an opening and closing tag, the < and > signs and the slash in the closing tag. However, the <img> tag doesn't have anything between the two parts (You are not applying images to anything - you're just putting them in the page). Then you just need to tell the browser where to find the image, which you can do like this:

<img src="images/my_big_idea.jpeg"></img>

We've just added some extra information to the opening tag telling the browser to look in the images folder for a jpeg called 'my_big_idea.jpeg'. src stands for source - in other words, the source of the image is at that address. src is one attribute that the <img> tag can have. You can include others, e.g.:

<html>
  <body>
    <h1>
     Hello, I've just had a really big idea!
    </h1>
    <p>
     Here's a picture of it: 
    </p>
    <img src="images/my_big_idea.jpeg" 
         style="width:100px; 
                height:100px; 
                border: 2px solid red;">
    </img>
  </body>
</html>

You can keep working on the same file. Just make the changes, save the file with the same name and reload it in your web browser to see the effect. Lets see what it looks like:

Screenshot
View this HTML file

Animation

You can include simple animations on your pages in the same way you would an image by using the normal image tag with an animated GIF. An animated GIF is just like a normal GIF, except it has several frames all contained in one file. When it appears on the page, the browser loops through all the frames creating an animated effect. This is how most of the advertising banners you see on websites are made.

Introduction to web animations with links to animation resources:
http://www.webgenies.co.uk/add_animation1.htm

For more in depth information on web animation, how it works, how to create animated GIFs, as well as links to other animation sites:
http://computer.howstuffworks.com/web-animation.htm