skills/zackkorman/skills/web-design-guidelines-4

web-design-guidelines-4

SKILL.md

Web Interface Guidelines

  • Icon-only buttons need aria-label
  • Form controls need <label> or aria-label
  • Interactive elements need keyboard handlers (onKeyDown/onKeyUp)
  • <button> for actions, <a>/<Link> for navigation (not <div onClick>)
  • Images need alt (or alt="" if decorative)
  • Decorative icons need aria-hidden="true"
  • Async updates (toasts, validation) need aria-live="polite"
  • Use semantic HTML (<button>, <a>, <label>, <table>) before ARIA
  • Headings hierarchical <h1>–<h6>; include skip link for main content
  • scroll-margin-top on heading anchors
Weekly Installs
2
GitHub Stars
15
First Seen
Feb 27, 2026
Installed on
opencode2
gemini-cli2
codebuddy2
github-copilot2
codex2
kimi-cli2