Pictures

Create folder for images

In Notepad, go to File>Open... and create a new folder:

Call the folder "images".

When you click off or Enter to accept the folder name, click on the "Cancel" button.

Find & Save PIctures

Find 2 pictures for each page. Save them to your website's "images" folder. Rename them properly (one word, adding the "1" or "2").

  • Picture 1 = smaller, vertical/square, at least 250 px width
  • Picture 2 - bigger, horizontal/wide, at least 500 px width

Insert Pictures

You are going to insert picture 1 (the vertical/square one) after the H2 and before the paragraph. 

Picture #1

To add a picture to the page, you have to add an IMG tag with the file source (subfolder/filename.filetype). File types:  jpg, png, bmp, gif. 

If your picture shows up, align it to the right, set the width to "200" and give it a border of "2" and horizontal and vertical space around the photo of 10 pixels using hspace and vspace attributes.

Picture #2

To put in the second/bigger picture, go after the closing UL list tag and before the green comment tag at the bottom. Add the IMG tag and give it the source/name. Inside the IMG tag add width="500"and give it a border of 2 pixels. Then add CENTER tags around it.

You can copy the code to the other pages and then just change the name of the image in the src attribute.

When you're done, all your pages should have the tall/square pic to the right of the paragraph/list, and a wider/horizontal pic centered after the list.


You don't have to get it checked, but it might be a good idea to get the teacher to look it over, give you feedback if you need to change/fix anything.