Playwrightを使ったE2Eテストで、ブラウザ（Chromium/WebKit）、端末（iPhone実機/Android Emulator）、画面幅、アクセシビリティなど複数軸での動作確認。Chrome環境のみでなく、Safari系やスマートフォン環境での検証の重要性を解説する。
シェアックリップ
シェアされたアックリップです。
そのほかの #テスト・検証 ピックアップ
【名古屋開催】第13回 ウェブアクセシビリティ勉強会
イベント 開催予定
アクセシビリティの実装・検証について、スクリーンリーダーやキーボード操作などの支援技術を実際に体験し、WCAG達成基準を確認するワークショップ形式の参加型勉強会。
アイコンの見た目の大きさと実際のクリック領域（ターゲットサイズ）の違いについて。WCAG 2.2の24×24ピクセル基準を満たすための実装パターンと検証方法を解説している。
メールアドレス入力フィールドの目的を明示する方法について。type属性は形式を、autocomplete属性は具体的な目的を示すことで、フィールドの見た目と実際の機能の一貫性を保つ実装パターンを解説している。
JavaScript で実装されたナビゲーション（button onClick）では AI クローラーにリンクが見つけられない問題と、HTML anchor タグで href を使った正しい実装方法について。
AIが生成するアコーディオン実装がキーボード操作やスクリーンリーダー対応を見落とす理由と、aria-expanded属性で状態を正しく管理することの重要性を、実装例を示しながら解説する。見た目だけでなく状態を属性で持たせることが、アクセシビリティと実装精度の両立につながることを論じる。
aria-describedby属性で参照されているIDが実際に存在しないという問題を検出するDOM チェックと、フォーム要素への正しい実装方法を紹介。
そのほかの #React ピックアップ
AIが生成するアコーディオン実装がキーボード操作やスクリーンリーダー対応を見落とす理由と、aria-expanded属性で状態を正しく管理することの重要性を、実装例を示しながら解説する。見た目だけでなく状態を属性で持たせることが、アクセシビリティと実装精度の両立につながることを論じる。
日本語のIME入力中のキーボードハンドラバグを3つのパターンに分類し、各修正方法を提示。15のOSSプロジェクトでのマージ実例を紹介するWeb開発者向け記事。
デザインシステムがキーボード操作とフォーカス移動を一貫して管理するメカニズムを解説。フォーカストラップ・ARIA・イベントハンドリングの実装と、アプリ側のオーバーライドが破壊する事例を紹介。
React でバーコードスキャンアニメーションを実装する際の CSS キーフレーム・SVG・タイミング制御の手法。prefers-reduced-motion への配慮に言及。
React Native アプリ 12 個の WCAG 2.2 AA 監査結果。カスタムボタンのラベル欠落・タッチターゲット不足・エラー表示・モーダルフォーカス・テキストコントラストの 5 つの一般的な問題と修正方法。
Reactのフォーム実装で非同期処理（API呼び出し）の進捗状態をアクセシビリティ対応で管理する方法を、メール検証を例に解説。aria-live、aria-invalid、aria-describedbyなどの属性を使い、キーボードユーザーやスクリーンリーダー利用者にも状態変化が分かりやすく伝わる実装を示す。
そのほかの #iOS ピックアップ
iPhone用の視覚支援ツール「アイガイドフィルム」の紹介動画。
VoiceOver（iOS27）を使いながら Claude に直接質問することで、Claude のモデル選択とエフォート設定の使い分けを学ぶビデオチュートリアル。初級者向け
VoiceOver ユーザーが生成AI「Claude」を使用する方法を解説する。セットアップからプラン選択、チャット、音声機能まで、iOS スクリーンリーダーでの挙動を中心に紹介する。
個人開発のiOSアプリで押さえるべきアクセシビリティの基本を、実装例と検証方法とともに解説する。VoiceOverなどiPhoneの支援機能を使う人たちが必要とする設定に対応させるため、文字のサイズ・操作性・見た目・読み上げの順序を設計段階から意識することの重要性を説く。
iOS 27とiPhone 18 ProのアクセシビリティをVoiceOverで検証。読み上げ問題、Safari操作、編集ローター、Siri AI など新機能を実機で解説。
視覚障害のあるテック愛好家Steven ScottとShaun Preeceが、NVDAスクリーンリーダー、iOS Siri AI、Android Geminiなどについて率直に評価し、リスナーのメールに応答する。
そのほかの #Android ピックアップ
Gemini Liveの「Guided Vision」機能の使い方解説。スマートフォンのカメラを使ってAIが周囲の物や文字を音声で説明する、視覚障害や弱視向けの支援機能。Android設定、TalkBackとの連携、使用例を紹介する一方で、医療機器やナビゲーション代替ではないことを明記。
Gemini Liveの『Guided Vision』機能についてのAndroid向けガイド。カメラ映像を共有してAIが音声で支援する機能で、日用品探しや小さい文字確認などの用途を想定。ナビゲーションや障害物検知には使わないよう安全上の注意が明示されている。
Google Gemini Live の Guided Vision 機能（Aira と協力開発）がブラインド・ロービジョンユーザーに詳細な視覚情報を提供。実機テストの結果、iOS の Siri 問題、デバイス上 AI のプライバシー、画像説明の検閲などを盲目・低視力者視点から検討
AccessBuild が Android アプリのアクセシビリティを自動スキャンして A-F のスコアを付与する機能を実装した。初回テストでは銀行ログイン画面が D（40%アクセシブル）と評価された。
スマートフォンのカメラをGemini Liveに共有すると、周りの様子を音声で説明し、カメラの向きも声で正す機能『シンプルガイド』。視覚障害のある人とロービジョンの人向けに、複数言語で提供開始。
視覚障害のあるテック愛好家Steven ScottとShaun Preeceが、NVDAスクリーンリーダー、iOS Siri AI、Android Geminiなどについて率直に評価し、リスナーのメールに応答する。