Semantic Elements — HTML Technical Interview Questions & Answers

header, nav, article, section, aside, footer explained.

Semantic Elements

  • Semantic Elements (html5) is a HTML topic. In plain words you use it for a blog article in a public site. Don’t start with a slogan — start with that picture.
  • Smallest example: header / main / article. Type it, run it, and say what you see. If you can do that from memory, you know Semantic Elements (html5).
  • From the example next to this theory: header, nav, article, section, aside, footer explained.
  • Trap: div soup for everything. Fix that before you talk about advanced HTML.
  • Viva: what is Semantic Elements (html5)? Then show header / main / article. Then name the trap.

Technical Interview Tip: What is Semantic Elements (html5)? Show this: header / main / article. Trap: div soup for everything.

Code Examples for Semantic Elements

Semantic Elements — working example

<header>
  <nav aria-label="Primary"><a href="/">Home</a></nav>
</header>
<main>
  <article>
    <h1>Interview tip</h1>
    <p>Prefer semantic tags over empty divs when meaning exists.</p>
  </article>
  <aside>
    <p>Related: practice aloud for 30 seconds.</p>
  </aside>
</main>
<footer>© GoCareerGo</footer>

Semantic Elements — semantic tags describe meaning — better SEO/a11y than only div/span layout shells.

How to Explain Semantic Elements to an Interviewer

What is Semantic Elements (html5)?

Used for a blog article a public site Not just the heading

Give one small example of Semantic Elements (html5).

header / main / article header, nav, article, section, aside, footer explained

What mistake do beginners make with Semantic Elements (html5)?

div soup for everything Show the fix

Where do you use Semantic Elements (html5)?

a public site a blog article