← Semantic tags lesson New set →

HTML Worksheet: Semantic Tags

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

Answer key

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

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