Webアクセシビリティチェッカー

Webアクセシビリティチェッカー：WCAG 2.2対応。色のコントラスト、代替テキスト、見出し、フォーカス順序、色覚シミュレーション、監査レポート。

🔍 Webアクセシビリティチェッカー WCAG 2.0/2.1/2.2 対応 Webアクセシビリティチェッカーは、ブラウザーのどのタブでも監査用の作業台に変えます。サイドパネルを開き、ページを検査し、ルールごとにまとまった違反を読む。実測値は要求されるしきい値の隣に並び、理由、直し方、そのまま貼れるコード例が付きます。 ボンネットの下では、このWebアクセシビリティチェッカーが axe-core 4.13 に加えて独自のルール層を走らせます。対象はほとんどのツールがまだ触れていない WCAG 2.2 の達成基準、すなわちターゲットのサイズ、フォーカスの非遮蔽、アクセシブルな認証、文字間隔、リフローです。 多くの人がWebアクセシビリティチェッカーを入れる理由は、リリース前のたった一つの問いです。どこが落ちるのか、正確にどの要素か。答えは二秒で、いま開いているページの上に出ます。ビルド手順も、クラウドのクローラー待ち行列もありません。 ✅ 一回のスキャンが見る範囲 ➤ 通常テキスト、大きなテキスト、非テキスト要素のコントラスト ➤ 代替テキスト、装飾画像、別の場所で説明済みの画像 ➤ 見出し構造、ランドマーク、ページの言語、文書タイトル ➤ フォームのラベル、リンクの文言、表、字幕、動画の代替 ➤ タブ順序、フォーカス表示、キーボードトラップ、ターゲット寸法 📐 理解している基準 検査結果が効くのは、あなたが何の規定で測られるかを名指しした時です。だから所見のひとつずつが達成基準、レベル、バージョンを持って出てきます。 1. WCAG 2.0、2.1、2.2 のレベル A、AA、AAA 2. JIS X 8341-3:2016 と障害者差別解消法の合理的配慮 3. 欧州の EN 301 549 と European Accessibility Act 4. 北米の Section 508、ADA Title III、AODA 🎨 コントラストを二通りで測る Webアクセシビリティの要はコントラストです。スポイトで二色を取り、その場で編集し、WCAG 比と APCA Lc を横並びで見ます。コントラスト計算機は通常テキスト、大きなテキスト、非テキスト要素の判定を同時に返すので、WCAG 2.1 AA の答えと、より厳しい WCAG AAA の答えが一目で並びます。APCA は WCAG 3.0 に向けて検討されている新しい方式です。 🕶 生きたページ上での見え方の再現 1️⃣ 一型二色覚から全色盲まで、八種類の色覚タイプ 2️⃣ ロービジョン、白内障、緑内障を実際のレイアウトへ重ねる 3️⃣ 文字がじっとしていない読み困難モードの再現 色覚シミュレーターはスクリーンショットではなくページそのものの上で動くので、ホバー状態、グラフ、動画のサムネイルまでレビュー対象に入ります。 🧭 DOM を読まずに問題へ到達する - Locate は達成基準を記した札を、失敗した要素そのものに留めます - 見出しマップとランドマークマップが本当の構造をページへ重ねます - フォーカス順序はキーボードが実際に通る経路に沿って採番されます - 代替テキストは装飾画像も含め、各画像の隣に表示されます 📄 監査が最後に残す成果物 テストは仕事の半分です。Webアクセシビリティ診断の残り半分は成果物にあります。以下はすべて同じスキャンから書き出されるので、提出するアクセシビリティレポートは、検査したタブと数値まで一致します。 📊 自社ブランドの HTML レポート、そのまま PDF へ印刷 🧾 チケット、ボード、パイプライン向けの CSV と JSON ✍ 自社サイト用のアクセシビリティ方針の下書き 📋 調達向けの VPAT 形式の適合表 月曜はアクセシビリティ方針のジェネレーター、金曜は適合報告書の出典。 🌐 一ページを越えるWebアクセシビリティ試験 同一オリジンのページを一度の巡回でまとめて検査し、履歴を残し、二回の実行を比べて何が壊れ何が直ったかを見ます。単発の確認がリリースごとの回帰テストになり、監視ツールに期待される役目をそのまま果たします。 ✦ このパネルが固定されたままになる理由 ✦ 所見が示すのは実測値であり、曖昧な深刻度の言葉ではありません ✦ ガイダンスは規定名ではなく直し方そのものを説明します ✦ すべて書き出せるので、誰も報告書を手作業で組み直しません ✦ パネル自身が WCAG 2.2 AA で同じ監査に合格しています 🔒 設計からして手元で完結 ページの内容も、URL も、結果も、この端末から出ません。ネットワーク通信を持たないスキャナーは、クラウドのスキャナーが決して届かない場所へ届きます。ステージング、社内イントラ、内部ビルド。アカウント不要、登録不要、接続も不要です。 👥 チーム全員のために レビュー前に片付ける開発者、配色の判断を確かめるデザイナー、スプリント内でアクセシビリティ試験を回す QA、顧客向け文書を作る制作会社、公開の可否を決める編集者。描画されたページであれば何でも対象です。 ⚡ 成果物までの三手 → Alt+Shift+A を押して、スキャンをページ全体に走らせる → 一覧を潰し、要素を特定し、直して、もう一度検査する → レポート、方針、適合表のうち必要なものを書き出す ⚖ 限界についての正直な話 自動化ツールが届くのは WCAG 達成基準のおよそ三分の一で、すべての採点と草案がその事実を表に書いています。機械が判定できる失敗は速く片付け、時間はどの自動ツールにも出せない判断へ回してください。監査の助けではあっても、証明書ではありません。 ⌨ 十秒で使い始められます 拡張機能を固定し、任意のページを開き、Alt+Shift+A。ビルド手順も、オンボーディングも、試用期間のカウントダウンもありません。パネルは十五言語に対応します。