AgentSkillsCN

applying-a11y-standards

Tourly 应用中确保无障碍访问（a11y）的各项规则。用于构建包容性界面。

SKILL.md
--- frontmatter
name: applying-a11y-standards
description: Rules for ensuring Accessibility (a11y) across the Tourly app. Use to build inclusive interfaces.

Accessibility Standards (a11y)

When to use this skill

  • •Every time you create a new component or page.
  • •During UI audits.

Best Practices

  • •Semantic HTML: Use <main>, <header>, <footer>, <nav>, and appropriate heading levels.
  • •ARIA Labels: Use aria-label for icon-only buttons.
  • •Keyboard Nav: Ensure all interactive elements have a visible :focus-visible state.
  • •Contrast: Maintain a text-to-background contrast ratio of at least 4.5:1.

Instructions

  • •Tools: Use the axe-core library or Lighthouse to run automated audits.
  • •Alt Text: Every Image must have a descriptive alt attribute.