← Semantic tags lesson New set →

HTML Worksheet: Semantic Tags

HTML and CSS lesson 23: Semantic tags · Set 91 · 40 questions
TalentJR

Code tip (Say what it is): Top to bottom: <header> → <nav> → <main> → <footer>. <article> = a post or story; <aside> = a side box of extra notes. <div> and <span> are not semantic — they say nothing about meaning.

NameDateTime takenScore ___ / 40
  1. 1.🔢 On a typical page, from top to bottom, what comes right after “<main>”? (a) <footer> (b) <nav> (c) <header>
  2. 2.🧭 Is <span> semantic or not semantic? (a) semantic (b) not semantic
  3. 3.True or false: <aside> sits at the very top. (a) True (b) False
  4. 4.🧭 Which semantic tag holds a side box of tips? (a) <article> (b) <main> (c) <footer> (d) <aside>
  5. 5.🧭 Which semantic tag holds the main content? (a) <aside> (b) <header> (c) <nav> (d) <main>
  6. 6.🧭 Is <div> semantic or not semantic? (a) not semantic (b) semantic
  7. 7.Which of these is true of <article>? (a) holds the main content (b) holds the menu of links (c) helps you move around (d) holds a news story
  8. 8.Which of these is true of <nav>? (a) holds the menu of links (b) sits at the very top (c) is the page’s key part (d) holds a news story
  9. 9.🧭 Which semantic tag helps you move around? (a) <nav> (b) <aside> (c) <footer> (d) <main>
  10. 10.🧭 Is <article> semantic or not semantic? (a) not semantic (b) semantic
  11. 11.🔢 On a typical page, from top to bottom, which comes FIRST? (a) <footer> (b) <nav> (c) <main> (d) <header>
  12. 12.True or false: <header> sits at the very top. (a) True (b) False
  13. 13.Which of these is true of <aside>? (a) holds one blog post (b) holds copyright notes (c) holds a side box of tips (d) is the page’s key part
  14. 14.🧭 Which semantic tag holds extra side notes? (a) <main> (b) <aside> (c) <footer> (d) <header>
  15. 15.🔢 On a typical page, from top to bottom, which comes first: “<nav>” or “<header>”? (a) <nav> (b) <header>
  16. 16.🧭 How many <main> parts should a page have? (a) ten (b) one (c) none (d) three
  17. 17.🔢 On a typical page, from top to bottom, which comes LAST? (a) <nav> (b) <footer> (c) <main> (d) <header>
  18. 18.🔢 On a typical page, from top to bottom, which comes first: “<nav>” or “<main>”? (a) <nav> (b) <main>
  19. 19.🧭 Which semantic tag holds copyright notes? (a) <aside> (b) <main> (c) <footer> (d) <header>
  20. 20.🔢 On a typical page, from top to bottom, what comes right after “<nav>”? (a) <main> (b) <footer> (c) <header>
  21. 21.🧭 Which semantic tag sits at the very top? (a) <article> (b) <nav> (c) <header> (d) <footer>
  22. 22.True or false: <footer> holds extra side notes. (a) False (b) True
  23. 23.True or false: <aside> sits at the bottom. (a) True (b) False
  24. 24.🧭 Which semantic tag is the page’s key part? (a) <main> (b) <footer> (c) <nav> (d) <aside>
  25. 25.True or false: <main> holds extra side notes. (a) True (b) False
  26. 26.🧭 Who is helped most by semantic tags? (a) nobody (b) only the printer (c) only the server (d) screen-reader users
  27. 27.🧭 Why use <nav> instead of <div> for a menu? (a) it loads faster (b) it adds pictures (c) it tells its meaning (d) it makes text red
  28. 28.True or false: <main> holds the main content. (a) False (b) True
  29. 29.🧭 Which semantic tag holds the logo and title? (a) <nav> (b) <header> (c) <main> (d) <article>
  30. 30.🧭 Is <footer> semantic or not semantic? (a) not semantic (b) semantic
  31. 31.Which of these is true of <nav>? (a) holds copyright notes (b) sits at the very top (c) sits at the bottom (d) helps you move around
  32. 32.Which of these is true of <header>? (a) holds a news story (b) holds the main content (c) holds the logo and title (d) holds a side box of tips
  33. 33.Which of these is true of <header>? (a) is the page’s key part (b) helps you move around (c) sits at the very top (d) holds a side box of tips
  34. 34.🧭 Is <header> semantic or not semantic? (a) semantic (b) not semantic
  35. 35.True or false: <footer> holds copyright notes. (a) False (b) True
  36. 36.True or false: <footer> sits at the bottom. (a) True (b) False
  37. 37.True or false: <nav> helps you move around. (a) False (b) True
  38. 38.True or false: <nav> holds a news story. (a) False (b) True
  39. 39.🧭 Is <section> semantic or not semantic? (a) not semantic (b) semantic
  40. 40.Which of these is true of <footer>? (a) holds one blog post (b) holds the main content (c) sits at the bottom (d) sits at the very top

Answer key

  1. <footer>
  2. not semantic
  3. False
  4. <aside>
  5. <main>
  6. not semantic
  7. holds a news story
  8. holds the menu of links
  9. <nav>
  10. semantic
  11. <header>
  12. True
  13. holds a side box of tips
  14. <aside>
  15. <header>
  16. one
  17. <footer>
  18. <nav>
  19. <footer>
  20. <main>
  21. <header>
  22. False
  23. False
  24. <main>
  25. False
  26. screen-reader users
  27. it tells its meaning
  28. True
  29. <header>
  30. semantic
  31. helps you move around
  32. holds the logo and title
  33. sits at the very top
  34. semantic
  35. True
  36. True
  37. True
  38. False
  39. semantic
  40. sits at the bottom

Free html and css lessons, practice and worksheets at talentjr.in/html-css-for-kids