The title element
Name:
Date:
Class:
A
Quick Questions
Shade in the A or B circle for each question.
1. Where must the <title> element be placed?
2. Where does the title text appear?
3. True or false: a page can have two <title> elements.
4. Which of these correctly places a title in the document?
5. True or false: you can put HTML tags like <b> inside a <title> element.
B
Match the Pairs
Draw a line connecting each item on the left to its match on the right.
| Left column | Right column | |
|---|---|---|
| 1<title>My Portfolio</title> | A<head><title>About Us</title></head> | |
| 2<head> <title>Shop</title> </head> | B<title> must contain plain text only - HTML tags like <b> inside <title> are not valid | |
| 3<title> must be placed inside <head>, not <body> | C<title> is correctly placed inside <head> where it sets the browser tab text | |
| 4<title> contains plain text only - no nested HTML tags allowed inside it | DSets the text shown in the browser tab to 'My Portfolio' | |
| 5<body> <title>Home</title> </body> | E<title>Welcome to My Blog</title> | |
| 6<title>My <b>Page</b></title> | F<title> is inside <body> - it must be inside <head> instead |
C
Definitions
<title>
D
Fill in the Blanks
Complete each line of code by filling in the missing parts.
1.
<head>
<___>My Page</title>
</head>
2.
<head>
<title>Home</___>
</head>
3.
<!DOCTYPE html>
<html>
<___>
<title>Shop</title>
</head>
</html>
4.
<head>
<title>Portfolio</___>
</head>
5.
<!DOCTYPE html>
<html>
<head>
<___>Blog</title>
</head>
<body></body>
</html>
E
Spot the Error
Shade in the letter of the line that contains an error.
Question 1
A
<title>My Site</title>
B
<meta charset="UTF-8">
C
</head>
Question 2
A
<head>
B
<titel>My Page</titel>
C
<meta charset="UTF-8">
D
</head>
Question 3
A
<head>
B
<meta charset="UTF-8">
C
<title>My Blog<title>
D
</head>
Question 4
A
<!DOCTYPE html>
B
<html>
C
<head></head>
D
<body>
E
<title>Store</title>
F
</body>
Question 5
A
<head>
B
<meta charset="UTF-8">
C
<title>News</title>
D
<title>Latest</title>
E
</head>
Answer Key
The title element
Section A: Quick Questions
Q1
B — Inside <head>
Q2
A — In the browser tab
Q3
A — False
Q4
A — <head><title>My Page</title></head>
Q5
B — False
Section B: Match the Pairs
Q1
<title>My Portfolio</title> → Sets the text shown in the browser tab to 'My Portfolio'
Q2
<head>
<title>Shop</title>
</head> → <title> is correctly placed inside <head> where it sets the browser tab text
Q3
<title> must be placed inside <head>, not <body> → <head><title>About Us</title></head>
Q4
<title> contains plain text only - no nested HTML tags allowed inside it → <title>Welcome to My Blog</title>
Q5
<body>
<title>Home</title>
</body> → <title> is inside <body> - it must be inside <head> instead
Q6
<title>My <b>Page</b></title> → <title> must contain plain text only - HTML tags like <b> inside <title> are not valid
Section C: Definitions
Q1
<title> — An HTML element placed inside <head> that sets the text shown in the browser tab. Its content is not displayed on the page.Section D: Fill in the Blanks
Q1
<head>
<title>My Page</title>
</head>Q2
<head>
<title>Home</title>
</head>Q3
<!DOCTYPE html>
<html>
<head>
<title>Shop</title>
</head>
</html>Q4
<head>
<title>Portfolio</title>
</head>Q5
<!DOCTYPE html>
<html>
<head>
<title>Blog</title>
</head>
<body></body>
</html>Section E: Spot the Error
Q1
A — The <title> element must be inside a <head> element. Here <head> is missing - <title> cannot appear outside it.
Q2
B — <titel> is a misspelling. The correct element name is <title> - browsers will not recognise <titel> as the page title.
Q3
C — The title element is closed with <title> instead of </title>. A closing tag must have a forward slash: </title>.
Q4
E — <title> must be inside <head>, not inside <body>. Content in <body> is visible on the page; <title> sets the browser tab text.
Q5
D — A page should have exactly one <title> element. Having two <title> tags is invalid - only one title can be shown in the browser tab.