色だけで空き状況を示す予約画面では、色を見分けにくい人が申し込める枠を判断できない。筆者は架空の画面を例に、「受付中」「満席」などの文字を添える設計案と、色以外で状態が読めるかを確かめる点検を示している。
シェアックリップ
シェアされたアックリップです。
そのほかの #色覚多様性 ピックアップ
文字の大きさだけでなく、文字の形・色の組み合わせ・白い紙のまぶしさが読みにくさの原因になると説明する記事。UDフォントや白黒での確認など、チラシや掲示物を作るときの工夫を紹介している。
色の見え方に特性のある作家の絵をきっかけに、見え方の違いとどう付き合うかを綴ったエッセイ。見え方は変えられないとして、色の組み合わせや文字・マークを重ね、引っかからない形で伝えるカラーユニバーサルデザインの考え方を、職場の人間関係にも重ねている。
色覚シミュレーションを使った研究などを3本まとめて紹介する週次の記録である。放射線治療計画画像で色の符号を拾えない可能性、色弱向けの適応型デザインのレビュー、科学データ向けカラーマップ cividis を取り上げる。
色だけで区別させるゲームは、赤と緑の区別が難しい色覚特性のあるプレイヤーが遊びにくくなるとして、色の違いに加えて形の模様や明るさの差を使うべきだと解説している。
色画用紙から考える、ものづくりとCUD
イベント 開催終了
色画用紙を例にしたカラーユニバーサルデザイン学習会。大王製紙との対話を通じ、ものづくりとCUDの関係を考えるオンラインイベント。
そのほかの #WCAG ピックアップ
（引用）アクセシビリティを、デザインの基本に。 本書は、年齢や障害の有無、利用環境にかかわらず、あらゆるユーザーが必要な情報や体験を得られるよう、「アクセシビリティ」をデザインの初期段階から組み込むための考え方と実践を学べるハンドブックです。 日本でもデジタル庁がウェブアクセシビリティの導入を推進し、「誰一人取り残されない、人に優しいデジタル化」が目指されています。アクセシビリティは、一部の人のための特別…
【名古屋開催】第13回 ウェブアクセシビリティ勉強会
イベント 開催予定
アクセシビリティの実装・検証について、スクリーンリーダーやキーボード操作などの支援技術を実際に体験し、WCAG達成基準を確認するワークショップ形式の参加型勉強会。
Shopify ストアの配色向けに、WCAG 2.x AA の基準を測った2種類のパレットを CSS 変数や Tailwind の設定として配布する無料キットを紹介する。コントラスト比の確かめ方も示す。
Claude Code で作った Next.js アプリ14件を WCAG 2.1 AA に適合させた作者の報告。AI が誤った ARIA を出すことを前提に、CLAUDE.md にアクセシビリティの要件を書く、ダイアログなどは shadcn/ui の部品を使う、画面ごとに axe-core で検査する、という手順を示す。
ブックマークレット「Tab trail」の紹介。ページ上で Tab の移動順を番号付きで描き、キーボードで届かない操作要素、Tab 押下時のフォーカスの飛び、隠れたフォーカスなど7種類の問題を赤く示す。Playwright のテストからも呼び出せる。
モーダルダイアログを開いたとき、Tab キーでフォーカスが背後のページへ抜けないようにする方法を解説する。ネイティブの dialog 要素（showModal()）の使い方、Escape キーで閉じられるようにすること、閉じたあとにフォーカスを開いたボタンへ戻すことを扱う。