アクセシビリティ・オーバーレイを導入した62サイトを、導入の有無で比べた研究を紹介する動画。axe-core による自動テストでは、約9割のサイトでWCAG違反の数に測定できる差は見られなかったという。
シェアックリップ
シェアされたアックリップです。
そのほかの #axe ピックアップ
AIがアクセシビリティをレビューできる範囲は、ソースコードだけを読むか、実行中のブラウザーやaxe-coreの結果まで受け取れるかによって変わると整理する。WCAG適合と自動テストの合格は同じではないことも説明する。
axe、Chrome DevTools、スクリーンリーダーがアクセシビリティの経路の異なる場所を見ていることを整理し、自動検査が通っても、キーボード操作や読み上げの確認は別に必要だと解説している。
銀行のWebサイトの監査を題材に、自動チェック・支援技術に見える情報の確認・NVDAによるスクリーンリーダーのテストなどを組み合わせ、どのツールをどの問題に使うかを判断する手順を示す動画。
Reactでアイコンだけのボタンやリンクに名前がないと、スクリーンリーダーが「button」とだけ読み上げる問題を扱う。aria-labelや視覚的に隠したテキストで名前を付ける方法を、axeの検査結果とともに示す。
筆者が監査した小規模事業者のサイトでは、自動チェックツールが見つけた WCAG 違反は全体の30〜40%程度だったと述べ、スクリーンリーダーでの読み上げや代替テキストの内容、キーボードでの操作など、人の確認が要る項目を挙げる。
AIモデルによる監査は自動検査ツールより多くの違反を見つけるが、指摘の約半数は人の確認が要る。著者は自動検査を合否の基準に残し、モデルには結果の仕分けと手動で確かめる項目の提示を任せる手順を勧める。
そのほかの #テスト・検証 ピックアップ
【名古屋開催】第13回 ウェブアクセシビリティ勉強会
アクセシビリティの実装・検証について、スクリーンリーダーやキーボード操作などの支援技術を実際に体験し、WCAG達成基準を確認するワークショップ形式の参加型勉強会。
イスラエルの障害者平等権規則と規格 IS 5568 AA(WCAG 2.1 AA 準拠)への適合を、ブラウザ上で動く JavaScript により自動的に確かめる方法を解説する記事。代替テキスト・見出し構造・コントラスト・言語と文字方向の確認項目を示す。
Using Accessibility Checker Pro + Claude AI to Remediate a Large WordPress Site: Courtney Robertson
WordPress の大量の記事を、アクセシビリティ検査ツールの結果をもとに Claude Code で修正した事例の発表である。YouTube の埋め込みを字幕付きプレーヤーへ置き換えるなどの修正で、AI が正しく直せた箇所と人の確認が要った箇所を示す。
会員登録フォームで自動入力が効くかを1分で確かめる方法を解説する記事。入力欄に autocomplete の値を付けて入力目的を伝える意味を、WCAG 達成基準1.3.5(入力目的の特定)の解説をもとに示す。
AIエージェントが検証していないのに「テストは通った」と報告する例を挙げ、アクセシビリティの検査をAIだけに任せられない理由を論じる。ルールに基づく検証とAIによる自動化を組み合わせる方法を示すと述べている。
AIがアクセシビリティをレビューできる範囲は、ソースコードだけを読むか、実行中のブラウザーやaxe-coreの結果まで受け取れるかによって変わると整理する。WCAG適合と自動テストの合格は同じではないことも説明する。
そのほかの #WCAG ピックアップ
(引用)アクセシビリティを、デザインの基本に。 本書は、年齢や障害の有無、利用環境にかかわらず、あらゆるユーザーが必要な情報や体験を得られるよう、「アクセシビリティ」をデザインの初期段階から組み込むための考え方と実践を学べるハンドブックです。 日本でもデジタル庁がウェブアクセシビリティの導入を推進し、「誰一人取り残されない、人に優しいデジタル化」が目指されています。アクセシビリティは、一部の人のための特別…
【名古屋開催】第13回 ウェブアクセシビリティ勉強会
アクセシビリティの実装・検証について、スクリーンリーダーやキーボード操作などの支援技術を実際に体験し、WCAG達成基準を確認するワークショップ形式の参加型勉強会。
イスラエルの障害者平等権規則と規格 IS 5568 AA(WCAG 2.1 AA 準拠)への適合を、ブラウザ上で動く JavaScript により自動的に確かめる方法を解説する記事。代替テキスト・見出し構造・コントラスト・言語と文字方向の確認項目を示す。
スマートフォンなどで押し間違えやすいボタンの大きさを扱った記事である。操作対象は 24×24 CSS px 以上にし、主要な操作では 44×44 CSS px を目安にすると説明する。アイコンの大きさは変えず、押せる範囲に余白を足す方法を示す。
会員登録フォームで自動入力が効くかを1分で確かめる方法を解説する記事。入力欄に autocomplete の値を付けて入力目的を伝える意味を、WCAG 達成基準1.3.5(入力目的の特定)の解説をもとに示す。
AIがアクセシビリティをレビューできる範囲は、ソースコードだけを読むか、実行中のブラウザーやaxe-coreの結果まで受け取れるかによって変わると整理する。WCAG適合と自動テストの合格は同じではないことも説明する。
そのほかの #動画 ピックアップ
米国障害者法(ADA)のタイトルIIの対象となる公的機関が、アクセシブルでない文書によって負う7つの法的リスクを解説する動画。対応期限と、文書のアクセシビリティ計画の立て方も扱う。
アクセシブルでないPDFなどの文書が公的機関にもたらす7つの法的リスクを示す動画。ADAタイトルIIの期限と、技術基準としてのWCAG 2.1 AAに触れ、文書への対応計画が必要だと説く。
LinkedInの動画で字幕がどう役立つかを、短いアクセシビリティ機能の紹介として伝える動画。音声を出さずに見る場合でも、話の内容が伝わることを示す。
視覚障害のある人向けに、Tech Assistant というアプリを用いた動画マージの手法を紹介するチュートリアル。TalkBack での操作に対応し、1クリックで動画を結合可能。
Alt Text Matters Across Platforms
プラットフォームが変わっても、画像の説明は同じ目的を果たす必要があることを解説する動画。
altテキストの文脈的な正しさと常見の誤りを、装飾画像から複雑な図表まで幅広い例で解説する動画。