AI チャット UI でタブが非表示になるとストリーミング状態が更新されず、キーボード操作と スクリーンリーダー利用が中断される問題を技術的に解説。Page Lifecycle API による適切な状態管理を提案。
シェアックリップ
シェアされたアックリップです。
そのほかの #キーボード操作 ピックアップ
自動化されたインテリジェント・ガイド・テストが、キーボード操作やフォーカス動作など手動では時間を要するテストを自動化。開発者が数秒で結果を確認でき、AIの判定を人間が検証・修正することで、テスト効率を劇的に向上させる。
キーボードユーザーがナビゲーション部分をスキップしてメインコンテンツへ直接アクセスできるスキップリンク機能の実装方法とテスト手法を解説。WCAG 2.4.1準拠のための基本的なアクセシビリティ実装。
AI 生成テキストをストリーミング表示する際、未完成の Markdown 構造が不正な見出しやリンクになり、スクリーンリーダー・キーボード利用者に虚偽の情報を伝える問題を分析。状態管理と ARIA 属性による解決法を提示。
状態管理のバグがキーボード操作とスクリーンリーダーユーザーに異なる影響をもたらす仕組みと、デバッグの順序を解説。実装時に状態遷移表を作成することの重要性を示す。
CSSのreading-flowプロパティを使い、flexboxやgridで視覚順序が変わった際のフォーカス順序と視覚の乖離を解決。キーボード操作とスクリーンリーダー対応を同時に実現する方法を解説。
同じHTMLを異なるCSSリセットで実装した3パターンを比較。:focusでアウトラインを削除するCSSリセットがキーボードユーザーのフォーカス追跡を不可能にする問題と、:focus-visibleによる解決法を実装で検証している。
そのほかの #テスト・検証 ピックアップ
【名古屋開催】第12回 ウェブアクセシビリティ勉強会
ウェブアクセシビリティの基礎から実務的なテーマまで、参加者と一緒にワークショップ形式で学ぶ勉強会。WCAG 2.2やスクリーンリーダーの実機検証など、手を動かしながら知見を共有する。初心者歓迎。
Webアクセシビリティ対応の相談を案件として組み立てるフロー。調査・提案・試験から翌年点検まで、実務的に進めるステップを、A11yWorkFlowツールのサンプル資料を交えて解説する。
重度重複障害のある子どもたちの心身状態を心拍変動と行動観察で読み取り、それをもとに支援・指導を工夫するスキルを学ぶオンライン講座。視線入力やスイッチ教材などICT・支援技術の活用例も紹介される。
AIをアクセシビリティテストに活用しても、専門知識、批判的思考、障害のある人の見方が必要。AI活用の限界と人間の判定の重要性を指摘。
LLMがUIスクリーンショットからアクセシビリティ規則違反を検出できるかを測定した実験。GPT、Gemini の精度を比較。
Shadow DOM を使用した Web コンポーネントでスクリーンリーダーが情報を正しく認識しない問題と、その解決方法を技術的に解説。delegatesFocus、ARIA 属性、aria-hidden の活用などの実装パターンを紹介。