← Semantic tags lesson New set →

HTML Worksheet: Semantic Tags

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

Answer key

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

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