← Semantic tags lesson New set →

HTML Worksheet: Semantic Tags

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

Answer key

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

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