Webデザイン学習におすすめな本の紹介

CFブログ

Blog

Webデザイン学習, Webデザイン独学方法

Webデザイン学習におすすめな本の紹介!

Webデザインに関する書籍ってたくさんありますよね。まだWebデザインを学び始めのとき、どんな書籍を選べばいいのかオススメを教えて下さい!

今日は実際にWebスクールの教室に置いている100冊以上の中から厳選した、オススメの書籍を紹介していきます。

Webで検索をして、デザインを学ぼうとしている方も多いと思います。
ですがWeb上には情報がありすぎて、その中から自分に合った情報を見つけて実践するのは大変です。
この記事では、CreatorsFactoryのスクール本棚に置いてあるデザイン本の中から、人気でためになるデザイン本を15冊紹介します。

この記事でわかること
・デザイン初心者から中級者までオススメの本とポイントが分かる
・自分のレベルや状況に合わせて選ぶべき書籍がわかる
・実際にWebスクールの本棚に並べ、生徒から人気の書籍を厳選

この記事の内容

漫画で学べる初学者さん向けのデザイン本

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

https://amzn.to/2QXTNZK

この本のポイント
・ノンデザイナーでも手に取りやすい漫画スタイル
・現実に近いストーリーベースでポジティブに学べる
・デザインの基礎とセットで、会社で通用するノウハウも掲載

漫画とイラストがベースになっていて読みやすいです。
帯にも「意識低い系」と書かれていて、手に取りやすい一冊です。

表紙にも「デザイナーじゃないのに!」と、叫ぶイラストがあって安心感がありますね。

素人ですが、デザインしてみました。
-プロのきほんが学べる14のストーリー-


https://amzn.to/3sKd6mo

この本のポイント
・デザインルールを擬音で表現していてわかりやすい
・作例や写真・画像が豊富でノンデザイナーにも親切
・漫画スタイルと優しいイラストでデザインが良くなるステップが見える

こちらも漫画形式で、がっつり学ぶというよりは、気軽にサクッと読み込める内容です。
どちらもわかりやすくスラスラ読み込めるので、デザインやデザイナーの仕事の概要を掴みやすいです。1つの1つのデザインルールが難しいと感じる人にもオススメです。

特にこの本の面白いところは、余白がないことを「ぎゅうぎゅう」、整列ができていなことを「ガタガタ」など、デザインのルールを擬音で表現しているところ。
イメージがしやすく作例も多く掲載されています。

デザイン業界でも王道のデザイン本

業界でも有名な、デザイン初心者さんも楽しく読める書籍を紹介します。
Webというよりはグラフィック、デザイン全般の基礎を網羅しているので、デザインの大枠を掴むのにもオススメです。

なるほどデザイン


https://amzn.to/3xhps9b

この本のポイント
・ひと目で「なるほど!」となる図解やイラストが豊富
・難しいデザイン書籍で挫折して、直感的に視覚でデザインを理解したい方にピッタリ
・情報整理やデザインをする前のプロセスもイラストでわかりやすく解説している

特徴としては、作例が多く掲載されている。OKパターンとNGパターンを比較しながら、題名の通り「なるほど!」と思える構成になっています。

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


https://amzn.to/3vjb2TY

この本のポイント
・やりがちな「NGパターン」と改善例をセットで豊富に掲載・解説
・センスや感覚と言われる部分を、言語化していてわかりやすい
・ノンデザイナーで自分でデザインをする必要のある入門者にオススメ

こちらも「こういうのはおかしいよ」というやってしまいがちなデザインのNGパターンとOKパターンを並べて、作例付きで詳しく解説しています。

特に初学者さんがやりがちな袋文字や、よくないグラデーション、多用してしまうドロップシャドウの注意点など、実際の現場でよく使う表現もたくさん事例があり参考になります。
新しい本じゃないけれど、個人的にはオススメする1冊です!

勉強をする前に予習として読んでもいいかもしれませんね。

本屋さんで探すときは、グラフィックデザイン(アート・印刷系)の棚に並んでいることが多いので、注意してくださいね。

有名なデザインの基本をコツを学べるシリーズ

次に紹介するのは、現在シリーズものとして発売されているデザインの学習本。
これもデザイン教本の中では有名です。

けっきょく、よはく。
余白を活かしたデザインレイアウトの本


https://amzn.to/3gPXs6T

この本のポイント
・「余白」に注目し、デザイン全体が良くなる余白の使い方がわかる
・デザイン全体の基本についても網羅しているので、入門にもオススメ
・NGとOKパターンを比較した今風な作例を多く掲載している

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

https://amzn.to/3aDh4qM

この本のポイント
・「フォント」に注目し、デザインでフォントをどのように扱うかの基本がわかる
・使用フォント名が詳しく記載されており、自学習にも役立つ
・こちらも作例の掲載が多く、前作の応用編

あたらしい、あしらい。
あしらいに着目したデザインレイアウトの本


https://amzn.to/3es8Cf7

この本のポイント
・つい過剰になる「あしらい」に注目した、丁寧なレイアウトの作り方がわかる
・NGパターンを改善した作例が多く、デザインの引き出しやアレンジに役立つ
・ポスターやPOP、印刷物のデザインをされる方にオススメ

シリーズ1冊目は「余白」にフォーカスしたデザインの基本を掲載しています。
こちらもOKとNGのパターンを比較しながら、多くの作例を見ながら余白の扱い方がわかるようになっています。

ある会社の先輩と後輩が登場し、後輩のNGデザインを先輩のアドバイスで直していくというストーリー仕立てですね。比較だけではなく、派生パターンの作例やこんなデザインもありだよ、といった実践向けのフォローがあるのもいいですね。

デザイン全般にフォーカスした内容なので、Webデザイナーが読んでも表現方法が広がり、デザインの基礎知識の底上げにもなります。本そのもののデザインもオシャレで、オススメの書籍。スクールではみんなが借りすぎてちょっとボロボロなってます(笑)

実践向けの手を動かして学ぶ書籍

トレース&模写で学ぶ デザインのドリル


https://amzn.to/3eq1rnE

この本のポイント
・1日1題のペースで実際に手を動かしながら学べるドリルタイプ
・素材がダウンロードできるので、すぐに手を動かして学べる
・トレースや模写のスピードが上がり、初心者から1抜けするにもオススメ

これは実際にデザイントレースや、作例を真似して技術を身につけるタイプの実践本です。
全部で30のお題があり、1日1題のペースなら約1ヶ月でデザインの基本がわかる構成になっています。
グラフィックの内容ですが、フォントやあしらいなどの様々な表現の練習に使えますね。

横長の書籍で読みやすいですね。ちょっと本棚からはみ出しそうですが…。

テキストや素材も見本がダウンロードできるので、すぐ手を動かせるのがいいところです。スクールの生徒さんも、中身を確認してから実際に買って勉強する人が多かったですね。手を動かすことが上達への近道。トレースや実践に悩む人にぴったりです。

初級・中級者向けのデザインおすすめ本

ここからは、初級・中級者さん向けのデザイン本を紹介します。
制作だけではなく設計や、ディレクションに関わる方にも参考になる書籍です。

これならわかる! 人を動かすデザイン22の法則


https://amzn.to/2QmRKyx

この本のポイント
・心理学やマーケティングを通した、デザインの考え方がわかる
・一手間で書いたくなる、伝わるデザインの作り方も解説
・商品販売やショップ運営に関わる方にオススメ

これは「読み物系」のデザイン本ですが、個人的にとてもよかったです。
マーケティングや心理学を通じたデザインの意識付けの話で、人の感じ方の法則や心理学の観点をプラスしています。
ここまで紹介してきた書籍で勉強をしてきた人の、次のステップにオススメできる1冊ですね。

内容は小説のような読み切りの形です。毎日少しづつ読むのもいいかもしれませんね。

[買わせる]の心理学 消費者の心を動かすデザインの技法61


https://amzn.to/3gIMrUR

この本のポイント
・Webサイト設計や人に商品を買ってもらうためのデザインについて解説
・61の技法それぞれに具体的な作例を掲載、デザインと心理面からアプローチする
・ネットショップ運営者やWebサイト設計に関わる方にオススメ

こちらも心理学やデザインの意識付けの書籍です。
商品が売れるのは、デザインがいいだけではなくて、人の心の動きや環境や状況で行動が変わるという視点から、どんなデザインを使えば行動や意識付けに繋がるかの61の技法を掲載しています。

22から61に。約3倍に増えましたね。

これもスクールの生徒さんがよく借りるので、ボロボロの1冊…。
ネットショップの仕事をしている人などが、よく読んでいます。
デザインと販売はとても密接な関係、買ってもらわないと意味がないのです。
より意味のあるデザイン、目的のあるデザインを求めている人にはオススメの2冊です。

知らないでは済まない!著作権について学べる書籍

著作権トラブル解決のバイブル! クリエイターのための権利の本


https://amzn.to/3aCCh49

この本のポイント
・デザイナーやクリエイターの著作権トラブルを豊富な事例から解説・対策する権利の本
・職業別の事例が豊富で、実際に起きたトラブルと解決・予防の知識をわかりやすく解説
・写真や挿絵イラストも多く掲載、全体の文章も丁寧に書かれて読みやすい

デザインの仕事をしていると避けられないのが「著作権」の問題です。
クリエイターの職業別によく起きる権利トラブルや、素材を利用するときの注意点、文章の引用やプログラムコードの扱いなどの事例がまとまった権利の本です。

権利や著作権って難しいけれど、知らないといけないことですよね。

例えば、素材を使うのに商用利用はNG、ライセンスを載せないと使ってはいけないのにフリーで使っていたりと、違いがわかっていない人も意外と多いんです。商用の仕事では、権利関係はナイーブで知らないでは済まないこともあり、お客さまに迷惑がかかることもあります。
ぜひ手元に揃えてほしい1冊です。

ディレクションやUXデザインの勉強に役立つ書籍

次に紹介する2冊はWeb制作をしている方にオススメの書籍です。
サイト設計についての本は意外と少ないのですが、この2冊はしっかりまとめられています。

Web制作者のためのUXデザインをはじめる本
ユーザビリティ評価からカスタマージャーニーマップまで


https://amzn.to/3tRcyfW

この本のポイント
・UXデザインという、体験デザインの考え方をわかりやすく言語化
・実践しやすいテンプレートがダウンロードでき、8ステップで順を追って理解ができる
・Webサイト設計や企画、開発に関わる方にオススメ

これは「UXデザイン」つまりサイト設計の部分に触れている書籍です。
Webサイト設計の基本から、お客さまがサイトに入ってからどのように流れていくのか…などの、UXに集中した内容になっています。

Webディレクションの新・標準ルール 改訂第2版
現場の効率をアップする最新ワークフローとマネジメント


https://amzn.to/2Qt9Kac

この本のポイント
・Webディレクションの「ワークフロー」に注目したWebディレクションの基礎が学べる
・進行管理はもちろん、企画から運用まで4つのフェースに分けて詳しく解説
・Webディレクションや企画、進行管理などを担う方にオススメ

こちらは、Webディレクターさんのワークフロー(仕事の工程)について書かれている書籍です。

UXデザインもディレクションも、なんだか敷居が高そうな雰囲気がありますね。

Webデザインの技術を突きつめていくと、最終的には設計側の話になってきます。
いわゆる「上流工程」と言われる、Webサイトを作る前段階のワークフローがWebデザインはとても重要なんです。
会社の中なら上司や先輩から学ぶこともできるかもしれませんが、実際には学べる環境が少なく「実践ありき」で語られることも多いです。

わかりやすくまとめられている本書でも、読んだだけではうまく理解できないかもしれません。でもまずは、読んでみて実行してみましょう。
わからないところは振り返って読んで、また実行する。成功と失敗を繰り返しながら読み進めるのがオススメの使い方ですね。
実際に仕事が来て、悩みながらこの書籍を読んで身につけていきましょう。

確かに後半になるにつれて、考えることがとても多くなっています。一回ではすぐに読みきれないですね。

特にWebディレクション本の内容は、経験したことがない人にとっては難しく感じるはずです。
でもサラッと読むだけでもWeb制作やWebサイトのルールや流れがわかるので、予習と思って読んでおくのもいいですね!

電子書籍版もあるんですね。これなら、空いた時間にも読めそうです。

デザイン系は実物の書籍がオススメですが、読み物系の書籍は電子書籍もありですね。

Webデザインの初中級者にオススメのWebデザイン本

最後に紹介するのは、お待ちかねのWebデザインのオススメ書籍です。

内容が多いので、分厚いですね…!

初心者からちゃんとしたプロになる Webデザイン基礎入門〈HTML、CSS、レスポンシブ〉


https://amzn.to/3sPFcN9

この本のポイント
・「1日30分からはじめる」をテーマにHTMLとCSSの基礎を学べる入門書籍
・コードの基本的な書き方から、サイトの公開・運用まで実践を想定した流れが学べる
・サンプルデータがダウンロードでき、学びと実践がセットになっている

「Webデザインの基礎入門」とありますが、内容はHTML/CSSが中心です。
内容は1日30分ずつから始められるよう簡潔に、わかりやすくまとまっていて実践しやすい構成になっています。
この書籍もシリーズがあり、JavaScriptなどを含む上級者向けの本もあります。

1冊ですべて身につくHTML & CSSとWebデザイン入門講座


https://amzn.to/3tS6Avl

この本のポイント
・Web制作の1から完成までを、優しく体系的に学べる
・サポートサイトや素材ダウンロードで、すぐに手を動かして実践できる
・入門と実践編の2冊があるので、自分のレベルに合わせて選べる

これは「Webクリエイターボックス」というブログを運営されている、Manaさんが書かれている書籍です。
入門講座編と、最近に実践講座編がシリーズで発売されました。
どちらもHTML/CSSが中心で、デザインと言うよりはコーディングをしていく内容です。

スクールでも人気で、常に誰かが借りている状態ですね。

この2冊はデザインの基礎というより、Webデザインを構築するコーディングなどWeb制作をする方にオススメです。
本の学習は作例がたくさん掲載されていて、ある程度厳選してまとまっているのがいいところ。
本屋さんでパラッと立ち読みして、面白そうだと感じたらぜひ購入してみてほしいですね。
もちろんたくさん買うと結構な出費になるので、Amazonなどのセール割引なども活用して、まとめ買いするのもいいですね

電子書籍と実物の書籍、どっちの購入がオススメでしょうか?

電子書籍もいいですがパラパラと読むのが難しく、ササッと見て「これ!」と読めるのはリアルの本のいいところです。
かさばるとか持ち歩きにくいデメリットもあるけれど、自宅の本棚にストックしてインスピレーションを得るために使うのもありですね!

学習したい内容に合わせて、オススメ書籍を選ぼう!

今回はWebスクールの教室にも置いてあるデザイン本の中から、オススメを15冊紹介しました。
自分のレベルや学びたいことに合わせて、ぴったりの書籍を選んでくださいね!

世の中にデザイン書籍はたくさんありますから、自分にあったものが見つかると勉強もスムーズに進みそうです。
ありがとうございました!

【あと3名】Webスクール9月スタート期生募集中!

 

クリエイターズファクトリーでは毎週、説明会・相談会を開催しております。
オンラインでも参加が可能となります。
受講生の9割が全くの未経験からWeb業界へ進んでいますので、不安を感じている方でも安心して受講いただけます。
詳しく聞きたい方は、説明会にご参加下さい。

まずは相談会にご参加ください

説明会では、詳細に受講内容を説明させていただきます。
お悩みの事や質問などは、お気軽にお聞きください。

活動レポート・ブログ

日々の活動やスクールの情報をまとめています