# Accessibility Ally > アクセシビリティ（a11y）を向上させ、誰もが使えるアプリにするためのスキル Use when this capability is needed. - Skill: `tomevault-io/accessibility-ally` (Agent Skill, multi-file: 2 files) - Install (CLI): `npx skillmds@latest add tomevault-io/accessibility-ally` - Raw SKILL.md: https://api.skillmd.com/api/skills/tomevault-io/accessibility-ally/raw - Safety review: pending (external: skill-scanner PASS, skillspector PASS) - Works with: Claude Code, Claude.ai, OpenAI Codex - Category: Web & Frontend - Author: tomevault-io (https://skillmd.com/u/tomevault-io) - Updated: 2026-09-17 - Page: https://skillmd.com/skills/tomevault-io/accessibility-ally --- # Accessibility Ally Skill このスキルは、アプリケーションを「誰にとっても使いやすく」するためのガイドです。 スクリーンリーダー対応、キーボード操作性、配色のコントラストなど、アクセシビリティ（a11y）の観点からコードを診断します。 ## 主な機能 1. **Semantic HTML Check (セマンティックチェック)** - 適切な HTML タグが使われているか検証します（例: クリック可能な要素は `div` ではなく `button` や `a`）。 - 画像に `alt` 属性があるか、フォーム要素にラベル（`label` / `aria-label`）が紐付いているかを確認します。 2. **Keyboard Navigation (キーボード操作)** - マウスを使わずに Tab キーや矢印キーだけで操作可能かどうかの観点でコードを見直します。 - フォーカス順序（`tabIndex`）が論理的か、フォーカスインジケータ（`outline`）が消されていないかを確認します。 3. **Visual Accessibility (視覚的アクセシビリティ)** - 文字色と背景色のコントラスト比が WCAG 基準（AA/AAA）を満たしているか推測・確認します。 - 色情報だけに頼った表現（例: 「赤色のボタンを押して」）がないかチェックします。 ## 使用例 - 「アクセシビリティチェックをして」 - 「キーボードで操作できるようにしたい」 - 「スクリーンリーダーでどう読み上げられるか確認して」 ## 検証ツール・コマンド例 - `eslint-plugin-jsx-a11y` のルール準拠確認 (`pnpm lint`) - ブラウザの開発者ツール（Lighthouse, Axe）での診断推奨 --- > Converted and distributed by [TomeVault](https://tomevault.io/claim/hdkz-dev) — claim your Tome and manage your conversions.