← Semantic tags lesson New set →

HTML Worksheet: Semantic Tags

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

Answer key

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

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