HTML & CSS interview question · Most asked
What is semantic HTML, and why does it matter?
Summary
Semantic HTML means choosing elements for the meaning of their content (header, nav, main, article, button, ul, table) instead of generic divs and spans. It gives browsers, search engines and assistive technology the page's structure for free.
Longer Answer
Screen-reader users navigate by landmarks (header, nav, main, aside, footer) and headings; search engines use the structure to understand content; native elements such as button and a bring keyboard support and correct roles without extra code. Semantic markup is also easier to read and maintain.
Key Points
- Elements chosen by meaning.
- Landmarks and headings for screen readers.
- Helps search engines.
- Built-in keyboard behaviour.
Deep dive: HTML5 for Beginners: Semantic HTML5: Header, Nav, Main and Footer
Explanation
What interviewers look for
Accessibility and SEO benefits with concrete examples.
Follow-up questions
- Which elements create landmarks?
- When is a div still appropriate?
More most-asked HTML & CSS questions
- What is ARIA, and what is the first rule of ARIA?
- What is HTML5, and how is it different from HTML 4?
- What is HTML?
- What is the alt attribute for, and what makes good alt text?
- What input types and validation attributes did HTML5 add?
- What is the difference between script, script async and script defer?
- Compare localStorage, sessionStorage and cookies.
- What does <!DOCTYPE html> do?