← Semantic tags lesson New set →

HTML Worksheet: Semantic Tags

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

Answer key

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

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