# Structured Artifact > Load when building a static HTML artifact — single page or multi-page site — to make structured information explorable through layout and navigation. - Skill: `haowjy/structured-artifact` (Agent Skill, multi-file: 12 files) - Install (CLI): `npx skillmds@latest add haowjy/structured-artifact` - Raw SKILL.md: https://api.skillmd.com/api/skills/haowjy/structured-artifact/raw - Safety review: pending - Works with: Claude Code, Claude.ai, OpenAI Codex - Category: Web & Frontend - Author: haowjy (https://skillmd.com/u/haowjy) - Updated: 2026-09-09 - Page: https://skillmd.com/skills/haowjy/structured-artifact --- # Structured Artifact A structured artifact is plain HTML that opens from `file://` and works on a phone. Load `/information-hierarchy` first — it decides what each page shows and in what order; this skill builds it. ## One page or several Start from one `index.html`. Its first viewport carries the answer, and depth discloses in place — `

`, popovers, a collapsible detail panel. Grow into a folder (`index.html` + child pages + `shared.css`) when readers need whole pages per branch: the index becomes a map with links, and each child page stands alone with its own lede. `resources/multi-page-site.md` has the folder mechanics. ## Build so it keeps working Everything ships static — plain `