mcpField
M
markdown-accessibility

markdown-accessibility

github.com/community-accessドキュメント429209 回インストール今日更新
リポジトリ

markdown-accessibility について

Markdown のアクセシビリティ監査を行うエージェントや指示向けの再利用可能な知識モジュールです。9 分野を対象に、重大度評価、パターン集、修正テンプレートを備えています。

主な機能

  1. 019 分野の Markdown アクセシビリティ問題に対応
  2. 02重大度に基づく問題評価
  3. 03パターン集と修正テンプレート
  4. 04絵文字の処理モード
  5. 05Mermaid と ASCII 図の説明テンプレート
  6. 06GitHub アンカー生成ルール

活用シーン

  1. 01リンク、代替テキスト、見出し階層の監査
  2. 02表や図のアクセシビリティ評価
  3. 03選択したモードに沿った絵文字の処理
  4. 04アンカー検証とダッシュの正規化

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/community-access/accessibility-agents --skill markdown-accessibility

インストール後、Claude Code で/markdown-accessibilityを入力して読み込まれたか確認します。

詳細

Markdown アクセシビリティスキル

markdown-a11y-assistant、markdown-scanner、markdown-fixer エージェント、および常時有効な markdown-accessibility 指示で再利用できるナレッジモジュールです。9 つの領域にわたる包括的な Markdown アクセシビリティ監査のため、パターンライブラリ、重大度スコアリング、修正テンプレート、絵文字の翻訳マップ、図の説明テンプレート、GitHub アンカー生成ルールを提供します。

対象領域

  1. 説明的なリンク(WCAG 2.4.4)- 曖昧なリンクテキスト、URL のみのリンク、同じテキストの繰り返し
  2. 画像の代替テキスト(WCAG 1.1.1)- 代替テキストの欠落、空の代替テキスト、ファイル名を代替テキストに使用、汎用プレースホルダー
  3. 見出しの階層(WCAG 1.3.1 / 2.4.6)- レベルの飛ばし、複数の H1、見出しとしての太字テキスト
  4. テーブルのアクセシビリティ(WCAG 1.3.1)- 説明の欠落、空のヘッダー、レイアウトテーブル
  5. 絵文字(WCAG 1.3.3 / 認知)- すべて削除、装飾的なもののみ削除、翻訳、または変更しないモード
  6. Mermaid と ASCII の図(WCAG 1.1.1 / 1.3.1)- アクセシブルなテキストと折りたたみ可能なソースに置き換え
  7. エムダッシュ / エヌダッシュの正規化(認知)- - に正規化するか、変更しない
  8. アンカーリンクの検証(WCAG 2.4.4)- #anchor リンクを実際の見出しと照合して検証
  9. 平易な言葉とリスト構造(認知)- 箇条書きでの絵文字、受動態、文の長さ

重大度スコアリング

問題重大度WCAG自動修正?
画像の代替テキストの欠落Critical1.1.1 (A)いいえ - 視覚的な判断が必要
テキストによる代替がない Mermaid 図Critical1.1.1 (A)一部可能 - 単純な図は自動で説明、複雑な図には人による対応が必要
テキストによる説明がない ASCII 図Critical1.1.1 (A)一部可能 - フラグを付けて囲む。説明には人による対応または自動生成が必要
壊れたアンカーリンクSerious2.4.4 (A)いいえ - どちらを変更するか確認が必要
曖昧なリンクテキスト(「こちら」、「ここをクリック」)Serious2.4.4 (A)はい - 周囲の文脈を使って書き換え
見出しレベルの飛ばしSerious1.3.1 (A)はい - 欠けているレベルを補間
複数の H1Serious1.3.1 (A)はい - 最初のもの以外をすべて下位レベルに変更
見出し内の絵文字Moderate認知はい - 設定に応じて削除または翻訳
連続する絵文字(2 個以上)Moderate1.3.3 (A)はい - 連続した絵文字を削除または翻訳
箇条書きとして使われている絵文字Moderate1.3.1 (A)はい - - に置き換え
本文中のエムダッシュModerate認知はい - - に置き換え
直前に説明がないテーブルModerate1.3.1 (A)はい - 1 文の要約を追加
見出しとして使われている太字テキストMinor2.4.6 (AA)はい - 適切な見出しに変換
本文中の URL のみのリンクMinor2.4.4 (A)はい - 説明的なテキストで囲む
意味を伝えるために使われている単独のインライン絵文字Minor1.3.3 (A)条件付き - すべて削除の場合:はい、装飾的なもののみ削除の場合:フラグを付ける、翻訳の場合:翻訳
スコアリング式
File Score = 100 - (sum of weighted findings)

Critical: -15 pts each
Serious:  - 7 pts each
Moderate: - 3 pts each
Minor:    - 1 pt each

Floor: 0
スコアの評価
スコア評価意味
90-100A優秀 - アクセシブルなドキュメント
75-89B良好 - 軽微な問題
50-74C要改善 - 複数の障壁あり
25-49D不十分 - 重大な障壁あり
0-24F不合格 - AT にとって重大な障壁あり

絵文字の処理モード

エージェントは4つのモードに対応しています。有効なモードは、適用範囲内で最も近い markdown-accessibility.instructions.md ファイルによって決まります。モードを指定する指示ファイルがない場合、デフォルトは remove-decorative です。

このリポジトリ: このリポジトリの .github/instructions/markdown-accessibility.instructions.md ファイルでは、モードが remove-all に設定されています。絵文字はすべて削除し、翻訳しません。これはスキルのデフォルト設定より優先されます。

モード説明デフォルト?
remove-all本文、見出し、箇条書きから絵文字をすべて削除します。前後のプレーンテキストの意味は保ちます。いいえ(リポジトリの設定で指定)
remove-decorative見出し、箇条書き、連続した絵文字を削除し、文中に単独で使われている絵文字は確認用に記録しますスキルのデフォルト(上書き設定なし)
translate既知の絵文字を (English) のテキストに置き換え、未知の絵文字は確認用に記録しますいいえ
leave-unchanged絵文字を記録も変更もしませんいいえ

モードの解決順序:

  1. エージェントのシステムプロンプト、またはタスクごとの明示的なモード指定
  2. 適用範囲内で最も近い *.instructions.md ファイル(例:.github/instructions/markdown-accessibility.instructions.md)
  3. スキルのデフォルト(remove-decorative)
絵文字の翻訳マップ

translate モードでは、各絵文字を対応する英語表現を括弧で囲んだテキストに置き換えます。

絵文字翻訳絵文字翻訳
🚀(Launch)✅(Done)
⚠️(Warning)❌(Error)
📝(Note)💡(Tip)
🔧(Configuration)📚(Documentation)
🎯(Goal)✨(New)
🔍(Search)🛠️(Tools)
👋(Hello)🎉(Celebration)
⭐(Featured)💬(Discussion)
🏠(Home)📊(Data)
🔒(Security)🌐(Web)
📦(Package)🔗(Link)
📋(Checklist)🏆(Achievement)
⚡(Quick)👍(Approved)
👎(Rejected)🐛(Bug)
🤝(Collaboration)🎓(Learning)
🔑(Key)📌(Pinned)
ℹ️(Info)🔄(Refresh)
➕(Add)➖(Remove)
💻(Code)🔔(Notification)
📣(Announcement)🧪(Test)
🎨(Design)🌟(Highlight)
📈(Increase)📉(Decrease)
🏗️(Build)🔐(Locked)
📂(Folder)📁(Folder)
🗂️(Category)🗃️(Archive)
⚙️(Settings)🏁(Finish)
🚧(In Progress)🚫(Not Allowed)
✔️(Check)➡️(Next)
⬆️(Up)⬇️(Down)

この表にない絵文字には、needs-human-review のフラグを付けます。推測してはいけません。

絵文字検出の Unicode 範囲
[\u{1F600}-\u{1F64F}]  - Emoticons
[\u{1F300}-\u{1F5FF}]  - Misc symbols and pictographs
[\u{1F680}-\u{1F6FF}]  - Transport and map symbols
[\u{1F700}-\u{1F77F}]  - Alchemical symbols
[\u{1F780}-\u{1F7FF}]  - Geometric shapes extended
[\u{1F900}-\u{1F9FF}]  - Supplemental symbols
[\u{1FA70}-\u{1FAFF}]  - Symbols and pictographs extended
[\u{2600}-\u{26FF}]    - Misc symbols
[\u{2700}-\u{27BF}]    - Dingbats
[\u{1F1E0}-\u{1F1FF}]  - Flags
[\u{FE00}-\u{FE0F}]    - Variation selectors

絵文字を箇条書きに使用するパターン:リスト項目の最初の空白以外の文字が絵文字である場合。

パターンライブラリ:Mermaid と ASCII の図

Mermaid の検出

```mermaid に一致する行(先頭にスペースやタブがあっても可)。

Mermaid の説明テンプレート
種類説明テンプレート
graph TD/LR/RL/BT / flowchart"次の[方向]図は、次の内容を示しています:[ソースから主要なノードと接続を列挙]"
sequenceDiagram"次のシーケンス図は、[参加者]間のやり取りを示しています:[各メッセージを順番に列挙]"
classDiagram"次のクラス図は、[N]個のクラスを示しています:[クラス名、主要なプロパティ、関係を列挙]"
erDiagram"次のエンティティ関係図は、[エンティティ]と次の関係を示しています:[関係を列挙]"
gantt"次のガントチャートは、プロジェクトのタスクを示しています:[セクション名と、利用可能な場合は日付を含むタスクを列挙]"
pie"次の円グラフは、[タイトル]と値を示しています:[利用可能な場合は各ラベルと割合/値を列挙]"
stateDiagram"次の状態図は、[N]個の状態を示しています:[状態名と遷移のトリガーを列挙]"
mindmap"次のマインドマップは、[ルートトピック]とブランチを示しています:[最上位のブランチ名を列挙]"
timeline"次のタイムラインは、イベントを示しています:[イベントを時系列順に列挙]"

説明を自動生成する対象:graph、flowchart、pie、gantt、mindmap、timeline。

人によるレビュー対象:sequenceDiagram、classDiagram、erDiagram、stateDiagram(人による確認が必要なほど複雑)。

Mermaid の置換テンプレート
[Generated or user-provided text description - this is the primary accessible content]

<details>
<summary>Diagram source (Mermaid)</summary>

```mermaid
[original diagram source - unchanged]
```text

</details>
ASCII 図の検出

ASCII アートのパターン:+、-、|、/、\、>、<、^、v、*を組み合わせて視覚的な構造を形成する、コードブロック外の行(または名前のないコードブロック)。列の配置に一貫性があり、最低3行で構成されるもの。

ASCII 図の置換テンプレート
[Generated or user-provided text description - this is the primary accessible content]

<details>
<summary>ASCII diagram</summary>

[元のASCIIアート - 変更なし]


</details>

パターンライブラリ:曖昧なリンクの検出

次のパターンに一致するもの(大文字と小文字を区別せず、前後の空白を除去):

完全一致の違反
here, click here, read more, learn more, more, more info,
link, details, info, go, see more, continue, start, download,
view, open, submit, this, that
前方一致の違反
click here to ..., read more about ..., learn more about ...,
here to ..., see more ...
URLをテキストとして使用するパターン

表示テキストがhttps?://またはwww\.に一致するリンク。

同一テキストの繰り返し

同じページに、Xが同一でURLが異なる[X](url1)と[X](url2)が複数ある場合。

安全なパターン(検出しない)
  • バッジリンク:READMEの先頭にある[![text](img)](url)
  • セクションへの自己参照:テキストが見出しと一致する[Installation](#installation)
  • リソース/ツール名をテキストとして使用するフッターのリソース一覧

パターンライブラリ:GitHub のアンカー生成

GitHub は次のルールに従って見出しをアンカー ID に変換します。

  1. 文字列全体を小文字にする
  2. 次の文字以外をすべて削除する:英字(a-z)、数字(0-9)、スペース、ハイフン
  3. スペースをハイフンに置き換える
  4. 先頭と末尾のハイフンを削除する
例
見出しアンカー
# Getting Started#getting-started
## API: v2.0 Reference#api-v20-reference
### What's New?#whats-new
## C# and .NET Support#c-and-net-support
## Step 1: Installation#step-1-installation
## FAQ (Frequently Asked Questions)#faq-frequently-asked-questions
## 🚀 Quick Start#-quick-start(絵文字は空文字になり、結果が異なる場合があります)

絵文字を含む見出しの場合:GitHub は絵文字の文字を除去し、残りのテキストからアンカーを生成します。絵文字を含む見出しを参照するアンカーは不安定なため、検出対象としてください。

パターンライブラリ:絵文字の検出

正規表現による検出用の Unicode 絵文字範囲:

[\u{1F600}-\u{1F64F}]  # Emoticons
[\u{1F300}-\u{1F5FF}]  # Misc symbols and pictographs
[\u{1F680}-\u{1F6FF}]  # Transport and map symbols
[\u{1F700}-\u{1F77F}]  # Alchemical symbols
[\u{1F780}-\u{1F7FF}]  # Geometric shapes extended
[\u{1F800}-\u{1F8FF}]  # Supplemental arrows-C
[\u{1F900}-\u{1F9FF}]  # Supplemental symbols and pictographs
[\u{1FA00}-\u{1FA6F}]  # Chess symbols
[\u{1FA70}-\u{1FAFF}]  # Symbols and pictographs extended-A
[\u{2600}-\u{26FF}]    # Misc symbols
[\u{2700}-\u{27BF}]    # Dingbats
[\u{FE00}-\u{FE0F}]    # Variation selectors
[\u{1F1E0}-\u{1F1FF}]  # Flags

箇条書きとしての絵文字のパターン:空白以外で最初の文字が絵文字であるリスト項目。

パターンライブラリ:エムダッシュとエンダッシュ

検出パターン:

—           Unicode em-dash (U+2014)
–           Unicode en-dash (U+2013)
---         Three hyphens in prose (not on its own line as HR)
--          Two hyphens in prose (used as em-dash substitute)

スキップしても安全(変更しない):

  • ---のみを含む行(水平線)
  • ```コードフェンス内のコンテンツ
  • バッククォートで囲まれたインラインコード内のコンテンツ
  • YAML フロントマターのブロック
  • HTML コメントブロック ``

置換:-(スペース + ハイフン + スペース)

数値範囲内のエンダッシュ:2–4 hours -> 2 - 4 hours

パターンライブラリ:Mermaid 図

検出方法: ```mermaid に一致する行(先頭の空白やタブは任意)

図の種類と説明のガイダンス:

種類説明テンプレート
graph TD/LR/RL/BT「次の図は [方向] のフローチャートです:[主なノードと接続の一覧]」
sequenceDiagram「次のシーケンス図は、[参加者] 間のやり取りを示しています:[メッセージのやり取りの一覧]」
classDiagram「次のクラス図は [N] 個のクラスを示しています:[クラス名と主要な関係の一覧]」
erDiagram「次のエンティティ関係図は、[エンティティ] とその関係を示しています:[関係の一覧]」
gantt「次のガントチャートは、プロジェクトの各フェーズを示しています:[タスクと期間の一覧]」
pie「次の円グラフは、[タイトル] と値を示しています:[利用可能な場合は、各セグメント名と値の一覧]」
stateDiagram「次の状態図は [N] 個の状態と遷移を示しています:[状態と遷移のトリガーの一覧]」

ラッピングテンプレート:

[Generated or user-provided text description]

<details>
<summary>Diagram source (Mermaid)</summary>

```mermaid
[original diagram source]
```text

</details>

修正テンプレート

曖昧なリンクの修正
# Before
For more information, see [here](https://example.com/guide).

# After
For more information, see the [installation guide](https://example.com/guide).
絵文字付き箇条書きの修正
# Before
- 🚀 Deploy to production
- ✅ Run tests

# After
- Deploy to production
- Run tests
絵文字付き見出しの修正
# Before
## 🔧 Configuration

# After
## Configuration
エムダッシュの修正
# Before
The agent—when invoked—will scan all files.

# After
The agent - when invoked - will scan all files.
表の説明の修正
# Before
| Rule | Severity | Auto-fix |
|------|----------|----------|

# After
The following table lists rules with their severity level and whether they can be fixed automatically.

| Rule | Severity | Auto-fix |
|------|----------|----------|
壊れたアンカーの修正
# Before (broken)
See [Installation](#instalation) for setup steps.

# Heading in file
## Installation

# After (corrected)
See [Installation](#installation) for setup steps.

Markdownlint ルールリファレンス

ルール名前アクセシビリティとの関連性
MD001heading-increment見出しの階層構造(WCAG 1.3.1)
MD022blanks-around-headingsパースの信頼性
MD024no-duplicate-headingセクションの識別性(WCAG 2.4.6)
MD025single-title / single-h1ドキュメントごとに H1 を 1 つにする
MD033no-inline-htmlパーサーから構造が隠れる可能性があります
MD034no-bare-urls曖昧なリンク(WCAG 2.4.4)
MD041first-line-headingドキュメントの構造
MD055table-pipe-style表のパースの一貫性
MD056table-column-count表の構造的完全性

コマンド:npx --yes markdownlint-cli2 <filepath>

コメント