SHAREPOINT J22-31 MODIFIED

You have been supplied with the following source files:

j31balloon.csv
j31balloon.jpg
j31balloon.mp4
j31banner.jpg
j31kenya.htm
j31maasai.jpg
j31serengeti.jpg
j31stylesheet.css
j31tables.csv
j31tanzania.htm
j31text.txt

Task 1 – Evidence Document

Create a new word-processed document.

Make sure your name, centre number and candidate number will appear on every page of this
document.

Save this Evidence Document in your work area as j2231evidence_ followed by your centre number_
candidate number, for example, j2231evidence_ZZ999_9999

You will need your Evidence Document during the examination to place screenshots when required.
 Task 2 – Image Editing and File Management

1 Create a new folder called j2231mod

Locate the following files and store them in your j2231mod folder.

j31balloon.jpg
j31balloon.mp4
j31banner.jpg
j31kenya.htm
j31maasai.jpg
j31serengeti.jpg
j31stylesheet.css
j31tanzania.htm
j31text.txt

Open the file j31balloon.jpg in a graphics package. Edit the image by:

• rotating it 90 degrees clockwise

• reflecting (flipping) it horizontally.

Save this new image in your j2231mod folder, in .png format, using the file name balloon_
followed by your candidate number, for example, balloon_9999

• Crop the image from the left so it becomes 600 pixels wide

• Crop the image from top and bottom so it becomes 1500 pixels high

• Resize the image to make it 200 pixels wide maintaining aspect ratio

Save this image in your folder in .png format with the filename logo

Display the contents of your j2231mod folder showing the folder name, all file names, file
extensions, file sizes, image dimensions and, for the video, the frame height and frame width.

Take a screenshot of this folder making sure that the required information is clearly visible.
Place this screenshot in your Evidence Document.

EVIDENCE 1
A screenshot of your j2231 folder with the required information clearly visible.
 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 tbs.htm

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]

5 Place into the appropriate section of the correct web development layer:
• meta data to define the character set to UTF-8
• meta data to include your name as the author of the web page
• meta data to set the keywords to Kenya, Tanzania, Safari
6 Place in cell:

• A the image j31banner.jpg

• 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 j31serengeti.jpg
• F the image j31maasai.jpg
[9]

7 Place inline style attributes into the HTML so that each image, with its aspect ratio maintained, fits
the width of the table cell. [1]

8 Add appropriate alternate text to all still images. [1]

9 Place in cell D the text from the file j31text.txt

Set this text as style h2

[2]

10 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.

Click here to return to the top of the page

Display the text you have entered as three paragraphs.

[4]
Set all text in cell G as style h3

11 Create a hyperlink from the image j31maasai.jpg to open the web page j31kenya.htm [2]

12 Create a hyperlink from the banner image to open the web page www.TBS.com in a new window
called _tawara

13 Insert a bookmark above the table

In the text Click here to return to the top of the page make only the words Click here a hyperlink to
the bookmark

14 Create a hyperlink from the image j31serengeti.jpg to open the web page j31tanzania.htm in the
browser window that is currently in use. [3]

15 Rename the stylesheet j31stylesheet.css 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]
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.

16 Open and edit the stylesheet you saved in step 15 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 background for the webpage to have the image logo.png placed:
• only once
• in the top right corner
• in a fixed position so that it will not scroll with the web page
• with a width of 200 pixels
• with a height of 150 pixels

Set the font for styles h1, h2, h3 and paragraph 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 the table width to 90% of the browser window

Set all text in the tables to be centre aligned horizontally and vertically

Left align all tables.

Set all table cell padding to 10 pixels.

Set all table borders and gridlines to be:

• visible
• separated
• solid
• black
• 2 pixel wide external border and 1 pixel wide internal border

Set the spaces between the borders of all table elements to 10 pixels.

Create a class called Nav with font colour blue no red no green and font size 14 pt

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.

EVIDENCE 2
A screenshot of your stylesheet with the required information clearly visible.
17 Open the webpage tbs.htm
In cell G use the class called Nav to set the font of the text Kenya and Tanzania

18 Save your web page.

Display your web page in a browser. If necessary resize it so that:

• all the page can be seen

• all text can be easily read
• the address bar is visible.

Take screenshot evidence showing your web page in the browser. Place this in your Evidence
Document.

EVIDENCE 3
Screenshot evidence of your web page in the browser with the table contents and background
elements clearly visible.

Take a copy of the HTML source and place this in your Evidence Document.
[1]

EVIDENCE 4
A copy of your HTML source.

Task 4 – Printing the Evidence Document

Save and print your Evidence Document.

PRINTOUT 1
Make sure your name, centre number and candidate number appear on every page of your
Evidence Document.