← Semantic tags lesson New set →

HTML Worksheet: Semantic Tags

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

Answer key

  1. True
  2. not semantic
  3. holds a side box of tips
  4. screen-reader users
  5. holds the menu of links
  6. holds a news story
  7. True
  8. semantic
  9. is the page’s key part
  10. False
  11. semantic
  12. it tells its meaning
  13. semantic
  14. holds one blog post
  15. one
  16. <aside>
  17. sits at the bottom
  18. <header>
  19. <aside>
  20. <footer>
  21. semantic
  22. <nav>
  23. <article>
  24. <header>
  25. False
  26. <nav>
  27. <article>
  28. True
  29. <nav>
  30. <header>
  31. <main>
  32. <header>
  33. semantic
  34. False
  35. True
  36. <main>
  37. semantic
  38. holds copyright notes
  39. False
  40. <main>

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