← Semantic tags lesson New set →

HTML Worksheet: Semantic Tags

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

Answer key

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

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