The document skeleton (DOCTYPE, html, head, body)

Tip: Choose Save as PDF in the print dialog to download. Use A4 paper size.

The document skeleton (DOCTYPE, html, head, body)

Name:
Date:
Class:
A

Quick Questions

Shade in the A or B circle for each question.

1. Which line must appear first in every HTML file?
A <!DOCTYPE html>
B <html>
2. Where does visible content like headings and paragraphs go?
A Inside <head>
B Inside <body>
3. True or false: <head> must come before <body> in the HTML skeleton.
A True
B False
4. Which tag wraps the entire HTML document - both head and body?
A <body>
B <html>
5. True or false: the <title> element belongs inside <body>.
A False
B True
B

Match the Pairs

Draw a line connecting each item on the left to its match on the right.

Left columnRight column
1<!DOCTYPE html> AMissing the exclamation mark - the correct declaration is <!DOCTYPE html>
2<body> <h1>Hello</h1> </body> B<head> <title>My Page</title> </head>
3<head> holds metadata - its content is not visible on the page C<html> <head></head> <body></body> </html>
4<html> is the root element - it wraps the entire document including head and body DThe mandatory first line of every HTML file - tells the browser this is a modern HTML document
5<DOCTYPE html> EThe element that holds all visible page content - everything the user sees in the browser window
6<html> <body></body> <head></head> </html> FWrong order - <head> must always appear before <body> inside <html>
C

Definitions

<!DOCTYPE html>
D

Fill in the Blanks

Complete each line of code by filling in the missing parts.

1.
<!___ html> <html> </html>
2.
<!DOCTYPE html> <___> </html>
3.
<!DOCTYPE html> <html> <___> </head> </html>
4.
<!DOCTYPE html> <html> <head></head> <___> </body> </html>
5.
<!DOCTYPE html> <html> <head> <title>My Site</title> </head> <body> </___> </html>
E

Spot the Error

Shade in the letter of the line that contains an error.

Question 1
A <DOCTYPE html>
B <html>
C <head></head>
D <body></body>
E </html>
Question 2
A <!DOCTYPE html>
B <html
C <head></head>
D <body></body>
E </html>
Question 3
A <!DOCTYPE html>
B <html>
C <body>
D <head></head>
E </html>
Question 4
A <!DOCTYPE html>
B <html>
C <head>
D <h1>My Title</h1>
E </head>
F <body></body>
Question 5
A <!DOCTYPE html>
B <html>
C <head></head>
D <body></body>
E <html>

Answer Key

The document skeleton (DOCTYPE, html, head, body)
Section A: Quick Questions
Q1
A — <!DOCTYPE html>
Q2
B — Inside <body>
Q3
A — True
Q4
B — <html>
Q5
A — False
Section B: Match the Pairs
Q1
<!DOCTYPE html> → The mandatory first line of every HTML file - tells the browser this is a modern HTML document
Q2
<body> <h1>Hello</h1> </body> → The element that holds all visible page content - everything the user sees in the browser window
Q3
<head> holds metadata - its content is not visible on the page → <head> <title>My Page</title> </head>
Q4
<html> is the root element - it wraps the entire document including head and body → <html> <head></head> <body></body> </html>
Q5
<DOCTYPE html> → Missing the exclamation mark - the correct declaration is <!DOCTYPE html>
Q6
<html> <body></body> <head></head> </html> → Wrong order - <head> must always appear before <body> inside <html>
Section C: Definitions
Q1
<!DOCTYPE html> — The declaration that must appear on the very first line of every HTML file, telling the browser the document uses modern HTML.
Section D: Fill in the Blanks
Q1
<!DOCTYPE html> <html> </html>
Q2
<!DOCTYPE html> <html> </html>
Q3
<!DOCTYPE html> <html> <head> </head> </html>
Q4
<!DOCTYPE html> <html> <head></head> <body> </body> </html>
Q5
<!DOCTYPE html> <html> <head> <title>My Site</title> </head> <body> </body> </html>
Section E: Spot the Error
Q1
A — The DOCTYPE declaration must start with an exclamation mark: <!DOCTYPE html>. Writing <DOCTYPE html> is missing the ! and is invalid.
Q2
B — The <html> opening tag is missing its closing angle bracket >. It should be <html>, not <html without the >.
Q3
C — The <body> tag appears before <head>, but the correct skeleton order is <head> first, then <body>, both nested inside <html>.
Q4
D — Visible content like <h1> belongs inside <body>, not <head>. The <head> section holds metadata such as <title>, not displayed content.
Q5
E — The closing html tag must be </html> with a forward slash. Writing <html> again opens a new element instead of closing the existing one.