• Objective: 

This lesson is provided to explain how to add graphics and control their size on a page. 

•  Viewing web pages with pictures and graphics is usually much more interesting than just reading words. One of the best ways of making your page appreciated is to include pictures and other graphics.

  There is one basic html tag for an image or picture and it is: <img src="___________.___"> Where the tag words tell the browser that there is an image to display and the two underlines tell the browser which graphic or image to display. The first underline space above is the file name and the second is the extension. The extension is most often "jpg" or "gif" since these are the image files preferred by most browsers.

  There are additional tags used for images. An image tag can limit the size of the image and how it appears on the screen by using a percentage or by using pixels. My experience is that only limiting the width of the image is more practical. I would generally create a tag to display an image of a specific by typing the following: <img src="_________.___" width=300>. This tag tells the browser that the image will not be larger that 300 pixels across. I could choose to include a height=### that would control how high the image appears on the screen. If I choose to do this, I take the chance of displaying the image "out of proportion" and it looks strange on the computer screen.

  Special note: The image you expect to display must be saved where the browser can find it. Usually this is in the same folder with your htm file.

Find a page with an image and view the source code of that page. How much information is provided to the browser in the tag for the image. Write down the complete tag on a sheet of paper and keep it for reference.

   Another Special note: An easy way to get a graphic or image is to right click on the image and do a "Save picture as." If you do this, remember to save the image file in your space on the server or computer.

Assignment: Create a web page using html code that has one image, headling, and a brief description of the image. Show this page to your teacher to receive credit.