Semantic HTML

Create accessible, semantic HTML for web content.

Skill Reference

semantic-html

Level Descriptors

Level 1 semantic-html

Uses basic semantic tags correctly (e.g., main, nav, article) instead of generic divs, and ensures images have appropriate alt attributes.

Associated courses:

Accessible HTML Foundations

Level 2 semantic-html

Structures forms with proper labels, applies correct heading hierarchies (H1-H6), and understands when to use button vs. anchor tags for keyboard navigation.

Associated courses:

Level 3 semantic-html

Implements advanced WAI-ARIA roles, states, and properties where native HTML falls short, ensuring complex UI components (like modals or tabs) are screen-reader accessible.

Associated courses:

Machine-Readable Taxonomy Design

Level 4 semantic-html

Audits existing codebases using automated tools (e.g., Axe, Lighthouse) and manual screen reader testing (NVDA, VoiceOver) to identify and remediate WCAG compliance failures.

Associated courses:

Machine-Readable Taxonomy Design

Level 5 semantic-html

Establishes organization-wide accessibility guidelines, authors reusable accessible component libraries, and mentors engineering teams on inclusive design patterns.