「axe」に関するアクセシビリティ関連情報を自動収集して掲載しています。

note

AIと自動検査ツールを使ってWebページのアクセシビリティを検査する方法を、実装例で解説。WCAG 2.2に基づく6項目(色のコントラスト、代替テキスト、ボタンサイズ、幅320での表示、動き設定の尊重)の検査スクリプトとコマンド例を提示。自動検査の限界(説明文の内容評価、ボタン間隔)についても述べる。

Qiita

axe が フォーカス状態を評価できないという限界を認識し、その補完実装方法と、flaky テストの見分け方を、Next.js の実プロダクトコード上で解説。Ring 不透明度修飾子などの Tailwind ユーティリティは静的検査を素通りするため、getComputedStyle と canvas でコントラストの実効値を計測する実装も示している。

DEV Community

自動テストツール(axe、Lightouseなど)が検出できないアクセシビリティの問題を指摘。キーボード操作・スクリーンリーダー・ARIAの手動検証の必要性と、自動テストと手動テストを組み合わせたアプローチを提唱している。

Deque Systems

Axe DevTools 拡張機能の AI ベース自動テスト機能のデモ。タブ操作の自動追跡、フォーカス指示の検出、キーボードトラップの判定、ロール検証、コントラスト確認などを自動化し、キーボード操作アクセシビリティのテスト効率を向上させる。

Deque Systems

AI搭載の自動アクセシビリティテストツール Axe DevTools の特徴を解説。見出し構造、フォーカス表示、コントラスト、画像ラベリングなどの問題を検出し、Intelligent Guided Tests により複雑なインタラクション評価をステップバイステップでサポートする。

Axe MCP Server Demo

YouTube 海外
Deque Systems

開発者がIDEでアクセシビリティ問題を検出・修正できるAxe MCP Serverのデモ。ブラウザベースのスキャン結果をAIが分析し、コード修正を提案。

The Accessibility Guy

ウェブサイトのアクセシビリティ課題を自動で検出・整理するスキャニングツールの活用法。手動レビューより効率的に問題の優先順位をつけ、チーム全体で対応を加速させる手法を、具体的なツールを例に解説する。

Deque Systems

モバイルアプリケーション開発でアクセシビリティスナップショットテストをビルドプロセスに統合する方法。エンジニア、デザイナー、アクセシビリティ専門家が連携してデザイン検証とスクリーンリーダー出力をコード化段階で自動確認。

Deque Systems

Axe-con 2024 のセッション。組織内にアクセシビリティ文化を浸透させるために、既存のツールとデータを活用して説得力のある物語を作り、複数の職種・部門の連携を促す方法について解説。メトリクス、目標設定、ゲーミフィケーション、PR の手法を紹介する。