2019年Webデザインの勉強に役立つ書籍・本

スポンサーリンク
book-4

こんにちは、美大卒・元アパレル店員の
ゆっきー(@elcielo_design)です。

今回は、Webデザインを学ぶ上で、
参考になるおすすめのデザインの書籍を
テーマ別に幾つか紹介しようと思います。

この記事の目次

Webデザインの学習に役立つ書籍

「テーマ別おすすめのデザイン書籍」

 テーマ
 書籍名
 ① デザインの基礎
 ノンデザイナーズ・デザインブック
 デザインの基本ノート
 デザイン入門教室
 ② Webデザインの基本
 いちばんよくわかるWebデザイン
 Webデザイン、これからどうなるの?
 Webデザイン良質見本帳
 ③ デザイン
  ツール 
 Adobe
 Illustrator 
 Illustrator しっかり入門
 Adobe
 Photoshop
 Photoshop しっかり入門
 Adobe XD  世界一わかりやすいAdobe XD
 UIデザインとプロトタイプ制作の教科書
 Sketch  UIデザイナーのためのSketch入門&実践ガイド
 ④ HTML・CSS 
  (JavaScript)

 いちばんよくわかるHTML5&CSS3デザイン
 HTML5/CSS3モダンコーディング
 Web制作者のためのCSS設計の教科書
 Web制作者のためのSassの教科書
 ⑤ デザインテクニック
 なるほどデザイン
 [買わせる] の心理学
 消費者の心を動かすデザインの技法61
 ⑥ レイアウト
 けっきょく、よはく。
 レイアウトデザイン見本帳
 レイアウトの意味と効果が学べるガイドブック
 ⑦ 配色
 配色デザイン見本帳
 配色の基礎と考え方が学べるガイドブック
 配色アイデア手帳
 めくって見つける新しいデザインの本
 ⑧ デザイン事例
 Webデザインのロジック
 2万回のA/Bテストからわかった
 支持されるWebデザイン事例集
 ⑨ レスポンシブデザイン
 

Webデザインをこれから学んでいく人、
現役のWebデザイナーの人にもきっと
参考になる書籍をピックアップしました。

それぞれ楽天ブックスとAmazon、
Kindleで飛べるようになっています。

スポンサーリンク

① デザインの基礎

「デザインの基礎となる書籍」

  • ノンデザイナーズ・デザインブック
  • デザインの基本ノート

  • デザイン入門教室

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

Web限らずにデザインを学び始める人が、
一番はじめに読んで欲しい書籍の一冊です。

内容もかなり分かりやすく書かれており、
デザイナーを目指していない方であっても
デザインの基本を知ることができますね。

デザインの基本ノート

デザインの基本であるレイアウト、配色、
印刷物でのデザイン、デザイン制作の流れ
色んな観点で書かれているデザイン基本書。

デザイン入門教室

デザイン入門教室もデザインの基本を
抑えることができる書籍の1つです。

内容もデザインの大切なところを一通り
紹介していて基礎をしっかり学べます。

(上記で紹介した2書籍よりは書店では
目に止まるところにありよく見かけます。)

② Webデザインの基本

「webデザインの基本が学べる書籍」

  • いちばんよくわかるWebデザイン
  • Webデザイン、これからどうなるの?

  • Webデザイン良質見本帳

いちばんよくわかるWebデザイン きちんと入門

 

先ほど紹介したデザインの基本とまた違い
こちらはWebデザインに焦点を置いた書籍。

「Webデザインとは何なのか」について
理解できる書籍の一冊になります。

Webデザイン、これからどうなるの?

Webデザインの現代 (トレンド) と
未来について語られている書籍。

グラフィック、タイポグラフィ、
UI、配色、レイアウト等について
デザインの動向を学ぶことができます。

今からWebデザインを学ぶ人だけでなく
現役デザイナーにも参考になります。

Webデザイン良質見本帳

色んなテーマ別のWebデザインを見れて
特徴、構成、見せ方などのテクニックが
わかるWebデザインの見本帳になります。

スポンサーリンク

③ デザインツール (ソフト)

「デザインツールの使い方が分かる書籍」

  • Illustrator しっかり入門
  •  Photoshop しっかり入門

  •  世界一わかりやすいAdobe XD
  •  UIデザイナーのためのSketch入門&実践ガイド

Illustrator しっかり入門

Illustratorの使い方を初心者に向けて、
丁寧に紹介しているイラレ入門書です。

Illustrato関連の入門書は多くありますが、
その中でも特に個人的におすすめのもの。

Photoshop しっかり入門

こちらもIllustratorの入門書と同じ
シリーズのPhotoshopの入門書です。
イラレと合わせて読みたいですね。

世界一わかりやすいAdobe XD
UIデザインとプロトタイプ制作の教科書

Adobe Illustrator/Photoshopと
合わせ使えるようになっておきたい
UIデザインツール「Adobe XD」の
使い方が勉強できる書籍になります。

基礎の基礎から制作テクニックまで、
しっかり紹介されているデザイン本。

UIデザイナーのためのSketch入門&実践ガイド

タイトル通りSkethの入門・実践書で、
Skethの使い方などが分かりやすくて
初心者のために書かれている一冊です。

シンボル・オートバランスの活用が
苦手な人はこの本が理解しやすいかも?

④ HTML・CSS

HTML・CSS、 JavaScript・JQuery等の
  知識や使い方が分かる書籍」

  • いちばんよくわかるHTML5&CSS3デザイン
  • HTML5/CSS3モダンコーディング

  • Web制作者のためのCSS設計の教科書
  •  Web制作者のためのSassの教科書

いちばんよくわかるHTML5&CSS3デザイン
きちんと入門

HTML・CSSの意味から始まって、
それぞれテーマごとにコードを
学んでいきける内容の書籍です。

初めてHTML・CSSを知るという方でも
大変分かりやすく、躓きにくいです。

HTML/CSS3モダンコーディング

この本もHTML・CSSを学べる書籍で
先ほど紹介した本よりは実践・応用
レベルの内容が充実した一冊です。

HTML・CSSの入門書を読み終えたら、
次に読んでみると良い一冊でしょう。
ちなみにJavaScriptも紹介されています。

Web制作者のためのCSS設計の教科書

この本はCSSの設計の面において
Webデザインの勉強になる書籍。

Webデザインのビジュアルは同じでも
実はコードが異なるということがあり、
コードを綺麗に書くことで管理や修正が
しやすくなることを説明してくれる一冊。

つまり、Webデザイン制作だけでなく、
Webサイトの運用も意識できる本です。

Web制作者のためのSassの教科書

SassというCSS管理をスムーズに効率的に
書けるための方法を紹介している書籍です。

Webデザイン制作会社で働きたい人などは、
特にチェックしておきたいところですね。

スポンサーリンク

⑤ デザインテクニック

「デザインのテクニックが学べる書籍」

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

なるほどデザイン

視覚的にデザインを学べる書籍で、
文字を読んで理解するのではなくて
図解やイラストで見て理解する感じ。

内容も面白く、スラスラと一冊
読み切ってしまえるデザイン本です。

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

デザイン制作において心理学を使う
テクニックがまとめてある書籍です。

普通のデザイン書籍で学べない観点から
アプローチをして書かれているので、
人の心理をつかむデザインの本質などを
理解できるであろう興味深い一冊ですね。

⑥ レイアウト

「デザインのレイアウトが学べる書籍」

  • けっきょく、よはく。
  • レイアウトデザイン見本帳
    レイアウトの意味と効果が学べるガイドブック

けっきょく、よはく。

「余白」を題材に書かれている書籍で、
余白(レイアウト)でデザインの良し悪しが
決まってしまうことを教えてくれる一冊。

内容的にはNG・OK例それぞれ比較でき、
具体的な場面を理解しやすくなっています。

レイアウトデザイン見本帳
レイアウトの意味と効果が学べるガイドブック

デザイン配色を色相・印象・年代別等に
見ることができるデザインの見本帳。

配色・レイアウトなどに困ったら、
アイデアの参考になると思います。

⑦ 配色

「デザインの配色が学べる書籍」

  • 配色デザイン見本帳
    配色の基礎と考え方が学べるガイドブック
  • 配色アイデア手帳
    めくって見つける新しいデザインの本

配色デザイン見本帳
配色の基礎と考え方が学べるガイドブック

配色の基礎知識、テーマ別の実践例が
書かれている配色デザインの見本帳。

レイアウトデザイン見本帳と合わせて、
持っておきたい参考本の一冊ですね。

配色アイデア手帳
めくって見つける新しいデザインの本

配色アイデア帳は配色の参考例が
3175種類という驚くほど豊富に
記載されている辞書的な書籍です。

⑧ デザイン事例

「実際のデザインの現場で役立つような
   考え方やテクニックなどが学べる書籍」

  • Webデザインのロジック
  • 2万回のA/Bテストからわかった
     支持されるWebデザイン事例集

Webデザインのロジック

実際のWebサイトの事例を見ながら、
Webデザインの意図を学べる書籍。

企業のWebサイトのデザイン過程を
知ることができてしまうのでかなり
貴重でありがたいデザイン本ですね。

2万回のA/Bテストからわかった
支持されるWebデザイン事例集

この本も実際のA/Bテストのデータから、
優秀なWebデザインの事例を挙げている
貴重なデザイン情報参考の書籍の一冊。

実は少しのデザインの違いがあるだけで、
反応や影響が大きく変わってくることを
教えてくてとても勉強になります。

⑨ レスポンシブデザイン 

準備中

最後に

Webデザインの書籍も沢山ありますが、
その中でも特に読んでよかったものや
有名で人気なものをピックアップして
テーマ別に一通り紹介してみました。

紹介した書籍全部とは言いませんが、
ある程度これらのものに目を通せば
Webデザインの土台は出来てきます。

書籍で学ぶことはデザインの知識等を
体系立て自分のものにしていけるので、
動画学習や制作しながら覚えるのとは
また違った学びの方法になってきますね。

書籍である程度、知識が身についたら
あとは手を動かしてはデザイン制作し、
数をこなしスキル面も高めましょう。

たまに、書籍を全部読んだからといって
出来たつもりでいても実際やってみると、
出来ない事も意外に多くあると思います。

そうならないためにインプットしたら
アウトプットすることは大切ですね。

スポンサーリンク

シェアする