BitWithBite
HTML Worksheet
🌐 Header & Footer
SCORE___ / 20
NameClassDate
After this worksheet you can
Site headers with logo and navFooters with links and copyrightHeaders inside articlesMultiple headers per page📚 Quick Recap
<header> and <footer> are the bookends of content. They can appear at the page level — wrapping the site-wide branding and copyright — or at the section/article level, giving each chunk of content its own introductory and closing metadata. Understanding this dual scope is the key to using them correctly.
🧠 Section A · Concept Check ● BEGINNER 4 × 1 = 4
1Page-top branding belongs in:
2Copyright lines belong in:
3header vs head:
4Can an article have its own header?
🧮 Section B · Problem Solving ● INTERMEDIATE 2 + 3×3 = 11
5<head> is metadata; <> is the visible banner.
6Footers often hold contact, links and .
7Write a header with site name + nav links.
8Write a footer with copyright 2026.
9head vs header in one line?
🚀 Section C · Challenge ● CHALLENGE 5
10What goes in an article's own footer?
💭 Reflection — the most useful thing I learned:
A ___/4 B ___/11 C ___/5 Total ___/20
Teacher's Signature
Parent's Signature
✂ answer key — fold or cut before handing out
1-A 2-A 3-A 4-A | 5 header 6 copyright 7 = <header><h1>Site</h1><nav>...links...</nav></header> 8 = <footer><p>© 2026 BitWithBite</p></footer> 9 = head = invisible metadata; header = visible top section | 10 = Author, date, tags, share links