boat

Timed Review

50 minute challenge

Web Design - Timed Challenge

You are a web designer. Today you are going to try to make a webpage for a Tourism Company.

The company needs a homepage called orkney.html.

To complete this activity, you will need these files:

Task

This a 50 minute challenge. Stay focussed. Communicate effectively with your team. Don't give up. Don't get distracted!

Follow these steps.

1. Get organised

First, let's set up a project folder. Create a new folder called Orkneyin your Web Design folder:

2. File organisation

Create a new file in your text editor and save as orkney.html in your Orkney project folder.

Download the 3 images and save them in your project folder.

Your project folder should now look like this:

 

3. Basic Structure

In your orkney.html file, type the basic structure of every web page on planet Earth:

4. The title

Use <h1> tags to put the text The Orkney Islands at the of the web page.

5. First image

Use the <img/> tag to insert the image orkneyHeader.jpg under the title.

6. Text block #1

Use <p> tags to place the following text under the image.

Make each sentence a new paragraph.

7. Second image

Use the <img/> tag to insert the image orkneyVillage.jpg under the text.

8. Text block #2

Use <p> tags to place the following text under orkneyVillage.jpg.

Make each sentence a new paragraph.

9. Third image

Use the <img/> tag to insert the image orkneyIsland1.jpg under the text.

10. Text block #3

Use <p> tags to place the following text under orkneyIsland1.jpg

Make each sentence a new paragraph.

11. Find these words

Find these words and use tags to make them bold, italic or underlined:

  • Mainland
  • lantern
  • lighthouse
  • lochs
  • parapet

12. Apply the following styles to elements in your webpage.

element style name style value
<h1> color: red;
<h1> font-size: 48px;
<p> color: blue;
<p> font-family: palatino linotype;
<img> border: green 2px solid;
<img> border-radius: 10px;
<body> background: #f0f0f0;

13. Map

Use Google Maps to find Orkney. Create a nice screenshot and save it with a .jpg or .png file extension in your project folder. Give the image file an appropriate name.

Use the <img/> tag to put the map at the bottom of the webpage.

Submission

Well done! You have created a webpage for a Tourism Company. Submit your project folder as instructed.

Tags

browser file tags body save h1 html bold italic structure refresh underlined organisedfolder