This is another really simple technique. What you will need is a digital image on your computer. Take it to the file that your computer stuff is in (copy and paste). If you have a nice camera, then it is likely that your image will be very large. It is a good idea to reduce the size.
Open Gimp Image Editor and open the picture's file (open, search through your file hierarchy, and click "open"). Click "Image" go down to "Scale Image", click it, and change the image to something like 200px width. You can play around with this, depending on what you are planning and need the image for.
If you really don't have any pictures on your computer, perhaps you can get one by ding a Print Screen (Usually there is a button on your keyboard that says something like "Print Scrn"). Otherwise simply make a drawing freehand in Gimp.
Save your picture to the same place that your main html file is.
Now the majic:
<img src="myfathusband.jpg" />
Where "myfathusband.jpg" is the name of your file, as it stands in the folder. If you re-name your image, the html will no longer find it. It needs to be exactly the same.
Alright, that's all you need to know to get the image into your page. However, you should do one other thing, add an 'alt' attribute.
<img src="myfathusband.jpg" alt="My Love" />
If you want to get it from another site, you can, JUST DON'T PLAGIARIZE...ie, don't steal other people's pictures. You are welcome to use any of mine, provided you link back to the site you got it from. My Flickr page is the best to do that from. Click the image below to go to the Flickr page.
In order to put an image file like that into your page you do this:
<img src="http://farm3.static.flickr.com/2445/3936274721_ea1fb3d2e1.jpg" alt="Drill Bit" />
There is a whole host of things we can do with images. For now at least you know how to get them in there. We will get to styling them and doing different things with images when we get into CSS and scripting later on.
There are a whole bunch of file formats for images. Most of the time you are going to deal with jpg, png and gif on your web pages. Be careful of very heavy file formats...pictures become very heavy and make your page load slowly.
In the next section we are going to talk about lists and how to arrange them in HTML. Lists are often used for styling elements, so it's good to get the basics down before moving on to using them with CSS later on.
