自動テストツール（axe、Lightouseなど）が検出できないアクセシビリティの問題を指摘。キーボード操作・スクリーンリーダー・ARIAの手動検証の必要性と、自動テストと手動テストを組み合わせたアプローチを提唱している。
シェアックリップ
シェアされたアックリップです。
そのほかの #axe ピックアップ
AIと自動検査ツールを使ってWebページのアクセシビリティを検査する方法を、実装例で解説。WCAG 2.2に基づく6項目（色のコントラスト、代替テキスト、ボタンサイズ、幅320での表示、動き設定の尊重）の検査スクリプトとコマンド例を提示。自動検査の限界（説明文の内容評価、ボタン間隔）についても述べる。
外部ツール（HubSpot等）の埋め込み機能によるアクセシビリティエラーについて、自社で対応できる範囲と提供元への依頼の境界を実例から整理。
Angularアプリのaxeスキャンで検出した違反を、DOM選択子ではなく修正対象のコンポーネント名に帰属させるツールの開発事例。
WCAG 2.2 達成基準を自動評価するツール（axe-core ベース）を、異なるステークホルダー向けに4つのレポート形式で提供する研究。
アクセシビリティをチェック・テストするためのツール・拡張機能・スクリーンリーダーの一覧。自動チェック、コントラスト測定、スクリーンリーダー利用など、成果物検証の手段を紹介している
axe が フォーカス状態を評価できないという限界を認識し、その補完実装方法と、flaky テストの見分け方を、Next.js の実プロダクトコード上で解説。Ring 不透明度修飾子などの Tailwind ユーティリティは静的検査を素通りするため、getComputedStyle と canvas でコントラストの実効値を計測する実装も示している。
そのほかの #Lighthouse ピックアップ
1,200ページを超える静的 Next.js サイトのアクセシビリティ・SEO 検査を 2 段に分け、HTML だけで判定できる項目は全ページで、描画が必要な項目は Lighthouse で種類ごとに 1 ページだけ測定する手法。
アクセシビリティをチェック・テストするためのツール・拡張機能・スクリーンリーダーの一覧。自動チェック、コントラスト測定、スクリーンリーダー利用など、成果物検証の手段を紹介している
セマンティックHTMLの重要性とスクリーンリーダーへの影響を解説。著者のポートフォリオサイト監査で発見した3つの問題——画像のalt属性欠落、フォームラベルの接続不良、見出し階層のスキップ——と修正方法を紹介する。
Lighthouse がアクセシビリティ 100 点でも見落とす項目を、手動チェックで検出。装飾的なアイコンの aria-hidden 設定、ランドマークの配置と aria-labelledby による命名、HTML の妥当性など、実装例を交えて解説。
Lighthouse と axe で頻出するアクセシビリティエラー（代替テキスト・色コントラスト・ボタン名前・フォームラベル）の意味と修正方法を解説する。
Lighthouseで最も頻出するアクセシビリティ失敗4つ（色コントラスト・代替テキスト・リンク名・フォームラベル）の原因と最小限の修正方法をWCAG 2.2に対応させて解説している。
そのほかの #キーボード操作 ピックアップ
固定フッターがキーボード操作のフォーカスを隠す問題の検証ツール。ResizeObserver で要素の高さを追跡し、WCAG 2.4.11 の達成基準を参考に改善方法を示す。
ランディングページのキーボードアクセシビリティチェック。フォーカスリングの表示確認方法、:focus-visible による CSS 実装例、Tab キーで行う手動確認フローを解説。
ChatGPTの画面更新によるスクリーンリーダー対応の低下を報告。見出し削除、リスト構造喪失、キー操作の変化など、スクリーンリーダー利用者に影響する具体的な問題を述べ、Webサイト変更時にはスクリーンリーダーでの操作確認の必要性を主張。
アクセシブルな Web チェックリストツールの構築方法を解説。ネイティブな HTML コントロール、ローカルストレージ、キーボード操作、プリント対応による、フレームワーク不要のシンプルな実装を紹介。
ネイティブダイアログ要素でモーダル閉じ込めとフォーカス移動を検証するためのテストフィクスチャとテスト方法を解説。フォーカスリーク防止と複数ブラウザでの検証の重要性を説明している。
業務システムのマウス操作による手首の負担を、キーボード操作で解決した経験から、アクセシビリティの本質を考える。相手の困りごとに寄り添い、摩擦を減らす設計思想の重要性について述べる。
そのほかの #スクリーンリーダー ピックアップ
【名古屋開催】第13回 ウェブアクセシビリティ勉強会
イベント 開催予定
アクセシビリティの実装・検証について、スクリーンリーダーやキーボード操作などの支援技術を実際に体験し、WCAG達成基準を確認するワークショップ形式の参加型勉強会。
スクリーンリーダーがHTMLを読み上げるまでのプロセスとAccessibility API Mappingについて、実技を交えて学ぶウェブ開発者向けのウェビナー。
アクセサリー販売サイトのレイアウト変更を通じた、音声読み上げ対応とリーダー機能への適合事例。色別カテゴリー追加によるUX向上と、iPad・iPhone での検証プロセスを記載する。
視覚障害のある点訳者が、点字データをカナ変換してスクリーンリーダーで音声読み上げするウェブツールを開発。点訳と音声読み上げの相互利用を実現した取り組みを紹介する。
Apple で 20 年間 Mac 開発に携わったエンジニアが 2015 年に完全に失明。VoiceOver 学習をビデオゲームのように攻略した経験、Apple 内のアクセシビリティの位置づけ、エンジニアへのバグ報告の重要性について語る。
スクリーンリーダーユーザーや検索エンジン、低速接続ユーザーのための代替テキスト（alt属性）の書き方。何を含めるべきか、何を避けるべきかを具体例で示している。
そのほかの #WAI-ARIA ピックアップ
AI チャット UI で token stream を実装する際、各チャンク到着時に assertive live region を更新するとスクリーンリーダーが頻繁に割り込み、ユーザーの操作フォーカスが混乱される問題を、デバッグ手法とともに解説。
Five tour notes that are always in the DOM, and a tour that will not start until you scroll to it
記事 海外
Webアプリケーションのツールチップツアーのアクセシブルな実装。DOMに常に存在させることでスクロール時の位置ずれを回避し、スクリーンリーダー対応する手法を解説。
Interop 2027でのアクセシビリティ関連の機能優先順位付け。focusgroup属性、ariaNotify() APIなどの提案機能を紹介。
ブレッドクラムコンポーネントの実装例を紹介。型定義で最後の項目の href を省き、HTML では aria-current="page" と aria-hidden を使い分け、JSON-LD では position を 1 から始めてリンクのない項目の item を省く設計。
React で一時メール確認フローを実装する際、ステートマシンで状態を明示的に管理し、aria-live で状態変化を通知。ポーリング時に cancelled フラグで不要なレンダリングを避け、アクセシビリティと性能の両立を実現する。
メール検証フォームの実装で、状態管理で各段階を明確にし、aria-invalid で無効状態を示し、CSS で空間を予約することで、フォーカス移動とレイアウトシフトを避け、アクセシビリティと UX の両立を実現する。
そのほかの #テスト・検証 ピックアップ
【名古屋開催】第13回 ウェブアクセシビリティ勉強会
イベント 開催予定
アクセシビリティの実装・検証について、スクリーンリーダーやキーボード操作などの支援技術を実際に体験し、WCAG達成基準を確認するワークショップ形式の参加型勉強会。
固定フッターがキーボード操作のフォーカスを隠す問題の検証ツール。ResizeObserver で要素の高さを追跡し、WCAG 2.4.11 の達成基準を参考に改善方法を示す。
AIと自動検査ツールを使ってWebページのアクセシビリティを検査する方法を、実装例で解説。WCAG 2.2に基づく6項目（色のコントラスト、代替テキスト、ボタンサイズ、幅320での表示、動き設定の尊重）の検査スクリプトとコマンド例を提示。自動検査の限界（説明文の内容評価、ボタン間隔）についても述べる。
WCAG 2.1のコントラスト比判定を相対輝度から計算し、5つの基準（AA/AAA通常文字/大文字、UI要素）に対応するTypeScriptの実装方法を解説。背景色に応じた合格色の自動提案アルゴリズムも含む。
AI チャット UI で token stream を実装する際、各チャンク到着時に assertive live region を更新するとスクリーンリーダーが頻繁に割り込み、ユーザーの操作フォーカスが混乱される問題を、デバッグ手法とともに解説。
ランディングページのキーボードアクセシビリティチェック。フォーカスリングの表示確認方法、:focus-visible による CSS 実装例、Tab キーで行う手動確認フローを解説。