見やすく分かりやすい教材のつくり方──東京都のユニバーサルデザインガイドラインに学ぶ、色・文字・レイアウト・言葉の配慮
カテゴリ
教室には、色の見え方が違う子、文字を読むのが苦手な子、日本語を学び始めたばかりの子がいます。教材を受け取る保護者には、細かい文字が読みにくくなった人もいます。同じ教材でも、色の選び方や文字の大きさ、言葉の選び方ひとつで、伝わり方は大きく変わります。東京都は2025年3月31日、誰にでも見やすく分かりやすい色とデザインを目指す「TOKYOユニバーサルデザインガイドライン（視覚情報版）」を公開しました。都の職員向けの手引きですが、区市町村や民間事業者にも活用を呼びかけており、教材づくりにそのまま使える考え方が詰まっています。本コラムでは、このガイドラインをもとに、色・文字・レイアウト・言葉の配慮を整理し、教材やワークシート、テストに当てはめるときのポイントをまとめます。
この記事の要点
- 東京都は2025年3月31日、色の使い方に加えて文字、レイアウト、言葉、対象者別の配慮までを扱う「TOKYOユニバーサルデザインガイドライン（視覚情報版）」を公開した
- 色の配慮の基本は、色だけに頼らず白黒でも伝わるようにすることで、明るさの差、文字や記号の併用、形や線の種類、模様と境界線を組み合わせる
- 文字はA4の印刷物で12ポイント以上、ゴシック体やUDフォント、行間は文字サイズの3分の1から2分の1を目安にし、強調は太字などで行い斜体は使わない
- 教材では、ルビの量、専門用語の扱い、記入欄の大きさ、紙とデジタルそれぞれの読み上げ対応まで考え、白黒コピーやシミュレーションと利用者による確認で仕上げる
東京都の「TOKYOユニバーサルデザインガイドライン（視覚情報版）」とは
このガイドラインは、東京都福祉局が発行したA4判36ページの資料です。印刷物、Webサイト、案内サインなど、目で見て受け取る情報をつくるときの知識と配慮をまとめています。構成は、ガイドラインの趣旨と使い方、色覚の多様性の基礎知識、色・文字・レイアウトの工夫、対象者別の配慮、支援ツールとチェックリストの5章です。福祉局のWebサイトでは、PDF版のほか、読み上げソフトで読めるテキスト版と説明会の動画も公開されています。
2011年版から何が変わったか
前身は、2011年に作成された「東京都カラーユニバーサルデザインガイドライン」です。策定から10年以上がたち、2024年4月には改正障害者差別解消法が施行されて、行政機関だけでなく事業者にも障害のある人への合理的配慮の提供が義務づけられました。こうした変化を受けた今回の改訂では、主に3つの点が加わっています。
- 見え方の多様性：色弱者に加えて、白内障や緑内障の人、弱視の人の見え方を新たに載せました。
- 色以外の工夫：文字や記号の併用、図やイラストの挿入、ピクトグラムなど、色に頼らない伝え方を加えました。
- 対象者別の配慮：高齢者、障害のある人、外国にルーツのある人、子供などについて、困る場面と望まれる配慮を整理しました。
「色」から「視覚情報の全体」へ
ガイドラインは、2つの考え方を取り入れています。1つは、多様な色覚の人に情報が正しく伝わるよう配色や形を調整するカラーユニバーサルデザインです。もう1つは、色に加えて文字の大きさや形、レイアウト、図表、ピクトグラム、イラストなど、目で見る情報のすべてに配慮するメディアユニバーサルデザインです。旧版の名前に「カラー」が入っていたのに対し、今回の版は後者の広い範囲を扱っています。色の配慮の基本は、エデュコンのコラム「カラーユニバーサルデザインとは」「カラーユニバーサルデザインと教科書」でも紹介しています。
色や文字の見え方は、人によって違う
ガイドラインによると、色の見え方に違いがある色弱者は、日本人の男性の20人に1人、女性の500人に1人の割合でいます。男子が20人いる学級なら、1人いてもおかしくない割合です。代表的なのは赤と緑の見分けが苦手なタイプで、少数ですが黄と青の見分けが苦手なタイプもあります。
色覚のほかにも、見え方はさまざまです。白内障は目の中のレンズが濁る病気で、80歳代ではほとんどの人に何らかの症状が出るといわれ、淡い色の差が分かりにくくなります。緑内障では視野の一部が見えにくくなり、弱視の人は、ぼやけて見える、中央が見えにくいなど、人によって見え方が大きく異なります。また、年齢を重ねると青の感じ方が弱くなり、黒と紺のような暗い色の違いも分かりにくくなります。保護者や地域の人に配る教材やお便りでは、こうした見え方も考えておく必要があります。
見分けにくい色の組み合わせ
色弱者の多くにとって見分けにくいのは、赤と緑、青と紫、緑と茶色といった組み合わせです。白や黒が混ざった淡い色同士も見分けにくく、水色とピンク、灰色と水色、灰色とピンクは同じように見えることがあります。鮮やかな蛍光色も明るさの差がなくなり、黄色と黄緑、ピンクと水色の蛍光ペンは区別がつきにくくなります。赤を感じる錐体の特性が違うタイプの人には、濃い赤が黒とほとんど同じに見えます。
教材では、テストの丸つけの赤とヒントの緑、地図の色分け、グラフの凡例、重要語の赤字、蛍光ペンでの色分けなど、こうした組み合わせが出てくる場面が少なくありません。
色の配慮──色だけに頼らない
ガイドラインが最も大切なこととして挙げるのは、分かりやすい色にしたうえで、色だけに頼らず、白黒でも情報が伝わるようにすることです。具体的には、次のような工夫を組み合わせます。
- 明るさの差をつける：色相だけを変えるのではなく、明るい色、中間の色、暗い色を組み合わせます。高さを表す地図なら、緑から黄色へ色相を変えるより、暗い緑から明るい緑へ明るさを変えるほうが区別できます。
- 文字や記号を併用する：色の部分に色名を書く、記号を添えるなどして、色が分からなくても意味が分かるようにします。
- 形や線の種類を変える：グラフの凡例は色だけでなく○△□などの形も変え、折れ線グラフは実線・点線・破線と線の種類を変えます。凡例は離して置かず、グラフに直接書き込みます。
- 模様と境界線を加える：塗り分けには模様（ハッチング）の違いを加え、境目には細い黒や白の線を入れます。
色そのものの選び方では、強調に濃い赤ではなく赤橙やオレンジを使う、緑は青みの強いものを使う、淡い色同士を組み合わせない、細い線や小さな文字に黄色や水色などの明るい色を使わない、といった点が示されています。複数の色を使い分けるときは、見分けやすい色の組み合わせをまとめた「カラーユニバーサルデザイン推奨配色セット」も紹介されています。
教材に当てはめると
テストの正誤は、赤丸と緑のチェックではなく、○と×の形で伝わるようにします。理科や社会のグラフは、線の種類と直接書き込んだラベルで、白黒で印刷しても読めるようにします。重要語を赤字だけで示すと、一部の人には黒い文字と同じに見えるため、太字や下線と組み合わせます。学校では教材が白黒で印刷し直されることも多く、白黒で伝わることは色覚への配慮であると同時に、配布の現場への配慮にもなります。
文字とレイアウトの配慮
文字の大きさと書体
文字はできるだけ大きく表示するのが基本です。ガイドラインは、A4の印刷物では12ポイント以上が適切で、高齢者の利用が多い場合は14ポイント以上が望ましいとしています。書体は、太さが均一なゴシック体が小さな文字でも見やすく、「形が分かりやすい」「読みやすい」「読み間違いが少ない」ことを目指して開発されたUDフォントの採用も進んでいます。Webサイトでは、多言語に対応したNoto Sansなどの書体の利用も増えています。
行間・余白・強調
文字や行の間隔を詰めると、障害の有無にかかわらず読みにくくなります。12ポイントの文字なら、行間は4〜6ポイント（文字サイズの3分の1から2分の1）が目安です。情報を詰め込みすぎず、余白をとることも大切です。見出しと本文の文字サイズの差（ジャンプ率）を大きくすると、どこから読めばよいかが分かりやすくなります。
強調したいときは、書体や文字サイズを変える、下線を引く、白抜き文字にするといった方法を使います。斜体は読みにくいので使わず、赤による強調はほかの方法と組み合わせます。
教材に当てはめると
1ページに問題を詰め込むと、文字が小さく行間も狭くなりがちです。問題数を減らすか、ページを分けて余白を確保するほうが、多くの子にとって取り組みやすくなります。ワークシートの記入欄は、手を動かしにくい子でも書けるよう広めにとります。低学年向けや、読むことに困難のある子に向けた教材では、文字サイズと行間をさらに大きくとることを検討しましょう。
言葉の配慮
ガイドラインは、見た目だけでなく言葉の選び方も視覚情報のユニバーサルデザインに含めています。
- ルビ：難しい漢字や固有名詞には振り仮名を振ります。ただし、漢字を避けてひらがなばかりにすると、かえって読みにくくなります。対象の年齢に合わせて、漢字とルビの量を調整します。
- 言い換えと注釈：難しい言葉や略語は分かりやすい言葉に置き換え、専門用語や外来語には注釈を付けます。数字も、「全体の11％」より「9人に1人」のほうが伝わりやすいとされています。
- やさしい日本語：尊敬語や謙譲語を使わない、熟語より和語を使う、二重否定を避ける、一文には一つの内容だけを書く、といった工夫で、外国にルーツのある人や知的障害・発達障害のある人にも伝わりやすくなります。
教材に当てはめると
教科の用語は学ぶ対象そのものなので、言い換えてしまうわけにはいきません。その代わりに、問題文や指示文、解説、保護者向けのお便りなど、用語以外の部分をやさしい言葉にすることはできます。「次の問いに答えなさい」の指示が分からずにつまずく子もいます。何をすればよいかが一度で分かる短い指示文にすることは、学力を正しく測るためにも役立ちます。
対象者別の配慮
ガイドラインの第4章は、対象者ごとに困る場面と望まれる配慮を表にまとめています。教材づくりで特に関わりの深いものを挙げます。
- 子供：難しい漢字にはルビを振り、言い回しを平易にします。「危険！」より「あぶない！」のほうが伝わります。長い文章は簡潔にし、イラストやマンガも使います。紙の厚さや種類を年齢に合わせ、枚数を少なくすることも挙げられています。
- 発達障害のある人：読むことだけが苦手な人もいます。文字を大きくする、行間を空ける、UDフォントを使うといった工夫が役立ちます。
- 見えにくい人：本文を約22ポイントに拡大した大活字版の用意や、明るさの差を大きくすること、文章を箇条書きにすることが挙げられています。
- 日本語を母語としない人：漢字にルビを振る、やさしい日本語で伝える、イラストやアイコンを使うといった配慮が求められます。
- 肢体不自由のある人：記入欄を大きくする、めくりやすい紙や製本にするなどの配慮があります。
ガイドラインは、状況が重なることも多いため、当事者と一緒に対応を探ることも有効だとしています。
紙とデジタル、それぞれの配慮
紙の教材
紙の資料では、音声コードという方法があります。紙に印刷した二次元コードに文章のデータを入れておき、専用の読み上げ装置で音声として聞けるようにするもので、18mm角に日本語約800文字を記録できます。コードがあることが分かるよう、紙の端に切り欠きを入れておきます。前の節で触れた白黒でも伝わる配色や、大活字版の用意も、紙ならではの配慮です。
デジタルの教材
Webサイトやデジタル教材では、読み上げソフトへの対応が重要です。ガイドラインは、情報をテキストのHTMLで載せること、画像には代替テキストを付けること、予告なく新しいウィンドウを開かないこと、ブラウザで文字を拡大したときにきちんと大きくなるようにすること、単語の途中に空白を入れないこと、読み方が複数ある漢字に振り仮名を付けることを挙げています。画面の部品やコントラストの基準については「デジタル庁デザインシステム（DADS）とは？」、デジタル教材全体の配慮は「だれもが使えるデジタル教材のつくり方」で解説しています。
つくり方の流れと確認の方法
ガイドラインは、配慮した資料をつくる流れを4つの手順で示しています。
1. 対象者の特性を知る：誰が使うのか、どんな見え方や困りごとがあるのかを理解します。
2. 配慮して原案をつくる：色、文字、レイアウト、言葉の工夫を取り入れて原案をつくります。同じ色でも、塗る対象や見せ方によって見え方が変わることにも注意します。
3. ツールで確認する：いちばん簡単なのは白黒コピーです。ただし明るさの再現は正確ではないため、色弱者の見え方を再現するシミュレーションのアプリやソフト、見え方を体験できるメガネも使います。
4. 利用者に確かめてもらう：実際に使う人に見てもらい、問題があれば直します。色については、一般的な色覚と、赤や緑の見分けが苦手な2つのタイプの人による確認が望ましいとされています。
巻末には、基本の考え方、色、色以外の工夫、文字とレイアウトの4つに分けたチェックリストが付いています。教材の制作工程では、校正の段階でこのチェックリストを使うと、見落としを減らせます。
よくある質問（FAQ）
このガイドラインは民間の教材づくりにも使えますか？
使えます。都の職員向けの手引きですが、区市町村の職員や民間事業者にも参考にするよう呼びかけています。PDF版とテキスト版、説明会の動画が、東京都福祉局のWebサイトで公開されています。
2011年の「東京都カラーユニバーサルデザインガイドライン」とは何が違いますか？
2011年版が色の使い方を中心にしていたのに対し、2025年3月の版は、文字の大きさや書体、レイアウト、言葉の選び方、対象者別の配慮まで扱っています。白内障や緑内障、弱視の人の見え方も新たに載りました。
教材の文字は何ポイントにすればよいですか？
ガイドラインは、A4の印刷物では12ポイント以上が適切で、高齢者の利用が多い場合は14ポイント以上が望ましいとしています。低学年向けや読むことに困難のある子向けの教材では、さらに大きくすることを検討してください。
色の配慮ができているか、手軽に確かめる方法はありますか？
白黒でコピーや印刷をして、色がなくても内容が伝わるかを見るのが手軽です。ただし明るさの再現は正確ではないため、色弱者の見え方を再現するアプリやソフトも合わせて使うと確実です。
ルビはすべての漢字に振ったほうがよいですか？
そうとは限りません。ガイドラインは、ひらがなばかりにするとかえって読みにくくなるとして、対象の年齢や力に合わせて漢字とルビの量を調整するよう求めています。学年の配当漢字を基準に考えるのが一つの方法です。
まとめ
東京都の「TOKYOユニバーサルデザインガイドライン（視覚情報版）」は、色の配慮から一歩進んで、文字、レイアウト、言葉、対象者別の配慮までを一冊にまとめた手引きです。基本は、色だけに頼らず白黒でも伝わるようにすること、文字は大きく読みやすい書体で余白をとること、言葉はやさしく短くすることです。
教材では、テストの正誤やグラフの凡例、重要語の示し方、指示文の言葉、記入欄の大きさなど、配慮が効く場面がたくさんあります。対象者を知り、配慮して原案をつくり、白黒コピーやシミュレーション、利用者の目で確かめる。この流れを制作の工程に組み込むことで、より多くの子に届く教材をつくることができます。
エデュコンは、教材制作で企画から執筆までを、教材の組版（DTP）で読みやすいレイアウトを、図版・イラスト制作で色に頼らない図表を、校正・校閲で配慮の確認までを承っています。見やすく分かりやすい教材づくりについて、お気軽にご相談ください。
本記事は、東京都福祉局「TOKYOユニバーサルデザインガイドライン（視覚情報版）」（2025年3月31日公開）をもとに、エデュコン編集部がまとめたものです。
この記事を書いた人 / 監修
エデュコン教材制作チーム
創業以来、500社以上の教育機関様の教材制作を支援。
教育・IT・編集のプロフェッショナルが集まる専門チームが記事を監修しています。
この記事に関連する無料資料
記事のテーマに沿った資料を、無料でダウンロードいただけます。
-
図版の依頼は「指示の作り方」で仕上がりが変わる
図版作成・ご依頼のために知っておきたい３つのポイント
教材図版とは何かという基本から、制作の流れ、依頼時に押さえたい3つのポイントまでを解説する入門資料です。指示の不足で起こりがちな手戻りの例と、実際の図版指示から完成までの過程も…
無料でダウンロード -
教科図版からPRツールまで、制作物の実例を一冊に
図版・動画・デザイン事例
エデュコンが制作してきた理科・社会・英語・国語・数学の教科図版、イラスト、動画、PRツールの実例を集めたポートフォリオです。タッチや仕上がりの水準を、発注前の比較検討にお使いい…
無料でダウンロード
