

Web Content
Unit 11 Summary - part 2

HTML



1. Copy this coding to your notepad/text editor.
2. Change the extension to HTML (set your computer so you can see extensions)
3. Open the file with a web browser
4. Read my thoughts about my late dogs.
<!DOCTYPE HTML>
<html>
<head>
<title> My Dogs </title>
<style>
h1 {
color: white;
background-color:pink;
font-family: Arial, Helvetica, sans-serif;
font-size: 28pt;
text-align:center
}
h2 {
background-color:purple;
color:white;
text-align:center
}
h3 {
background-color:grey;
color:white;
text-align:center
}
p {
color:purple;
text-align:left;
}
</style>
</head>
<body>
<h1>MY DOGS</h1>
<h2>Sayori and Goldie</h2>
<h3>What I remember about my late dogs</h3>
<img src="https://live.staticflickr.com/65535/51901135451_f4ea32f26e_o.jpg">
<p>Drawn by Dalia and Wissam Emu Sher Et</p>
<p>Dogs are the <span style="color:green"><strong>ONLY THING</strong></span> in the world that can love you, more than they love themselves</p>
<p>In 2017-2019, I was asked to bring my dogs to my old school. I realized children and adults <span style="color:red">judge</span> dogs differently.</p>
<ul>
<li>Adults judge dogs based on their coat colour. They loved Goldie because she was <b>chubbier, cuter</b>, and had <em>lighter coat colour</em>. What they didn't see was that Goldie didn't like strangers or children.</li>
<li>Children judge dogs based on the dogs' behaviour. Children loved Sayori because she <b>loved being pet, loved being taken here and there</b>, and she <strong>looked happy being carried by children</strong> eventhough she had </em>darker coat and not as cute as Goldie</em>.</li>
</ul>
<p>To put it simple</p>
<ul>
<li>Sayori was able to guard my house, more aware of humans' emotions (she tried to cheer me up when I was crying) and loved children. Unfortunately she killed small animals such as mice and chickens, and baby snakes (I love animals, so this is not okay).</li>
<li>Goldie was able to cry for attention, made cute faces to make dog haters quit hating dogs, made funny noises to make me laugh every day. Unfortunately, she avoided strangers so she wasn't able to guard my house.</li>
</ul>
<p>How my dogs <strong>amazed</strong> me</p>
<ol>
<li>When I looked at my dogs eating, I was surprised that they<b>trusted</b> me.</l>
<li>I hit my dogs when I was young and stupid. when I looked at them, I was amazed how they could <em>love me</em> and <em>forgive me</em>.</li>
<p>Both my dogs passed away, due to sickness and old age. I miss them</p>
</ol>
<br>
<p>The image was really my dogs drawn by Dalia and Wissam. You can go to their website here:</p>
<a href="https://emusheret6.artstation.com/">Sam K.</a>
<p>You can also see their comic here, the link opens in a new window:</p>
<a href="https://www.artstation.com/marketplace/p/jBqN/wild-embers-graphic-novel-chapter-1" target="_blank">Wild Embers</a>
<p>This is their patreon, the link opens in a new window</p>
<a href="https://www.patreon.com/EmuSherEt" target="_blank">Emu Sher Et</a>
<p>His instagram link below opens in a new window</p>
<a href="https://www.instagram.com/emusheret6/" target="_blank">Emu Sher Et</a>
</body>
</html>
How to use a notepad to code HTML
-
Create a new NOTEPAD/Text editor file.
-
Type your coding, and save it.
-
Change the extension of that file into .html (for Windows, open setting-folder setting-view-uncheck the hide extensions-click OK)
-
Double click the file to open it in a web browser.

Block VS Inline



Oxford AQA IGCSE 2019

09.
Figure 7 shows a web page displayed in a web browser window.
Some labels have been added to Figure 7 to explain how it is set out.
The web page has been written using HTML only.
No CSS has been used.
Figure 7


09.1.
The HTML code used to produce the web page is shown below.
Some code has been missed out.
Fill in the gaps to complete the HTML code. [5 marks]
<html>
<______________>
<title>Red Wood School</title>
<______________>
<body>
<______________>Latest News<______________>
<p>Trip to <______________>London<______________> has been cancelled.</p>
<p>Location of house assemblies:</p>
<______________>
<li>Hulme – Dining Hall</li>
<li>Moreton - Library</li>
<______________>
<p>Contact Miss Batey to join gardening club.</p>
</body>
<______________>
09.2.
The web page is to be changed so that ‘Miss Batey’ appears in purple text in the font Arial.
This will be achieved by using a CSS style rule.
The HTML code for the line in the web page that includes ‘Miss Batey’ has been changed to:
<p>Contact <span class="highlight">Miss Batey</span> to join gardening club.</p>
Complete the CSS rule below to change the colour and font of the text. [2 marks]
.highlight { _____________:purple; _________________:Arial}

Oxford AQA IGCSE 2020

14.1
The HTML used to produce a web page is shown in Figure 4.
Figure 4

In the box below show how the HTML in Figure 4 will look when viewed in a web browser. You may use labels to make your layout clearer if necessary. [5 marks]


14.2
Describe an example of a task that might be carried out by a server-side scripting language. [1 mark]
__________________________________________________________________________________
14.3
Describe an example of a task that might be carried out by a client-side scripting language. [1 mark]
__________________________________________________________________________________

Oxford AQA IGCSE Mock

09.
Figure 6 shows a web page displayed in a web browser window.
Some labels have been added to Figure 6 to explain how it is set out.
The web page had been written in HTML only.
No CSS has been used.
Figure 6

09.1.
The HTML code used to produce the web page is shown below.
Some code has been missed out.
Fill in the gaps to complete the HTML code. [5 marks]
<html>
<head>
<title>Holly Vale School<______________>
</head>
<______________>
<______________>Computer Club<______________>
<p>Day: <______________>Monday<______________></p>
<p>Activities Available</p>
<______________>
<li>Robot Building</li>
<li>Programming in Python</li>
<______________>
<p>See Miss Weaver for more details.</p>
<______________>
</html>

09.2.
The web page is to be changed so that “Miss Weaver” appears in red text on a
yellow background.
This will be achieved by using a CSS style rule.
The HTML code for the line in the web page that includes "Miss Weaver" has
been changed to:
<p>See <span class="redyeltext">Miss Weaver</span>for more details.</p>
Complete the CSS rule below to change the colour of the text and background.
[2 marks]
.redyeltext {_____________________________________________________________________}
09.3.
State two facilities that are available in HTML5 which were not available in earlier versions of HTML. [2 marks]
__________________________________________________________________________________

Oxford AQA IGCSE Specimen

12.
Figure 9 shows code used to create a simple web page.
Figure 9

12.1.
Sketch what the web page in Figure 9 will look like when displayed in a web browser. [3 marks]


12.2
A style rule is going to be added to the web page to change the colour of the text
in paragraphs to red, but there are mistakes in the style rule that has been
written.
paragraphs {colour = red}
Describe two errors that have been made in the style rule. [2 marks]
__________________________________________________________________________________

