HTML Yr 9 Coding Worksheet
Instructions:
Answer the following questions and complete the practical Coding tasks. Write your
answers in the spaces provided.
Part 1: Theory Questions
1. What is HTML and why is it used in web development?
Answer: HTML stands for[Hypertext Markup Language]. It is the standard markup
language used for creating the structure and content of web pages
2. Write the basic structure of an HTML document.
Answer:
<!DOCTYPE html>
<html>
<head>
<style>
</style>
</head>
<body>
</body>
</html>
3. How do you create a hyperlink in HTML? Provide an example.
Answer: by using: <a href="url">link text</a>
E.g.<a href="[Link] [Link]!</a>
4. What are the different types of lists in HTML? Provide examples of an ordered and
unordered list.
Answer:Unordered, ordered, list item, description list.
E.g. unordered HTML list: ordered HTML list:
Item 1. First
5. How do you add an image to a webpage in HTML? Include the alt attribute in your
example.
Answer: by using: <img src="url" alt="alternatetext">
E.g. <img src="img_girl.jpg" alt="Girl in a jacket">
6. How do you create a table in HTML with a header row and three data rows?
Answer:
<table>
<tr>
<th> </th>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
</table>
7. Explain the purpose of the <head> and <body> sections in an HTML document.
Answer: the head is to contain metadata, and the body is to contain the information
to be displayed on the web page
8. What is the purpose of the <meta> tag in HTML? Please provide an example of its
use.
Answer: specify character set, page description, keywords, author of the document,
and viewport settings.
Define a description of your web page:
<meta name="description" content="Free Web tutorials for HTML and CSS">
9. How do you include an external CSS file in an HTML document? Provide an example.
Answer: Including <link rel="stylesheet" href="name"> in the head section
e.g. <link rel="stylesheet" href="[Link]">
10. What are semantic HTML elements? Provide examples and explain their importance.
Answer: A semantic element clearly describes its meaning to both the browser and the
developer, and it becomes easier to read and understand.
e.g. <form>, <table>, and <article>
Instructions:
Answer the following questions and complete the practical coding tasks. Paste your HTML
code in the spaces provided.
Part 2: Practical Coding Challenges
11. Create a simple webpage with a paragraph and an image.
Answer:
<!DOCTYPE html>
<html>
<body>
<p> Hello this is an image</p>
< img src="[Link]" alt="hot dog”>
</body>
</html>
12. Develop an HTML table displaying the following data: Name, Age, and Grade for
three students. Create a dummy details for the three students.
Answer:
<!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
border:1px solid black
</style>
</head>
<body>
<table>
<tr>
<th>Name</th>
<th>Age</th>
<th>Grade</th>
</tr>
<tr>
<td>Peter</td>
<td>May</td>
<td>Pat</td>
</tr>
<tr>
<td>12</td>
<td>12</td>
<td>11</td>
</tr>
<tr>
<td>6</td>
<td>6</td>
<td>5</td>
</tr>
</table>
</body>
</html>
