What is semantic HTML and why is it important for UI design and accessibility?

• A. Using divs for all content to control layout.
• B. Using proper HTML elements to convey meaning; improves accessibility and SEO.
• C. Using only CSS for styling.
• D. Using deprecated HTML tags for compatibility.

Answer: (B)

Semantic HTML means using elements that describe the content’s purpose, not just how it looks. Elements like header, nav, main, article, section, aside, and footer, along with proper heading and list tags, provide a meaningful structure that tells browsers, screen readers, and other tools what each part does. This helps with UI design by giving you a clear, consistent outline to style and interact with, so you can rely on a predictable layout across devices. For accessibility, assistive technologies expose these landmarks and the document hierarchy, letting users quickly jump to navigation or main content and understand the relationships between sections through correct heading levels. It also benefits SEO, since search engines better understand the page structure and content relevance when semantic tags are used. Using generic containers for everything hides meaning and makes navigation harder for users who rely on assistive tech, while deprecated tags offer poor compatibility. In short, semantic HTML creates a accessible, maintainable, and search-friendly foundation for UI design.