Skills
.Work. You
Rest

semantic-html

Community

Create accessible, semantic HTML.

Design & Creative#accessibility#semantic HTML#web standards#landmarks#markup review#heading hierarchy
Authorschalkneethling
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Markup often lacks proper semantics and accessible structure, causing reduced accessibility and maintenance challenges. This skill promotes native HTML semantics to improve accessibility, readability, and long-term resilience of web content.

Core Features & Use Cases

  • Landmark-first planning to outline page structure and improve navigation for assistive technologies.
  • Emphasis on native HTML elements over ARIA where appropriate, with guidance for headings, forms, tables, and sections.
  • Practical guidance for reviewing components, pages, and markup in real projects to ensure semantic correctness.

Quick Start

  • Review the provided HTML snippet and convert it to semantic markup with proper landmarks, heading hierarchy, and accessible labeling.

Dependency Matrix

Required Modules

None required

Components

references

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: semantic-html
Download link: https://github.com/schalkneethling/webdev-agent-skills/archive/main.zip#semantic-html

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.