ZeroPlus Gateについて

\ シェア /

FacBook
Twitter
LINE
はてブ
PPocket
ZeroPlus Media > Web制作 > Webデザイン > デザイン初心者におすすめの本10選!基礎・フォント・配色を正しく理解

デザイン初心者におすすめの本10選!基礎・フォント・配色を正しく理解

Webデザイン

2023/04/19

2025/12/11

デザイン本おすすめ 記事サムネイル

書籍はデザインに関する正確な知識を低コストで得られる点がメリットです。しかし、デザインに関する本は数えきれないほど出版されているため、あなたに合う一冊を見つけるのはなかなか難しい面があります。

そこで本記事では、デザインの基礎を学べる本を10冊紹介します。デザインの基礎がわかる本だけではなく、配色・フォントなどテーマを絞った本もピックアップしています。書籍を通じてデザインを学びたい人はぜひ参考にしてください。

この記事はこんな人に向けて書きました
  • デザインの基礎を学べる本を探している
  • フォントや配色などテーマを絞ったデザイン本を探している
  • 書籍を使った効果的なデザインの学び方が知りたい

ZeroPlus Gateについて

プログラミング学習でこのような経験はありませんか?

  1. 目標に向けて何を学べば良いかわからない
  2. 調べても解決策が見つからない
  3. 現場レベルのスキルが身につくのか不安

これらの悩みは、学習環境を整えることで全て解決することができます。

ZeroPlus Gateでは、30日間無料で最適な学習環境を提供しています。

  1. なんでも相談できる専属メンター
  2. いつでも技術相談ができるプロ講師
  3. 元IT企業CTO監修のカリキュラム

条件なしでこのレベルの環境を無料で提供しているのはZeroPlus Gateだけです。
ただし、無料サービスの提供には参加者の数に制限があります。

少しでも興味がある方は、以下のリンクからサービスの詳細をご覧ください。

ZeroPlus Gateの詳細を見る

デザインを基礎から学べるおすすめの書籍4選

まずはデザインを基礎から学べる書籍4選を紹介します。

  • なるほどデザイン〈目で見て楽しむ新しいデザインの本。〉
  • デザイナーじゃないのに
  • やってはいけないデザイン
  • ノンデザイナーズ・デザインブック

        これらの本を活用すれば、デザインの基礎的な知識を正確に押さえられます。

         

        1.なるほどデザイン〈目で見て楽しむ新しいデザインの本。〉

        デザインの基礎から考え方、制作プロセスまでを、豊富なビジュアルとわかりやすい文章で解説したロングセラーの入門書です。「誰に・何を・なぜ伝えるか」といった、目的からデザインを組み立てる考え方を、身近な例えや図解を交えながら学べます。

        読むと身につくこと

        • デザインをロジックで捉える視点
        • 情報の優先順位づけと「主役」を決める考え方
        • フォント・色・レイアウトで印象をコントロールする感覚

         

        2.デザイナーじゃないのに

        デザインの基礎をマンガ形式でわかりやすく学べる入門書です。事務員の主人公「ゆい」が、突然チラシ制作を任され、先輩・デザイナーからの添削を通して成長していく物語が描かれています。知識ゼロの主人公に自分を重ねつつ読めるため、「デザインを学ぶ最初の一冊」として手に取りやすい書籍です。

        読むと身につくこと

        • デザインの4大原則(整列・近接・対比・反復)の基礎
        • 余白・色・メリハリなどの最低限の実践スキル
        • デザインの良し悪しを言語化できるようにする思考法

         

        3.やってはいけないデザイン

        デザイン初心者が陥りがちな「NGデザイン」を、ビフォー・アフター形式で学べる一冊です。なぜ「素人っぽく」見えるのか、どう直せば印象が整うのかがやさしく解説されています。チラシやショップカード、SNS投稿、イベント告知など、初心者が最初に手がけやすい制作物を題材に、ありがちなNGポイントを理解できます。

        読むと身につくこと

        • 素人っぽさをなくすためのレイアウト改善
        • フォント・色選びの基本と使い方
        • NG例 → OK例で学ぶ「直し方の思考」

          \無料でWebデザイナーに必要な「HTML/CSS」を学べる/

          ZeroPlus Gateの詳細を見る

          60秒で学習を始められる!

          4.ノンデザイナーズ・デザインブック

          デザインを学んだことのない「ノンデザイナー」に向けて書かれた、20年以上読み継がれている定番の書籍です。優れたデザインに共通する「4つの基本原則(対比・反復・整列・近接)」を、良い例/悪い例を比較しながら論理的に理解できる点が特徴です。

          文章量はやや多めですが、その分読み応えがあります。デザインに関する本質的で深い学習ができるため、応用力を付けたい場合にぴったりの一冊です。

          読むと身につくこと

          • 4つの基本原則の理解
          • 情報を整理し、読みやすく伝える構成づくり
          • 色彩やフォントの基礎

          そもそも書籍でどうやってデザインを学べばいいの?

          デザインには十人十色の学び方があります。本を手にしたとしてもどのように学習をしていくか迷ってしまうのではないでしょうか?ここではWebデザインスクール「ZeroPlus」を運営する株式会社TOMAPで、クリエイティブ業務を統括するSamさんの学び方を紹介します。

          1. ノンデザイナーズ・デザインブックだけ読んでみる。
          2. 「あ〜作りたいな〜これ!」と思ったもの(なんでもいい)をとにかく見よう見まねで作ってみる。
          3. 見よう見まねで作っても絶対同じようにならないので、検索しながら学んで作っていく。試行錯誤しながらお手本に近づけていく。
          4. 飽きてきたら、一回リセットして違うものを作る。するとできなかったことが不思議とできるようになっていたり。

                こちらのインタビュー記事では、Samさん流のデザインの学習方法についてご覧いただけます!

                フォント・文字組みを学べるおすすめの書籍3選

                次にフォントや文字組みを学べる本を3冊紹介します。

                1. フリーフォント便利帳 同人制作・ノンデザイナーのためのフォント入門TIPS
                2. フォントのふしぎ ブランドのロゴはなぜ高そうに見えるのか?
                3. ほんとに、フォント。フォントを活かしたデザインレイアウトの本

                文字組みやフォント選びは読みやすさやデザインの印象を大きく左右します。これらの本を活用して理解を深めていきましょう。

                1.フリーフォント便利帳 同人制作・ノンデザイナーのためのフォント入門TIPS

                100種類以上の高品質なフリーフォントを、豊富な実例とともに紹介するフォント入門書です。「どのフォントを使えばいいのかわからない」といった初心者のつまずきポイントを、丁寧な解説でフォローしてくれます。

                作例は同人誌・漫画・小説制作などが中心ですが、デザインに通じる内容が多く、一部のフォントは特典としてダウンロードして活用できます。

                読むと身につくこと

                • フォントの基礎知識
                • 用途に合ったフォントの選び方・組み方
                • 著作権・使用許諾の理解と安全なフォント利用方法

                     

                    2.フォントのふしぎ ブランドのロゴはなぜ高そうに見えるのか?


                    欧文書体デザイナーとして世界的に活躍する小林章氏が、街角の写真270点をもとに「文字の不思議」を解き明かす書籍です。

                    高級ブランドのロゴが文字どおり「高級」に見える理由や、ヨーロッパの街並みを形づくる文字のルールなど、フォントが持つ役割が解説されています。デザインの専門書というより「フォントを巡る世界散歩」と言ったおもむきで、旅する感覚で読める一冊です。

                    読むと身につくこと

                    • フォントが役割の本質的な理解
                    • フォントで高級感を演出する技術
                    • 欧文フォントの書体知識

                         

                        3.ほんとに、フォント。フォントを活かしたデザインレイアウトの本


                        フォントまわりのレイアウト改善に特化した実例集です。物語形式で、新米デザイナーがベテランの先輩からアドバイスを受けて成長していくプロセスを追体験できます。カフェ・ビジネス・ガーリー・ラグジュアリーまで幅広い作例をもとに「フォントでデザインの完成度をあげる方法」を学べる書籍です。

                        読むと身につくこと

                        • フォント選びの基礎(ウェイト・字間・行間・階層構造)
                        • 和文と欧文の組み合わせ方
                        • ジャンル別のフォントの選び方

                             

                            \無料でWebデザイナーに必要な「HTML/CSS」を学べる/

                            ZeroPlus Gateの詳細を見る

                            60秒で学習を始められる!

                             

                            配色を学べるおすすめの書籍3選

                            最後に配色を学べるおすすめの書籍を3冊紹介します。

                            • 見てわかる、迷わず決まる配色アイデア 3色だけでセンスのいい色
                            • 配色BOOK 色×イメージで見つける理想の配色
                            • 配色デザイン インスピレーションブック

                              配色は心理・感情に影響を与える重要な要素です。これらの書籍を使って配色についての理解を深めましょう。

                              1.見てわかる、迷わず決まる配色アイデア 3色だけでセンスのいい色


                              配色に苦手意識がある人向けに「3色だけ」でセンスよく見せる方法をまとめた一冊です。シーズン・ナチュラル・モダン・エレガントなど、作りたいジャンルに合わせた配色のアイデアを見つけられます。

                              この書籍には続編にあたる『PART2』もあり、レトロ・サステナブル・海外風・エモカラーなど、トレンドのジャンルが追加されています。

                              読むと身につくこと

                              • 3色配色の基本と「黄金比」で整えるレイアウト感覚
                              • ベース・メイン・アクセントカラーの使い分け
                              • ジャンル別の配色例

                               

                                2.配色BOOK 色×イメージで見つける理想の配色


                                メインの1色から「演出したいイメージ」にあわせて配色を選べる実践型のデザイン本です。ピンク・オレンジ・ブルーなど8つの章に分かれており、各色にエレガント・ナチュラル・ポップなどテイスト別に作例が紹介されています。CMYK・RGB・HEX値も併記されているため、実務にすぐ活用できます。

                                読むと身につくこと

                                • メインカラーから逆算して配色を決める方法
                                • 色の組み合わせで印象がどう変わるかの理解
                                • 2〜4色の配色パターンの使い分け

                                 

                                3.配色デザイン インスピレーションブック


                                写真から色選びの着想を得られる、実践的な配色辞典です。自然・食品・ファブリックなど身近なものの配色がまとめられているのが大きな特徴です。レッド・モノトーン・メタルなど10色を軸に、トーン別の配色や、1色を足したときの印象の違いなどが収録されています。

                                読むと身につくこと

                                • 写真から配色を読み解く視覚的トレーニング
                                • 色を1色変える・足すことで生まれる印象の差
                                • トーン別の配色バリエーション

                                 

                                デザインの書籍を効果的に活用して学習を進めよう

                                デザインを学ぶうえで、書籍は頼れる味方です。正しい情報をもとに基礎から理解でき、必要なときにいつでも振り返れます。この記事で紹介した書籍を、用途別に一覧でまとめます。

                                種別

                                書籍名

                                主な特徴

                                デザイン
                                基礎

                                なるほどデザイン

                                デザインの考え方・目的設定・印象操作までを、

                                図解と実例で直感的に学べる入門書

                                デザイナーじゃないのに!

                                マンガ形式で、デザインの4大原則や

                                余白・メリハリの基本を楽しく理解できる一冊

                                やってはいけないデザイン

                                NG例とOK例の比較で、

                                「素人っぽさ」をなくす考え方と直し方が

                                身につく実践書

                                ノンデザイナーズ
                                ・デザインブック

                                対比・整列・反復・近接の4原則を、

                                理論と実例の両面から体系的に理解できる定番書

                                フォント

                                フリーフォント便利帳

                                フリーフォントの選び方・使い分け・
                                著作権の考え方まで

                                網羅した実践向けフォント図鑑

                                フォントのふしぎ

                                高級ブランドのロゴや街の看板を通して、

                                フォントが与える印象の仕組みを読み解く一冊

                                ほんとに、フォント。

                                フォント選びとレイアウト改善の具体例を、

                                ストーリー形式で学べる実例集

                                配色

                                3色だけでセンスのいい色

                                3色配色を基本に、

                                ジャンル別・トレンド別の配色アイデアを

                                豊富に学べる配色本

                                配色BOOK 色×イメージで
                                見つける理想の配色

                                メインカラーから逆算して配色を決められる、
                                実務向けの配色設計本

                                配色デザイン
                                インスピレーションブック

                                写真から配色の着想を得られる、
                                トーン別・色別の配色アイデア集

                                あなたの「読みたい」に合わせて、最適な一冊を手に取ってみてくださいね。ZeroPlus Mediaはあなたのデザイン学習を応援しています。

                                ZeroPlus Gateについて

                                プログラミング学習でこのような経験はありませんか?

                                1. 目標に向けて何を学べば良いかわからない
                                2. 調べても解決策が見つからない
                                3. 現場レベルのスキルが身につくのか不安

                                これらの悩みは、学習環境を整えることで全て解決することができます。

                                ZeroPlus Gateでは、30日間無料で最適な学習環境を提供しています。

                                1. なんでも相談できる専属メンター
                                2. いつでも技術相談ができるプロ講師
                                3. 元IT企業CTO監修のカリキュラム

                                条件なしでこのレベルの環境を無料で提供しているのはZeroPlus Gateだけです。
                                ただし、無料サービスの提供には参加者の数に制限があります。

                                少しでも興味がある方は、以下のリンクからサービスの詳細をご覧ください。

                                ZeroPlus Gateの詳細を見る

                                \ 学んだことをSNSでシェアしよう /

                                この記事の執筆者

                                ZeroPlus Media変種部

                                ZeroPlus Media編集部

                                ZeroPlusは、「フリーランス特化型プログラミングスクール」です。ZeroPlus Mediaでは、フリーランスとして活躍する際に役立つ有益なプログラミングやWeb制作に関する情報を発信しています。

                                質問について

                                ZeroPlus Media読者限定で質問対応をおこなっています。以下の2つの方法で質問を受け付けています。

                                選べる2つの質問方法

                                1

                                Google Foam(テキスト)で質問

                                mail

                                フォーム送信

                                メールで解答

                                formで質問
                                2

                                Google meet(オンラインmtg)で質問

                                meet

                                日時選択

                                メールを受け取る

                                メールからmtgに参加

                                meetで質問
                                ZeroPlus Gateについて

                                あなたの目的に合わせた2つのサービス

                                あなたの目的に合わせたZeroPlusの2つのサービス
                                基礎からフリーランスレベルまで本質的な学びを提供しています

                                完全無料!30日間で学びきれる
                                プログラミンスクールZeroPlus Gate

                                • お金をかけずに、学習を進めたい
                                • Webサイトを作れるようになりたい
                                • メンターや講師に質問しながら学習したい

                                詳しくはこちらから

                                フリーランス特化型
                                プログラミングスクール ZeroPlus

                                • プログラミング学習で悩んでいる
                                • 仲間と一緒に学習したい
                                • フリーランスとしての総合的な力を養いたい

                                詳しくはこちらから