濃いマスほど、このテーマでその指標が高いことを示します。
明瞭96
説得44
密度38
制作コスト58
課題適合80
仕事適合91
低高
短い答え
アクセシブルな可視化はいつ選ぶ?
次の条件に合う。公共ダッシュボード、試験、灰色印刷、法務スライド
いつ避ける?
次の場合は別の形にする。悪/良を赤/緑だけで示すこと
誰が作り、広めた?
石原表1917。WCAG2コントラスト。岡部・伊藤の2型色覚パレット
何を符号化する?
位置・パターン・ラベルなど冗長チャネル。色相だけではない
広告に使ってよいか?
Yahoo・LINE・Meta素材で主張が一目なら可。難しければランディングに図を置く。
課題に使えるか?
実験レポートとポスターで軸・単位・出典があれば通る。
アクセシブルな可視化は位置・パターン・ラベルなど冗長チャネル。色相だけではないとして値を載せます。石原表1917。WCAG2コントラスト。岡部・伊藤の2型色覚パレット。
業務報告・広告・課題では「公共ダッシュボード、試験、灰色印刷、法務スライド」に向く。「悪/良を赤/緑だけで示すこと」のときは別の形を選ぶ。
ソフト
- ソフト 1 — ExcelまたはGoogleスプレッドシート
- ソフト 2 — PowerPoint
- ソフト 3 — Figma / Illustrator — 広告・ポスターの図形
- ソフト 4 — Python matplotlib または R ggplot — 課題・研究図
- ソフト 5 — この図鑑のサーバー描画SVG — ライブラリなしの例
書き出し
- 書き出し 1 — SVG
- 書き出し 2 — PDF
- 書き出し 3 — スライドへ EMF/SVG(スクリーンショット禁止)
- 書き出し 4 — ウェブはSVG、印刷はPDF
アクセシビリティ
- アクセシビリティ 1 — 色だけに意味を持たせない。パターン・ラベル・位置を重ねる。
- アクセシビリティ 2 — 本文は 4.5:1、大きなマークは 3:1。
- アクセシビリティ 3 — チャートに短い代替テキスト。数値はHTML表でも。
- アクセシビリティ 4 — 動きは強調のときだけ。prefers-reduced-motion を尊重。
アクセシブルな可視化: 位置・パターン・ラベルなど冗長チャネル。色相だけではないを守り、「悪/良を赤/緑だけで示すこと」のときは別の図を選ぶ。