カラーユニバーサルデザイン対応テストを実施した東京都のデータポータル。『誰ひとり取り残されないようにしよう』というデジタル10か条に基づき、色覚特性に配慮したカラーパレットを設計した行政デジタルサービスの実践例。
シェアックリップ
シェアされたアックリップです。
そのほかの #UXデザイン ピックアップ
The Design + Accessibility Summit
イベント 海外 開催予定
デザイン専門家向けのオンラインサミット（第7回）。アクセシビリティの実装をマスターしたいデザイナーを対象とした、4日間の集中的なナレッジシェアと最新事例の紹介。
エシカルデザインの手法をインクルーシブ・アクティビティ・カードを使ったワークショップ。
非エンジニアがClaudeとGeminiを併用してWebアプリ開発した実践プロンプト集。アクセシビリティ要件の初期組み込みから、UI/UX調整、視認性強化、トラブル対処まで、実装プロセスと試行錯誤を解説。
CSS のネイティブ相対色構文（oklch、color-mix）を用いて、ダイナミックにコントラスト対応・wide-gamut 対応するカラートークン設計を解説。WCAG 要件を保ちながら 2026 年トレンドパレットを実装する方法を紹介。
長文記事にナビゲーション機能を加える際、本文へのアクセスを阻害しない設計原則。キーボード操作・スクリーンリーダー対応・フォーカス表示など複数の利用方法を前提とした実装パターンと確認方法を解説している。
親が1人で車椅子ユーザーの子どもを雨の中で乗せるときの身体的負担を7場面に分けて可視化。カバーの着脱と安全な乗せ下ろしが同時に必要な課題を指摘し、設計改善の方向を提案。
そのほかの #カラーコントラスト ピックアップ
CSS のネイティブ相対色構文（oklch、color-mix）を用いて、ダイナミックにコントラスト対応・wide-gamut 対応するカラートークン設計を解説。WCAG 要件を保ちながら 2026 年トレンドパレットを実装する方法を紹介。
ロゴやマークのコントラスト評価方法を提案する記事。ピクセル平均測定ではなく列単位での測定により、単語が完全に消える問題を検出する手法を解説。
WebAIM Million 2026年調査で明らかになった最も一般的な6つのWCAG違反について、なぜそれらが問題かを解説し、各々の修正コードを具体的に示す。
color-schemeプロパティでダークモードにおけるブラウザのネイティブUI（日付入力、セレクト、スクロールバー）の自動対応が可能。カスタムコンポーネント制作なしで実装できるテクニック。
WCAGコントラスト比を満たす色スキーム設計方法について解説。sRGB・HSL色空間の限界、相対輝度の計算式、OKLCH色空間を使ったCSS設計トークンで、アクセシブルな色システムを構築する方法を示す。
WordPress環境でのメール送信におけるアクセシビリティについて。確認メール・パスワードリセット等、ユーザーが受け取る全メッセージが読みやすく・ナビゲート可能である必要性を解説。コンテンツ・構造・デザイン・テスト実践を網羅した講座。
そのほかの #色覚多様性 ピックアップ
CUD検証を体験しよう ― 見分ける・確かめる・対話する ―
イベント 開催終了
色覚多様性への理解を実践的に深めるワークショップ。CUD検証方法を体験し、設計現場での活かし方を色弱者やデザイナーと対話する。
色彩検定UC級の学習を通じて、ユニバーサルデザインと色覚多様性の基礎を解説。色だけで情報を伝えない設計、ピクトグラムの活用、色の機能的・情緒的役割など、実務応用できる知見を紹介する。
読みやすさと色覚アクセシビリティに焦点を当てたiTerm2テーマ「Prompt」の開発。コントラストと色分離をテストし、VS CodeやVimのテーマも提供。
色彩検定UC級受験への挑戦記。色覚タイプ別の見え方、高齢者の色の見え方、ユニバーサルデザイン原則など、実務で活かせる色彩知識の習得過程を記録。
Windows向けの色覚多様性対応アプリ『BE MY COLOR』を、AIコパイロットを使って開発した実例と、プロンプト駆動型開発のプロセス、AIが生成したコードのコードレビュー経験を紹介する。
色覚特性を持つプロダクトデザイナーが、自身の経験を通じて色覚多様性とデザインの関係を述べた記事。色だけに頼らない設計思想の大切さと、異なる見え方を組み合わせることの価値を説く。