4
Task 3 – Web Page
You are going to create a web page for Tawara Balloon Safaris. The web page and stylesheet must
work in any browser. Make sure that your stylesheet contains no HTML. Make sure your HTML and
stylesheet are as efficient as possible.
2 Create, in your j2231 folder, a web page called [Link]
This web page must be created using a single table and must work in all browsers. The table must
fit 90% of the width and height of the browser window. The table must have a structure as shown
in this diagram:
A Width = 70% B Width = 30%
C Width = 70%
D Height = 10%
E Width = 35% F Width = 35%
G Height = 10%
Each table cell is identified with a letter. Some dimensions are shown. These must be set as
percentage values. Do not set the height of cells A, B, C, E or F.
The cell contents shown in the diagram must not appear on your final web page.
Table borders must appear on the final web page.
[8]
3 Set the title of the web page to Tawara Balloon Safaris [1]
4 Set, in the HTML, the name of the default target window to _new [1]
© UCLES 2022 0417/31/M/J/22
5
5 Place in cell:
• A the image [Link]
• B the balloon image saved in step 1
• C a video tag to display j31balloon.mp4 so that it fits the width of this cell. Display an
automated text-based error message if the browser does not support this video type
• E the image [Link]
• F the image [Link]
[9]
6 Place inline style attributes into the HTML so that each image, with its aspect ratio maintained, fits
the width of the table cell. [1]
7 Add appropriate alternate text to all still images. [1]
8 Place in cell D the text from the file [Link]
Set this text as style h2
[2]
9 Enter in cell G the text:
Click on the images above to enjoy the wonders of Kenya and Tanzania.
Web page last edited by: followed by a space, your name, centre number and candidate number.
Display the text you have entered as two paragraphs.
Set all text in cell G as style h3
[4]
10 Create a hyperlink from the image [Link] to open the web page [Link] [2]
11 Create a hyperlink from the image [Link] to open the web page [Link] in the
browser window that is currently in use. [3]
12 Rename the stylesheet [Link] to j31stylesheet_ followed by your centre number_
candidate number, for example, j31stylesheet_ZZ999_9999
Make sure this stylesheet is still in cascading stylesheet file format.
Attach this stylesheet to your web page.
[2]
© UCLES 2022 0417/31/M/J/22 [Turn over
6
A trainee has attempted to create the stylesheet for this website. This file contains a number of errors
and omissions. All colour codes must be displayed in hexadecimal. Your stylesheet must not contain
HTML or scripting language.
13 Open and edit the stylesheet you saved in step 12 to meet the following specifications:
Set the background for the web page so that it has a colour with a:
• blue component of d2
• red component of 74
• green component of ab
Set the font for styles h1, h2 and h3 so that the browser selects and displays the font Times CY.
If this font is not available, the browser selects and displays the font Times New Roman. If
neither of these fonts are available, the browser must display its default serif font. Set the text in
styles h1, h2 and h3 to black.
Set style h1 so the text is centre aligned with a 16-point font.
Set style h2 so the text is fully justified with a 12-point font.
Set style h3 so the text is left aligned with a 10-point font.
Set each table margin individually to 5% of the width and height of the browser window.
Set all table cell padding to 10 pixels.
Set all table borders and gridlines to be:
• visible
• separated
• solid
• black
• 1 pixel wide.
Set the spaces between the borders of all table elements to 10 pixels.
Correct and edit the comment at the start of the stylesheet to contain your name, centre number
and candidate number.
Save this stylesheet in your j2231 folder.
Take a screenshot to show the file name and all contents of your stylesheet and place this in your
Evidence Document. Make sure the file name and all contents are clearly visible.
[27]
EVIDENCE 2
A screenshot of your stylesheet with the required information clearly visible.
© UCLES 2022 0417/31/M/J/22
