Flutter開発でのアクセシビリティ実装課題。Figma→AI実装時のセマンティクス欠落、liveRegionの処理、モーダルのフォーカス管理の3つの落とし穴を実機検証で紹介。AIが実装するからこそアクセシビリティ知識が必須であることを指摘。
シェアックリップ
シェアされたアックリップです。
そのほかの #テスト・検証 ピックアップ
【名古屋開催】第13回 ウェブアクセシビリティ勉強会
アクセシビリティの実装・検証について、スクリーンリーダーやキーボード操作などの支援技術を実際に体験し、WCAG達成基準を確認するワークショップ形式の参加型勉強会。
イスラエルの障害者平等権規則と規格 IS 5568 AA(WCAG 2.1 AA 準拠)への適合を、ブラウザ上で動く JavaScript により自動的に確かめる方法を解説する記事。代替テキスト・見出し構造・コントラスト・言語と文字方向の確認項目を示す。
デジタル庁のデザインシステム(DADS)を参考に、小さい文字やコントラスト比をウェブサイトで点検するAIエージェント向けスキルを紹介する記事。Pythonで候補を拾い、ブラウザで確かめ、人が判断する二段階の点検を解説する。
axe-core 4.14.0の更新を伝える記事。WCAG 2.5.3「名前に含まれるラベル」の検査が既定で有効になり、表示されているラベルが名前に含まれない操作部品を検出するようになった経緯と、主要OSの音声操作を試した結果を解説する。
大企業がWebサイト・モバイルアプリ・文書のアクセシビリティを管理するプラットフォームを選ぶための、5つの検討事項とベンダーへの質問を示すガイドである。AIで制作は速くなったが検証が追いつかない、という課題も挙げている。
Using Accessibility Checker Pro + Claude AI to Remediate a Large WordPress Site: Courtney Robertson
WordPress の大量の記事を、アクセシビリティ検査ツールの結果をもとに Claude Code で修正した事例の発表である。YouTube の埋め込みを字幕付きプレーヤーへ置き換えるなどの修正で、AI が正しく直せた箇所と人の確認が要った箇所を示す。
そのほかの #支援技術 ピックアップ
Sight Tech Global 2026
視覚障害者向けの支援技術に特化したオンラインカンファレンス。Amazon・Googleなどのテック企業による最新のアクセシビリティ技術と事例が紹介される。
第48回総合リハビリテーション研究大会
能登半島地震を踏まえ、アクセシビリティの現状と課題、今後の方向性を議論する障害者リハビリテーションの総合研究大会。福祉用具やコミュニケーション支援、移動支援など幅広いテーマを扱う。
橋本紗貴×伊藤史人 講演会 ~見えない。聞こえない。それでも、学ぶ。挑む。~
盲ろう・四肢麻痺のある特別支援学校教諭が、支援技術を活用した大学進学から教員採用試験、さらなる夢への挑戦を語る。本人と支援技術研究者による対談で、テクノロジーと人的支援が可能性をどう広げるかを探る。
【名古屋開催】第13回 ウェブアクセシビリティ勉強会
アクセシビリティの実装・検証について、スクリーンリーダーやキーボード操作などの支援技術を実際に体験し、WCAG達成基準を確認するワークショップ形式の参加型勉強会。
第18回 サイトワールド2026
視覚障害に特化した総合イベントで、東京・錦糸町のすみだ産業会館で3日間開かれる。日常を支える用具から最新の機器までを手に取って試せる展示に加え、点字楽譜やゲームのアクセシビリティ、就労をテーマにした講座もある。
白杖歩行を補うGPSの音声ナビを取り上げ、点字ブロックの役割と比べて論じた記事。位置の誤差や進行方向の判定、地下鉄の出口のように方向が分からない場面での課題を挙げ、普及しない原因を3点にまとめている。
そのほかの #WAI-ARIA ピックアップ
Four form components hold every form in our app, and writing this post found the one bug in them
アプリ「Nakodo」のフォーム部品の設計を解説する記事。失敗の通知と成功の通知で role を使い分ける理由と、入力欄の補足(ヒント)が入力欄に関連付けられておらず、スクリーンリーダーで読まれない不具合を扱う。
WordPressのヒーロースライダーで、画像をWebPに変換するだけでなく、優先読み込み・遅延読み込み・レイアウト確保を組み合わせ、表示されていないスライドをaria-hiddenで読み上げ対象から外す手法を解説する記事。
WordPressのヒーロースライダーの画像を、PNGからWebPに変えて合計約7.8MBから約316KBへ軽くした手順を解説する。あわせて、非表示のスライドを aria-hidden で読み上げの対象から外す方法と、Playwright による自動確認を紹介する。
モーダルダイアログのフォーカス管理を解説する記事。フォーカスをダイアログ内に閉じ込める実装と、閉じたあとに元の要素へ戻す挙動を扱う。HTML の dialog 要素を使えば、背景の操作を止める処理を自前で書かずに済むとする。
Fluent UIのReact v9とWeb Componentsが、Shadow DOMやPortal、ダイアログでフォーカスやキーボード操作をどう扱っているかを、公式ドキュメントとソースで確かめながら論じる記事である。UIライブラリの設計判断が主題である。
Shadow DOM の内側にあるボタンなどの要素が、支援技術にどう伝わるかを扱う記事である。DOM・Accessibility Tree・プラットフォーム API の関係を仕様と Chrome での観察から整理し、カスタム要素に意味を持たせる設計の選択肢を示している。
そのほかの #モバイル ピックアップ
スマートフォンなどで押し間違えやすいボタンの大きさを扱った記事である。操作対象は 24×24 CSS px 以上にし、主要な操作では 44×44 CSS px を目安にすると説明する。アイコンの大きさは変えず、押せる範囲に余白を足す方法を示す。
高齢者向けのオフラインのパズルゲームの設計を、アクセシビリティの観点から紹介する記事である。コントラストの高い配色・大きなタッチ領域・読みやすいフォント・制限時間のない進行を挙げている。
Reactのフォーム部品の設計を、ラベルやメッセージ行などの共通の構造、react-hook-form と zod への接続、スマートフォンでの操作の3点から解説する。例には作者が開発するUIライブラリを使っている。
Android と iOS で .NET MAUI アプリを試して見つかった、アクセシビリティの問題8件と対処法を紹介する。AutomationId が ID のまま読み上げられることや、見出しが設定されないことなど、実行して初めて表れる問題を挙げる。
ناحیههای لمسی و بزرگنمایی (Touch Target & Zoom): چرا اندازه و مقیاسپذیری در موبایل حیاتی است؟ 📱
モバイルでタッチ領域を十分な大きさにすることと、拡大縮小を妨げないことを、コード例つきで解説する。タッチ領域の下限は WCAG 2.2 の AA 基準にあたる 24×24px とする。
視覚障害者が屋外でスイフトアイを使用する際の課題を述べ、手帳型ケースにスマホを入れて首から吊し右手の親指で物理スイッチを押す操作方法を提案。中高齢の視覚障害者でも使いこなせるよう基本機能に限定した設計を解説している。