← Semantic tags lesson New set →

HTML Worksheet: Semantic Tags

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

Answer key

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

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