← Semantic tags lesson New set →

HTML Worksheet: Semantic Tags

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

Answer key

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

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