mcpField
C
canvas-accessibility-auditor

canvas-accessibility-auditor

github.com/vishalsachdevテスト・品質308202 回インストール今日更新
リポジトリ

canvas-accessibility-auditor について

canvas-accessibility-auditorは、Canvasのラーニングデザイナー向けアクセシビリティ監査スキルです。コースをスキャンして問題を優先度別に整理し、修正を案内して再確認します。手動確認が必要な項目も示します。

主な機能

  1. 01ページと課題をスキャン
  2. 02代替テキストと見出しを確認
  3. 03表の見出しとリンク文言を点検
  4. 04問題を優先度別に整理
  5. 05修正後に再スキャン

活用シーン

  1. 01コース公開前にアクセシビリティを監査
  2. 02代替テキストのない画像を特定
  3. 03曖昧なリンク文言を改善
  4. 04ページ編集後のスキャン結果を確認

MCP 対応

接続済みのCanvas MCP サーバーが必要で、コンテンツのスキャン、ページの読み取りと編集、任意で機関のUFIXITレポート取得にツールを使います。ページ編集前にユーザーの確認が必要です。

インストール

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

$npx skills add https://github.com/vishalsachdev/canvas-mcp --skill canvas-accessibility-auditor

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

詳細

Canvas アクセシビリティ監査

ラーニングデザイナー向けのアクセシビリティ監査サイクル全体を提供します。コースコンテンツをスキャンし、優先順位を付けたレポートを作成し、修正可能な問題の解決を案内してから、再スキャンで修正を確認し、アクセシビリティレビューの概要を作成します。

前提条件

  • Canvas MCP サーバーが稼働し、接続されている必要があります。
  • 認証済みユーザーは、対象コースでインストラクター、TA、またはデザイナーのロールを持っている必要があります。
  • UFIXIT 連携を利用する場合、コースに UFIXIT レポートページ(所属機関のアクセシビリティツールで生成)が必要です。

手順

1. 対象コースを特定する

監査するコースをユーザーに尋ねます。コースコード、Canvas ID、またはコース名を受け付けます。

指定されていない場合は、次のように尋ねます。

アクセシビリティを監査するコースを教えてください。

2. コースコンテンツをスキャンする

可能であれば、次の2つのスキャンを並行して実行します。

スキャン A -- コンテンツの直接スキャン:

scan_course_content_accessibility(course_identifier, "pages,assignments")

すべてのページと課題の HTML を確認し、次の項目を検出します。

  • 代替テキストがない画像(WCAG 1.1.1、レベル A)
  • 空の見出し(WCAG 2.4.6、レベル AA)
  • ヘッダーがないテーブル(WCAG 1.3.1、レベル A)
  • 「ここをクリック」のような説明的でないリンクテキスト(WCAG 2.4.4、レベル A)

スキャン B -- UFIXIT レポート(利用可能な場合):

fetch_ufixit_report(course_identifier)

UFIXIT ページが存在する場合は、解析します。

parse_ufixit_violations(report_json)
3. 優先順位付きレポートを作成する

両方のスキャン結果をまとめます。UFIXIT データを使用する場合は、format_accessibility_summary を呼び出します。

問題を優先度順に提示します。

## Accessibility Audit: [Course Name]

### Summary
- Content scanned: 20 pages, 15 assignments
- Total issues: 12
- Auto-fixable: 8 | Manual review needed: 4

### Level A Violations (must fix)
1. **Missing alt text** -- 5 images across 3 pages
   - Page "Week 1 Overview": 2 images
   - Page "Lab Instructions": 2 images
   - Assignment "Final Project": 1 image

2. **Tables missing headers** -- 2 tables
   - Page "Grade Scale": 1 table
   - Page "Schedule": 1 table

3. **Non-descriptive links** -- 3 instances of "click here"
   - Page "Resources": 2 links
   - Page "Week 3 Overview": 1 link

### Level AA Violations (should fix)
4. **Empty headings** -- 2 empty heading elements
   - Page "Week 5 Notes": 1 empty h3
   - Page "Midterm Review": 1 empty h2

### Manual Review Required
- Color contrast: Cannot be checked automatically (requires visual inspection)
- Video captions: Cannot be verified via API (check in Canvas media player)
- PDF accessibility: Cannot be parsed via API (use Adobe Acrobat checker)
4. 修正を案内する

自動修正可能な問題ごとに、ユーザーに修正方法を案内します。

代替テキストがない場合:

  1. get_page_content(course_identifier, page_url) を呼び出して HTML を取得します
  2. alt 属性のない <img> タグを特定します
  3. ユーザーに代替テキストの説明を尋ねます(または、周囲の文脈に基づいて提案します)
  4. 修正した HTML を指定して edit_page_content(course_identifier, page_url, new_content) を呼び出します

説明的でないリンクの場合:

  1. ページのコンテンツを取得します
  2. 現在のリンクを表示します:<a href="...">click here</a>
  3. 説明的な置き換えを提案します:<a href="...">Download the syllabus (PDF)</a>
  4. ユーザーの承認後に修正を適用します

空の見出しの場合:

  1. ページのコンテンツを取得します
  2. 空の見出しを表示します
  3. 「この見出しを削除しますか、それともテキストを追加しますか?」と尋ねます
  4. 選択された修正を適用します

ヘッダーがないテーブルの場合:

  1. ページのコンテンツを取得します
  2. テーブルの構造を表示します
  3. 「どの行または列をヘッダーにしますか?」と尋ねます
  4. <td> 要素を <th> 要素に変換して適用します

ページを変更する前に、必ずユーザーに確認します。

5. 変更したページを再スキャンする

修正後、変更したページのみを再スキャンします。

scan_course_content_accessibility(course_identifier, "pages")

次のように報告します:「12件中8件を修正しました。残り4件は手動レビューが必要です。」

6. アクセシビリティレビューの概要を作成する

関係者への報告に適した最終概要を作成します。

## Accessibility Review Summary

**Course:** [Course Name]
**Audit Date:** [date]
**Auditor:** AI-assisted audit via Canvas MCP

### Results
- Total content items scanned: 35
- Automated issues found: 12
- Issues remediated: 8
- Issues requiring manual review: 4
- Automated WCAG-oriented checks: Partial pass (manual review items remain)

### Remediation Actions Taken
- Added alt text to 5 images
- Fixed 3 non-descriptive links
- Removed 2 empty headings

### Outstanding Items
- Color contrast review needed (pages with colored text)
- Video caption verification (embedded videos)
- PDF accessibility check (uploaded PDFs)

### Recommendation
Course content meets automated WCAG 2.1 Level A criteria after remediation.
Manual review of color contrast and multimedia is recommended before publishing.

使用する MCP ツール

ツール目的
scan_course_content_accessibilityページと課題をスキャンして WCAG の問題を検出する
fetch_ufixit_report所属機関の UFIXIT レポートを取得する
parse_ufixit_violationsレポートから構造化された違反情報を抽出する
format_accessibility_summary違反情報を読みやすいレポートに整形する
get_page_content修正のためにページの HTML を取得する
edit_page_contentページにアクセシビリティの修正を適用する
list_courses利用可能なコースを検索する

例

ユーザー:「CS 101 のアクセシビリティ監査を実行してください」

**エージェント:**すべてのコンテンツをスキャンし、優先順位付きレポートを作成します。

ユーザー:「代替テキストがない問題を修正してください」

**エージェント:**該当する各ページを取得し、代替テキストの説明を尋ねて修正を適用し、再スキャンします。

制限事項

  • **確認できない項目:**色のコントラスト、動画の字幕、PDF のアクセシビリティ、音声解説、キーボード操作
  • これらの項目はすべてのレポートで「手動レビューが必要」として示されます
  • **修正はページ単位です。**各修正には、ページ全体のコンテンツを読み取り、書き込むサイクルが必要です
  • **元に戻せません。**API によるページ編集では Canvas のリビジョン履歴が作成されないため、一括修正の前にページをバックアップしてください

メモ

  • 学期開始前の包括的なレビューには、canvas-course-qc と組み合わせると効果的です。
  • 大規模なコンテンツ更新やコースのインポート後に実行してください。
  • UFIXIT との連携には、所属機関に UDOIT/UFIXIT がインストールされている必要があります。

コメント