デザイン文書のアクセシビリティに関する注記が不足していることを指摘し、アクセシビリティのためのアノテーションの重要性を解説した記事。
シェアックリップ
シェアされたアックリップです。
そのほかの #Figma ピックアップ
FigmaのAIアクセシビリティチェッカーが検出する6項目を、JIS X 8341-3(WCAG 2.0)の達成基準と比較分析。デザイン段階での検出の有用性と実装後の試験が必要な項目を整理。
WCAGで定義されるコントラスト比の計算方法と、デザインレビューで見落とされやすい3つの罠(グレー本文・背景色上の文字・プレースホルダ)を技術的に解説。
日本の企業・行政が公開している12のデザインシステムを、構築方針・アクセシビリティ・実装方法で分類・紹介。これからUI規則を整える組織向けの参考ガイド。
Figmaのコントラスト検査機能での一般的な誤りと落とし穴。WCAG 2.2やJIS X 8341-3の実務を踏まえ、正しい検査方法と設定の注意点を解説する。
Figmaのデザイン段階でカラーコントラスト比をJIS X 8341-3基準で検証する手法を解説。デザイナーがアクセシビリティを意識した配色を早期に検討できる方法論。
Figmaでプラグインを使わずにコントラスト比を確認するテクニック。デザイナーがアクセシビリティ要件を検証する実践的な方法を紹介。
そのほかの #UXデザイン ピックアップ
The Design + Accessibility Summit
デザイン専門家向けのオンラインサミット(第7回)。アクセシビリティの実装をマスターしたいデザイナーを対象とした、4日間の集中的なナレッジシェアと最新事例の紹介。
エシカルデザインの手法をインクルーシブ・アクティビティ・カードを使ったワークショップ。
非エンジニアがClaudeとGeminiを併用してWebアプリ開発した実践プロンプト集。アクセシビリティ要件の初期組み込みから、UI/UX調整、視認性強化、トラブル対処まで、実装プロセスと試行錯誤を解説。
CSS のネイティブ相対色構文(oklch、color-mix)を用いて、ダイナミックにコントラスト対応・wide-gamut 対応するカラートークン設計を解説。WCAG 要件を保ちながら 2026 年トレンドパレットを実装する方法を紹介。
長文記事にナビゲーション機能を加える際、本文へのアクセスを阻害しない設計原則。キーボード操作・スクリーンリーダー対応・フォーカス表示など複数の利用方法を前提とした実装パターンと確認方法を解説している。
親が1人で車椅子ユーザーの子どもを雨の中で乗せるときの身体的負担を7場面に分けて可視化。カバーの着脱と安全な乗せ下ろしが同時に必要な課題を指摘し、設計改善の方向を提案。
そのほかの #ガイドライン ピックアップ
Webアクセシビリティ対応の相談を案件として組み立てるフロー。調査・提案・試験から翌年点検まで、実務的に進めるステップを、A11yWorkFlowツールのサンプル資料を交えて解説する。
デジタル庁のウェブアクセシビリティガイドブック解説。アクセシビリティの対象範囲(一時的・状況的な障害を含む)、自動チェックツール の限界、試験による「準拠」の意味、JIS X 8341-3とWCAG の関係、適合レベル AA の試験体制を制作者向けに説明。
PDF のアクセシビリティタグ構造を解説したビデオ。Adobe Acrobat で使う一般的なタグと正しい実装方法を視覚的に示す無料ガイド付き。
PDFアクセシビリティの実装ガイド。見出し、リスト、表、図、リンク、フォームフィールドなどのタグ構造と、Adobe Acrobatでの修正方法を紹介。PDF/UA、WCAG対応。
Steamで販売されているゲームのアクセシビリティ機能表示の読み方と、購入前の確認ポイントを解説。自分に必要な条件を整理し、公式説明や体験版で実際に確認する手順を説明する。
生成AIが画像の詳しい説明を書いても、代替テキストとして使用する前に7点の観点で編集する必要があると解説。目的・意味・装飾性・機能・文字・図表・CMS実装後の確認を通じ、見た目の正確性ではなく「見られない人にも同じ情報へ到達できるか」を基準とすべき。