BitWithBite
Full-Stack Worksheet
📝 Headings, Lists & Links
SCORE___ / 20
NameClassDate
After this worksheet you can
Use h1-h6 correctlyChoose ul vs olWrite anchor tagsLink between pages📚 Quick Recap
🎯 What you'll practice: Heading hierarchy, unordered/ordered lists, and hyperlinks.
🧠 Section A · Concept Check ● BEGINNER 4 × 1 = 4
1How many h1 elements should a page have?
2A numbered list uses:
3The attribute that opens a link in a new tab is:
4Every list item must be wrapped in:
🧮 Section B · Problem Solving ● INTERMEDIATE 2 + 3×3 = 11
5The tag used for a hyperlink is <>.
6An unordered list uses the <> tag.
7Write a 3-item ordered list of your favourite hobbies.
8Why should you never skip from h1 straight to h4 just to get smaller text?
9Write a link to "about.html" with the text "About Us".
🚀 Section C · Challenge ● CHALLENGE 5
10A screen reader user navigates a page by heading level. Explain how skipping heading levels for visual styling breaks that experience, and what the correct fix is.
💭 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-B 2-B 3-C 4-B | 5 = a 6 = ul 7 = <ol><li>Reading</li><li>Coding</li><li>Cycling</li></ol> (any 3 valid hobbies) 8 = Heading levels form the page's semantic outline used by screen readers and search engines — skipping levels for a smaller font breaks that outline; use CSS to change size instead 9 = <a href="about.html">About Us</a> | 10 = Screen readers let users jump between headings to navigate; if levels are skipped or used only for visual size, the outline becomes inaccurate and confusing — the fix is to use correct heading order and style font size with CSS instead of choosing a heading level for its default size.