1. はじめに

Accessibility Checkerは、ナビゲーションバーのセグメントコントロールで切り替えられる3つのツールを中心に構成されています。

  • Audit（監査） — ウェブページに対してaxe-coreによる自動スキャンを実行し、検出されたすべてのWCAG問題を確認します。
  • Contrast（コントラスト） — ページ、画像、カメラのライブ映像上の任意の2点間の色コントラストを測定します。
  • Focus Order（フォーカス順序） — キーボードのフォーカス（タブ）順序をページ上に重ねて表示し、問題を視覚的に発見します。（iPhoneではこのセグメントはFocusと表示されます。）

まず、テスト対象をアプリに読み込みます。初回起動時にソースを選択するよう求められます。以降は右上のソースを変更ボタン（プラス付きのアプリアイコン）をタップして、次のいずれかを選びます。

  • Web URL — 任意のアドレスを入力して、実際のウェブサイトを読み込みます。URLバーに直接入力することもできます（「監査するURLを入力」）。
  • Camera — 写真を撮影してチェックします。
  • Gallery — 写真ライブラリからスクリーンショットや画像を読み込みます。
  • Live — カメラのライブ映像で、実世界の画面や印刷物などをリアルタイムにチェックします。

3つのツールはすべてウェブページで利用できます。画像、写真、カメラのライブ映像はContrastツールでチェックします。左上の歯車アイコンから設定を開き、URLバーの隣にある「•••」メニューには「戻る」「進む」「再読み込み」「レポートを作成」が用意されています。

プライバシー・バイ・デザイン：すべての処理はデバイス上で実行されます。チェックしたサイト、画像、色があなたのスマートフォンの外に出ることはありません。

2. WCAGの自動監査を実行する

Auditツールは、読み込んだページに対してaxe-coreを実行します。これは、プロのアクセシビリティチームが使用しているのと同じ業界標準のエンジンです。

  1. ページを読み込みます（URLを入力し、読み込みが完了するまで待ちます）。
  2. Auditセグメントを選択します。エンジンの処理中は「監査を準備中…」、続いて「監査を実行中…」と表示されます。
  3. 結果は自動的に開き、タイトルに合計件数がResults (N)として表示されます。

結果の読み方

問題は重大度別にグループ化され — 致命的・深刻・中程度・軽微 — 最も深刻なものから表示されます。重大度をタップすると問題のカテゴリが表示され、カテゴリをタップすると影響を受ける各要素を1つずつ確認できます。各問題には、対象セレクタ、関連するHTML、わかりやすい説明、そしてルールを解説してページ上の該当要素をハイライトする「詳細情報」リンクが表示されます。問題のないページでは「Congrats! No issues found.（問題は見つかりませんでした）」と表示されます。

監査結果を共有する

結果画面の「共有」ボタンをタップすると、次の形式で書き出せます。

  • 監査レポート（PDF） — 自動レポートのフローを開きます（第5章を参照）。
  • サマリー（テキスト） — 重大度別の件数と主な問題をまとめた簡潔な要約です。
  • すべての検出結果（テキスト） — 問題ごとの完全な一覧です。
  • スプレッドシート（CSV） — Excel、Numbers、スクリプトでの仕分けに使える機械可読な書き出しです。
設定で監査を調整：スキャンに使用するaxe-coreのバージョンを選択できます。また「監査の検出結果」を「違反のみ」と「要確認項目を含む」で切り替えると、axeが人間の判断を必要とすると判定した項目も表示できます。

3. キーボードのフォーカス順序をマッピングする 新機能

キーボードや多くのスクリーンリーダーの利用者は、Tabキーでページを移動します。フォーカスの順序が不自然に飛び回ると、そのページはWCAG 2.4.3（フォーカス順序）に適合しません。これまで、この項目はデスクトップと専門ツールなしにはテストしづらいものでした。新しいFocus Orderツールは、順序全体をページ上に描画します。

  1. ウェブページを読み込みます。
  2. Focus Orderセグメントを選択します。アプリがページを解析する間、ページが暗くなります（「フォーカス順序を計算中」）。
  3. オーバーレイが表示されます。番号付きのドットが1から順にフォーカス可能なすべての要素を示し、接続線がキーボード利用者のたどる正確な経路を描きます。パネルには合計数が表示されます（例：「14 tab stops（14個のタブストップ）」）。
  4. 番号付きのドットをタップすると、その要素の詳細カードが開きます。ロール、アクセシブルな名前、ARIAラベル、タブインデックス、CSSセレクタ、元となるHTMLなど、正確なバグ報告に必要な情報がすべて含まれています。

注目すべきポイント

  • 視覚的なレイアウトに反するジャンプ — たとえば、ナビゲーションからフッターへ飛び、また本文へ戻るようなフォーカスの動きです。
  • 操作可能なページで結果がゼロ — アプリが次のように知らせます。「このページに表示されているボタンやリンクがあるなら、それ自体がアクセシビリティの不備である可能性があります（WCAG 2.1.1）。」
  • ヒューリスティックな警告 — パネルは、無限スクロール（さらに下のストップが欠けている可能性があります）や固定要素（スクロール中にマーカーがずれる可能性があります）を検出して知らせます。

マップを書き出す

Focus Orderパネルの「書き出し」ボタンをタップし、「ページ全体を画像で」または「ページ全体をPDFで」を選びます。書き出しでは、表示されている画面だけでなくページ全体を、番号付きオーバーレイをそのままに取り込みます。チケット、デザインレビュー、監査レポートにそのまま貼り付けられます。ページが変化した後は「再実行」ボタンで再スキャンできます。

自分好みにカスタマイズ：「設定」→ Focus Orderでは、オーバーレイの配色プリセットを変更したり、ドット、番号、経路、矢印、要素のハイライト、ページの暗転、タップでの詳細表示を切り替えたりできます。CSSセレクタの含める／除外指定でスキャン範囲を絞り込むこともできます — ナビゲーションバーだけを監査したり、Cookieバナーを除外したりするのに便利です。

4. 色コントラストをチェックする

Contrastツールは、画面上の任意の2色間のコントラストを測定します — ウェブサイト、スクリーンショット、写真、カメラのライブ映像のいずれにも対応します。

  1. ソースを読み込みます（ウェブページ、画像、またはLiveカメラ）。
  2. Contrastセグメントを選択します。
  3. 2つのピッカーをドラッグして、比較したい色 — 通常はテキストとその背景 — に合わせます。パンやピンチで拡大すれば、ピクセル単位の正確な位置合わせができます。
  4. 結果はリアルタイムに更新されます。コントラスト比（例：Contrast: 4.6:1）が、通常テキストと大きいテキストの両方について、WCAG 2.1のAAとAAAの合否とともに表示されます。

不合格の組み合わせを修正する

「提案」ボタンをタップすると、合格する代替色が計算されて表示されます。これらはAAA準拠（7:1）、AA準拠（4.5:1）、大きいテキスト向けAA（3:1）に分類されます。提案をタップするとピッカーに適用され、実際の見た目を確認できます。

色をコピーする

カラースウォッチをタップすると、必要な形式で色をコピーできます。

  • HTML hex — 例：#1A56DB
  • UIColor (RGBA) — Swiftにそのまま貼り付けられます
  • UIColor (HSB) — 色相・彩度・明度の形式です

画面から選んでいない特定の色をテストしたい場合は、hex値を直接編集することもできます。

測定結果を共有・保存する

Contrastパネルの共有メニューには、次の項目があります。

  • レポートに追加 — この測定結果を自動レポート用に保存します（第5章を参照）。
  • テキストで共有またはスクリーンショットを共有 — メール、メッセージ、メモなどで結果を送信できます。
  • ブラウザで開く — 同じ結果をaccessibleresources.comで表示し、リンクとして共有できます。

ライブカメラ

「ソースを変更」→「Live」を選ぶと、カメラを通してリアルタイムにコントラストをチェックできます — キオスク端末、標識、印刷物などの物理的なインターフェースに便利です。「静止」ボタンをタップすると映像を一時停止してピッカーを配置でき、もう一度タップすると再開します。

Safariや写真アプリからチェックする

ブラウザを離れる必要はありません。Safariで「共有」をタップしてAccessibility Checkerを選ぶと、現在のページがそのままContrastツールに読み込まれます。写真アプリでも、任意のスクリーンショットや画像で同じことができます。

APCA（WCAG 3.0）：設定で「Show APCA™ Lc」を有効にすると、WCAG 2.1の比率と並べてAdvanced Perceptual Contrast Algorithmの値を確認できます。APCAはWCAG 3.0のコントラスト評価手法の草案で — 実験的なものであり変更される可能性がありますが — 標準の今後の方向性をいち早く把握するのに役立ちます。

5. レポートとアクセシビリティステートメントを作成する

テストは仕事の半分にすぎません — 多くの場合、その成果を示す必要があります。Accessibility Checkerは、取得したすべての情報を1つの自動アクセシビリティレポートにまとめ、公開可能なアクセシビリティステートメントも生成できます。

レポートを作成する

  1. 根拠としたいツールを実行します。監査、コントラストチェック（「レポートに追加」で測定結果を保存）、Focus Orderスキャンです。
  2. 「レポートを作成」を選びます — URLバーの隣の「•••」メニューから、またはiPad・Macではレポートボタンから実行できます。
  3. 「レポートビルダー」で、対象（レポートが扱う範囲）を設定し、含めるツールを有効にします。Audit (AxeCore)、色コントラスト、フォーカス順序です。ビルダーには含まれる内容の集計がリアルタイムで表示され、保存済みのコントラスト測定結果を個別に取捨選択できます。
  4. 「プレビューと書き出し」をタップし、組織名と連絡先のメールアドレスまたはページを追加して、PDFを書き出します。

レポートに含まれる内容

WCAG 2.1 AA／EN 301 549に対する自動自己評価として構成された複数ページのPDFです — EN 301 549は欧州アクセシビリティ法（EAA）が参照する整合規格です。総合的な判定と重大度の内訳を示す表紙、セレクタと参照情報を含む完全な検出結果、証跡の切り抜きを添えた色コントラストの付録、そしてフォーカス順序のマップが含まれます。

重要なのは、「このスキャンがカバーする範囲、そしてカバーできない範囲」という率直なセクションも含まれる点です。50項目あるWCAG 2.1のA/AA達成基準のうち、どれが自動でチェックされたか、どれが人間による確認を要するか（そのまま使える手動チェックリストとして）、そしてどれが自動的なページスキャンの範囲を超えるかを示します。自動テストは素早いベースラインを提供しますが — 適合の認証ではありません。レポートにもその旨が明確に記されています。

アクセシビリティステートメントを公開する

レポートのプレビューから「アクセシビリティステートメントを開く」を選びます。アプリは結果をもとに自己評価によるステートメントを生成します — 適合状況、既知の制限事項、フィードバックの連絡先、評価方法が含まれ — アプリの言語とは別に17言語から選べます。テキストとしてコピーしたり、自分のサイト用にHTMLとしてダウンロードしたり、印刷したり、ホスティングされたリンクとして共有したりできます。実際のステートメント例を見る。

プライバシーに関する注記：ホスティングされるステートメントのリンクは、その内容をリンク自体に含んでいます — 組織名や連絡先の情報がサーバーに保存されることはありません。

6. iPad・Mac：フローティングカードとショートカット 新機能

今回のアップデートでは、アプリを大画面向けにリデザインしました。iPadとMacでは、テスト中のページが全画面で表示され、結果は下部の固定パネルではなくフローティングカードに表示されます。

  • どこへでも移動：カードのヘッダーをドラッグして、確認したいページの部分を隠さない任意の隅へ移動できます。VoiceOverでは、カードのカスタムアクション（「左上へ移動」、「右上へ」、「左下へ」、「右下へ」）を使います。
  • 折りたたむ：カードヘッダーのシェブロンをタップすると、閲覧中はタイトルバーだけに縮小できます。もう一度タップすると結果が再表示されます。
  • スクロールも快適：ページのコンテンツは常にカードを避けてスクロールするため、何かが完全に隠れてしまうことはありません。

キーボードショートカット

iPadでハードウェアキーボードを使う場合（⌘を長押しするとショートカットのHUDが表示されます）、またはMacのメニューバーから利用できます。

iPad・MacにおけるAccessibility Checkerのキーボードショートカット
操作ショートカット
ロケーションを開く（URLフィールドにフォーカス）⌘L
ページを再読み込み⌘R
戻る／進む⌘[ / ⌘]
ホーム⇧⌘H
Audit／Contrast／Focus Orderに切り替え⌘1 / ⌘2 / ⌘3
スキャンを実行⌘↵
スマートフォン／タブレット／デスクトップをエミュレート⌥⌘1 / ⌥⌘2 / ⌥⌘3
設定⌘,

デバイスエミュレーション

iPadとMacでは、ページがさまざまなサイズでどう表示されるかをプレビューできます。「デバイスをエミュレート」→「スマートフォン」「タブレット」「デスクトップ」（Macのメニューバー、または上記のショートカットから）を選ぶと、そのデバイスの幅でページがレンダリングされ、対応するSafariのユーザーエージェントで表示されます — Macからサイトのモバイル体験を監査したり、iPadからデスクトップ体験を監査したりできます。

7. 設定

歯車アイコン（または⌘,）で設定を開きます。主な項目は次のとおりです。

  • ホームページを変更 — アプリ起動時に開くページを設定します。
  • アプリの言語 — アプリは18言語に対応しています。ここからiOSのアプリごとの言語設定に移動します。
  • アプリアイコン — 「High Contrast」「Liquid Glass」「Accessibility」のアイコンスタイルから選べます。
  • Show APCA™ Lc（WCAG 3.0） — コントラスト結果にAPCAの値を追加します（第4章を参照）。
  • Axe-coreのバージョンと監査の検出結果 — 監査エンジンと、「要確認」項目を含めるかどうかを制御します。
  • Focus Order — オーバーレイの外観、操作、範囲のオプションを設定します（第3章を参照）。
  • WCAGカード — ガイドラインの内蔵クイックリファレンスです。
  • ヘルプとウェルカムツアーの再生 — アプリ内の紹介をいつでも再生できます。
  • 購入を復元 — 新しいデバイスでサブスクリプションを復元します。
  • アカウント — 必要に応じて「Sign in with Apple」でサインインすると、レポートの詳細（組織名と連絡先）を複数のデバイス間で同期できます。サインインは必須ではなく、監査した内容がアカウントに紐付けられることもありません。同じ画面からアカウントとそのデータを削除できます。

8. 無料機能と有料プラン

Accessibility Checkerは無料でダウンロードでき、ページの閲覧や既存の結果の確認は常に無料です。2つのサブスクリプションプランで完全なワークフローがすべて使えるようになり、いずれのサブスクリプションも7日間の無料トライアルから始まります。

  • Checker — 無制限の監査、コントラストチェック、フォーカススキャン。AAに加えてAAAとAPCAのチェック。レポートのプレビューには透かしが入ります。
  • Checker Pro — Checkerのすべてに加え、透かしのない完全なWCAGレポート、公開可能なアクセシビリティステートメント、帰属表示のないクリーンな書き出しが利用できます。
  • Checker Pro Lifetime — サブスクリプションではなく買い切りで、Checker Proのすべての機能が使えます。

現在の価格はアプリ内に表示されます。サブスクリプションは設定からいつでもキャンセルでき、「購入を復元」で既存のプランを新しいデバイスに引き継げます。

9. よくある質問

データのプライバシーは守られますか？

はい。監査、コントラストチェック、フォーカススキャンはすべてデバイス上で実行され — チェックしたサイト、画像、色がアップロードされることはありません。共有可能なアクセシビリティステートメントのリンクでさえ、その内容をサーバーではなくリンク自体に含んでいます。詳しくはプライバシーポリシーをご覧ください。

自動監査で問題がなければEAAに準拠したことになりますか？

いいえ — そう主張するツールには注意してください。自動チェックは、EN 301 549を支えるWCAG基準に照らして、EAA対応状況の素早く再現性のあるベースラインを提供しますが、完全な適合には必ず手動テストが必要です。本アプリのレポートは、どの基準が自動でチェックされ、どの基準がなお人間による確認を必要とするかを正確に示します。

アプリはどの監査エンジンを使っていますか？

業界標準のaxe-coreエンジンを使用しています。アプリに同梱されているため、セットアップなしで動作します。チームが他で使用しているバージョンに合わせる必要がある場合は、設定でaxe-coreのバージョンを選べます。

書き出したフォーカスマップがページの一部しか表示されないのはなぜですか？

一部のページはページ全体のキャプチャを妨げます。表示範囲のみを書き出した場合は、アプリがその旨を知らせます。また、無限スクロールのページでは、スクロールするにつれてストップが追加されることがあります — パネルはこれを検出すると警告します。さらにスクロールしてスキャンを再実行すると、より多くを取り込めます。

ヘルプが必要なときや機能を提案したいときは？

設定の「フィードバックを送信」を使うか、info@accessibleresources.comまでメールでご連絡ください — すべて拝見しています。