👉 独学で未経験からWebデザイナーになるためにやった全てを公開

【2018年】Webデザインを独学で勉強する人に超おすすめの本29冊

Webデザインを独学で勉強する人に超おすすめの本29冊

 

デザインのスキルを高めたい!

勉強したい!

 

 

Webデザインのスキル・知識を

インプットしていくなら、

本や教材は必要不可欠ですよね。

 

 

しかし、Webデザインの本は基本的に値段が高く(平均2,000円〜4,000円)、さらに本の数もたくさんあるので参考書選びは非常に悩みますよね。

カンプ

こんにちは、未経験からWebデザイナーになったカンプです。

僕も当時はお金が全くなかったので本屋で1冊の本を買うだけで1時間以上迷う時もありました(笑)

 

僕の場合は独学で勉強してWebデザイナーを目指していたので、勉強用の本・参考書選びはかなり慎重に選んでいました。

Webデザイナーに就職する事ができた今でも新しい本を買う時は迷うわけで、初心者の人はとくに選ぶのが難しいと思います。

 

そんな迷える子羊の為に、Webデザインを勉強する人に「これを読んでおけば間違いない!」というWebデザインに関するおすすめしたい本・教材をピックアップしてまとめました。

紹介する本は全部で29冊(な、なんだってー!)

各カテゴリーに分かれており、自分が勉強したい学びたい本を選んでみて下さい。

 

この記事の目次

失敗しないWebデザイン本・教材・参考書の選び方

失敗しないWebデザイン本・教材の選び方

自分が教材を買う時のポイントを3つに分けて紹介します。

  1. Amazonでの評価を調べてから購入する
  2. 知り合いにWebデザイナーがいればその人が勉強してきた教材を借りる
  3. 有名なWebデザイナー関係のブロガーさんのオススメしている本を買う
出版されたのが新しい本が良いの?

そんな事ありません。

デザイン本に関しては5年以上経った今でも通用・参考になる本はたくさんあります。

気をつけたいのはデザインソフトやWordPress系に関する本は常にバージョンアップするので、情報が陳腐化していて使えない事もあるので新しい本を選んだ方が良いでしょう。

 

1 Amazonでの評価を調べてから購入する

情報は最大の武器です。

僕はいつも本屋さんに行き、まずは自分の目で教材の中身を少し確認します。

良さそうだなと感じたら次にその教材の名前をインターネットで検索します。

だいたいの教材の本はAmazonの商品として登録されているので、そこでAmazonレビューの評価を参考にします。

レビュー評価が10個以上あり評価☆が3.5以上ならある程度分かりやすい教材だなと判断し購入に至ります。

レビュー評価が少ない時はレビュー評価している方のコメントを全部読んでこれは自分に合いそうだなと判断すれば購入します。

ちなみに今から紹介するWebデザインの本は全てAmazon評価が3.5以上しかありません。

 

2 Webデザイナーが使っていた教材を借りる

教材をあまり買えない人はこちらの方法をおすすめします。

僕の周りにはWebデザイナーをしていた人が何人か居たので自分がWebデザイナーになりたいと相談したら、その方が使っていた教材をたくさん貸して頂けました。

お金も掛かりませんし現役のWebデザイナーさんが使っていた教材なので適当な教材を買うよりは確実なものがあります。

しかも人によってはもう見ない、使わないと言う方もいるのでタダで貰える可能性も高いです。

メリットばかりですが、しいてデメリットを言えば、貸してくれた方が勉強していた時の教材なので少し情報が古かったり、今では通用しない事があったりします。

と言ってもHTML、CSSやデザイン関係はそこまで昔と今で違いがあるわけでも無いのでほとんど大丈夫かな(15年前とかになると微妙だけど)

とまぁそれを差し引いてもメリットばかりなのでぜひ周りにWEBデザイナーの方が居ればお願いしてみて下さい。(最初はWEBデザイナーになりたいと相談から入るのがポイントです)

 

手軽に入門書や参考書を手に入れる方法

周りにWebデザイナーがいなければSNSを活用してみてはどうでしょう。

親切な人はネット上にもたくさんいますが、リアルに発展するとトラブルが出てくるリスクもあるので、慎重に自分が本当に信頼できる人がいれば教材を借りる・貰いましょう。

これは本当にあった話なんですが、僕はアメーバピグ上で仲良くなった主婦の人(実際に会った事はない)に「Webデザイナーになりたい」ことを伝えると、その方がWebデザイナーの仕事をしており、使っていない入門者や参考書をタダでたくさん頂きました。

カンプ

ネット上の出会いも捨てたもんじゃないですよね。

タダで貰いましたがちゃんとお返しはしましたよ!

 

3 有名なWebデザイナー関係のブロガーさんのオススメしている本を買う

特に日頃からWeb業界の事、技術関係の情報を提供しているブロガーさんのオススメする本は信頼性が高いです。

自分もブロガーさんが紹介している教材を何度か買いましたがどれも参考になるものばかりでした。ちなみにブロガーさん自身が出版している教材は個人的にはオススメしません

理由は教材内容がブロガーさんのブログ記事の内容を少し変えたものを採用しているとか、一度見た事ある情報などを記載されていると少し損した気分になってしまうので…

 

これらを踏まえた上で、僕が本気で選んだWebデザインの勉強に適したデザイン本・教材29冊を紹介していきます!

 

 

初心者におすすめのWebデザイン本・教材・参考書まとめ

初心者におすすめのWebデザイン本・教材まとめ

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

さまざまなデザイナーの方に絶賛されておりフルカラー新装増補版で再販されるほど。まさにデザイナーのバイブルでは無いでしょうか。

 

デザインの4つの基本原則を深く濃く分かりやすく解説しています。冒頭で、デザインの事を意識すればそれを支配し、それを所有し、それをコントロールできるようになると書かれているのですがまさにその通り。「デザインの知識なんて全く無い!」「デザインってセンスが必要なんでしょ?」そんな方に読んでほしい、全部読めばきっとデザインの概念が変わります。

新人Webデザイナーの仕事

実際にWebデザイナーはどんな仕事をしているのか?

制作現場の紹介や新人からベテランまでの現役Webデザイナーさんのインタビューなどが掲載されています。中身のそこまでありませんがWebデザイナーってこういうお仕事なんだぁと感じて貰える本だと思います。

なるほどデザイン

Amazonベストセラー1位

本書は新人デザイナーやデザインに興味のある全ての人に対して、デザインを「視覚的に楽しめる」形になっており、誰でもデザインを理解しやすい内容となっています。
図解で説明されている分、情報量はノンデザイナーズ・ブックなどに比べるとやや少なめ。

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

Webデザインに関する基礎知識を網羅しており、情報量はかなり多いです。
レイアウト、配色、写真、タイポグラフィー、HTMLとCSS、インタラクション、とかなりのボリュームになっていて、さらに読みやすい誌面でスキがありません。これからホームページを作成する人に参考になります。

 

実践で使えるWebデザインでおすすめ本・教材・参考書まとめ

実践で使えるWebデザインでおすすめ本・教材まとめ

現場のプロが教える WEBデザイン 新・スタンダードテクニック37

今時のWebデザインのトレンド解説から、具体的な実装方法まで細かく解説された本。

最近のトレンドや実践で使えるテクニックが多数掲載されているので、Webデザインの技術を上げたい人は要チェックです。
jQueryを使用したエフェクトや機能を実装するテクニックがまとめられています。

レスポンシブWebデザイン「超」実践デザイン集中講義

今や当たり前となったレスポンシブWebデザイン。

レスポンシブWebデザインのサイト設計やデザインの考え方、基本的な制作方法がしっかり身につきます。マルチデバイス対応サイトを作りたい人は参考になる本書です。

クリエイターの卵のためのWebデザイン集中講座

実際にプランニング、ワイヤーフレームの設計、デザイン制作、コーディング、公開と実際の制作現場と同じ流れを一から説明してくれています。

これを見ればWEBデザイナーの一通りの仕事の流れが分かります(勿論例外もありますが)

フリーランスを目指している方、実際の制作現場の流れを知りたいと言う方にはオススメ。ちなみに本書ではFireworksもしくはphotoshop、Dreamweaverのソフトを使う前提で解説しているのでご注意を

 

レイアウト・カラーでおすすめのWebデザイン本・教材・参考書まとめ

レイアウト・カラーでおすすめのWebデザイン本・教材まとめ

レイアウト、基本の「き」

レイアウトができない人は「デザインの基本」がわかっていないからです。

この本ではデザインの基礎が明確にわかりやすくまとめられています。初歩的な所から、応用まで幅広く対応してくれるので、1冊持っていて損はないレイアウト本。

7日間でマスターする配色基礎講座

2000年に出版された本書ですが、配色に関する基礎知識が網羅されています。

色の作り出す効果と仕組みを理解することでWebデザイン全体のスキルがグッと高まります。配色に悩んでいる人はぜひ読んでみてほしい1冊。

7日間でマスターするレイアウト基礎講座

「7日間でマスターする配色基礎講座」と同シリーズの本書。

レイアウトデザインの基本、目的にあったスタイル、見た目の美しさ、初心者にもわかりやすく解説されたデザインの入門書。

「7日間でマスターする配色基礎講座」を購入した人は合わせてこちらも買っておいて損はありません。

デザインのルール、レイアウトのセオリー。

デザインの基本である、スペースの使い方、ジャンプ率などレイアウトのセオリーやグラフィックデザインの手法や原則を具体的に解説。

サンプルと実例で解説してくれるので、非常に分かりやすいデザインルールの見本帳。

ちなみにKindle版はとっても読みにくいです。

 

 

Photoshop・イラストレーターでおすすめのWebデザイン本・教材・参考書まとめ

Photoshop・イラストレーターでおすすめのWebデザイン本・教材まとめ

これからはじめるPhotoshopの本

これからPhotoshopを使い始める人にピッタリの1冊。

「画面の見方」や「画像の開き方」「写真の明るさの変え方」など初心者が知りたいであろう内容を丁寧に解説してくれます。これからPhotoshopを使ってデザインを覚えたいのであれば参考になる本書です。

プロになるためのWebデザイン入門講座 実践で役立つPhotoshop&Illustrator徹底ガイド

ブログ「Stocker.jp/diary」庄崎 大祐が著書のPhotoshop&Illustratorの制作テクニック解説本。制作効率を上げてWebデザインを作るかを重視した実践向けの解説内容となっています。

制作物を実際にWebで表示できるように、HTML/CSSコーディングの初歩まで学習できます。

フォトショップとイラレそれぞれの使い方を知りたい人は1冊でお得に勉強できる良本。

 

デザインソフトでおすすめのWebデザイン本・教材・参考書まとめ

デザインソフトでおすすめのWebデザイン本・教材まとめ

効率的なサイト制作のためのDreamweaverの教科書

表紙に見覚えがある方もいると思います。よくわかる○○教科書シリーズで有名な著書 鷹野 雅弘さんの教材です。さすがにさまざまなシリーズを出しているだけあって内容は簡潔的に写真も多く使われているのでとても分かりやすく解説されてました。Dremeweaverの基本的な使い方を覚えたいならこれ1冊あれば何も問題ありませんでした。

Fireworksレッスンブック Fireworks CS6/CS5/CS4対応

僕はphotoshopは無くfireworksでデザインを起こしていました。この教材は写真が多く初めての方でもすぐに操作を覚えれて身につけれると思います。後半にはWEBサイトのカンプデザインのレッスンもあるのでこれ1冊でfireworksを使いこなせれるでしょう。

関連記事 これだけは覚えて欲しいWebデザイナーに必要な3つのソフト

 

【HTML・CSS】コーディングでおすすめのWebデザイン本・教材・参考書まとめ

コーディングでおすすめのWebデザイン本・教材まとめ

HTML&CSSとWebデザインが 1冊できちんと身につく本

HTMLの構造、タグの使い方などと本当にHTMLとCSSの基本的な事を一から丁寧に解説してくれています。初めてHTML、CSSを学ぶこれから制作を始める人におすすめ

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

CSSは正しい書き方をしないと後々困ってきます。

本書では予測しやすい、保守しやすい、再利用しやすい、拡張しやすいCSSの書き方、プロの考え方を徹底解説。実際のCSS設計と実践を交えて解説していてWeb製作者なら読んでおくべきないようです。

CSSグリッドレイアウト デザインブック

CSSデザインを極めるならこの1冊。

CSSグリッドを使用したレイアウトの紹介、本書ではCSSグリッドでWebデザインを作成制作を通して解説してくれます。CSSグリッドリファレンスも付属されているので、まさにCSSのレベルを上げたい人にはおすすめ。

 

 

Javascript・jQueryでおすすめのWebデザイン本・教材・参考書まとめ

Javascript・jQueryでおすすめのWebデザイン本・教材まとめ

jQuery最高の教科書

jQueryが分からない初心者の方、これからjQueryを覚えたい・触りたいと考えてる方、そんな人に優しく丁寧にjQueryが解説してくれるまさにjQueryの入門書。

文法の説明やコードの意味も解説してくれている為、jQueryに苦手意識のある人にはうってつけの入門書です。

Web制作の現場で使うjQueryデザイン入門

今の時代、HTMLとCSSだけでなくJavascriptも使えないとWEBデザイナーとして厳しいです。jQueryはJavascriptを扱いやすくさせたライブラリーの1つでありjQueryをマスターできれば動きのあるサイトや今よりもっと使いやすいサイトを作る事ができます。この本はjQueryの基本知識から応用技まで細かく解説してくれています。改訂新版になりより一層分かりやすい1冊に。

スラスラ読める JavaScript ふりがなプログラミング

本書最大の特徴はプログラムにふりがなが振られている為、プログラムがわからない人、知らない人でも「それが何を意味してどう動くのか」とすぐに理解できます。
理解力が高まればプログラムの覚え方にも違いが出てきます。プログラミングって難しそうと思っている人に読んでほしい内容。経験者でも復習としても使えます。

 

 

WordPressでおすすめのWebデザイン本・教材・参考書まとめ

WordPressでおすすめのWebデザイン本・教材まとめ

いちばんやさしいWordPressの教本

ベストセラー
有名な『いちばんやさしいシリーズ』のWordPressの教本。

セミナー経験も豊富な著作陣が実践的なコツを織り交ぜて丁寧に解説。WordPressの最新バージョンに対応した手順解説が全て画像付きで掲載されているので、Webサイトを初めて作る人でも安心。

本当によくわかるWordPressの教科書

WordPressの教本はキャッチーなタイトルが多いですねw
ワードプレスの使い方を図解付きで丁寧に解説してくれています。ワードプレスを使ってWebサイトを作ってみたい人におすすめ。

 

 

ライティングでおすすめのWebデザイン本・教材・参考書まとめ

ライティングでおすすめのWebデザイン本・教材まとめ

沈黙のWebライティング

成果が上がる文章の書き方の実用入門書。

漫画形式で展開されるので読みやすく、理解しやすい。Webサイトやブログ記事だけでなく、ビジネス文章などにも活用できるライティング教本の決定版。

これまでライティングに関して意識がなかった人に読んでもらいたい1冊です。

SEOに強い Webライティング 売れる書き方の成功法則64

Webデザイナーは正しいSEOとライティングを理解しなければいけません。SEOとなってくるとマーケティングのレベルにもなってきますが、Webサイトで文章を書くのであれば読んで損はありません。売れる文章の書き方をプロの講師が教えてくれます。

 

 

IA/UI/UXでおすすめのWebデザイン本・教材・参考書まとめ

IA/UI/UXでおすすめのWebデザイン本・教材まとめ

インタフェースデザインの心理学

インターフェースデザインとは?
UIやUX設計になってくると初心者にはやや難しいかもしれませんが、Webデザインをやる以上は絶対に理解しておかなければ自身のデザイン力アップには繋がりません。

UIの具体的なデザイン手法が書かれているわけではないですが、人間の無意識の意識について勉強できる入門書。

誰のためのデザイン?

誰の為のデザイン?何の為のデザイン?

一般的な商品がどうデザインすれば使いやすくなるのか、使いにくいのか、そのような理論が書かれています。本書を読むことでデザインのあり方への意識が変わり、身の回りにあるモノの見方が変わります。

感性が変わることでWebデザインにも自然と意識が向くことができます。専門分野を問わず一読の価値あり。

ほんとに使える「ユーザビリティ」

本書はUXデザインの第一人者 エリック・ライスが、豊富な事例をもとにユーザビリティの問題を洗い出し、解決するための手法をまとめた実践的ガイドブック。

ユーザビリティについて考える癖を身につけたいのであれば、読んでおきたい1冊。

 

勉強用のWebデザイン本・教材は何冊ぐらい揃えれば良いのか

勉強用のWebデザイン本・教材教材・本は何冊ぐらい揃えれば良いのか

正直これは人によります。

1冊で十分な人も居れば、10冊必要な人も居るかもしれません。

僕は自分で購入した分、知り合いから借りた分を合わせると10冊ほどありましたが実際メインに使っていたのは2,3冊でした。

webクリエイターが平均的な教材にかかる予算は1万〜2万円といったところですね。

 買って損なし!初心者が読むべき本8選

カンプ

余裕のある方は上記の本を一通り揃えておけば大丈夫です

必須なのはデザインの知識、HTML、CSSの教材です。

この二つをWebデザイナーの基本中の基本であり、一番最初に覚えないといけない項目です。

ソフト関係は全部買うのが一番ですがソフトを持っていない、使わない方は買わなくて良いです。

ぜひ、ここで紹介した本を参考にWebデザイナーとしてのスキルを高めていきましょう!!

 

プロが教える!Webデザインスクール選びの決定版

webデザインスクールを探す

デザインスクール選びで困っていませんか? | gifmagazine.net

  webデザイナーとして就職するには、次のスキルが必須でしょう。  
  • illustrator、photoshop
  • HTML・CSS
  • JavaScript

これを見て、「全部できる」人は学校に行く必要はありません

独学でWebデザイナーになれるイメージが 面接や書類選考で必要になるポートフォリオを作成して、就職活動を始めてください。

逆に、「全然イメージが沸かない!」人は学校に行くことをお勧めします。

デザインスクールは時間とお金はかかりますが、この先に好きなことを仕事にするわけですから、先行投資は当然必要で、それも将来取り返すことができるものです。

このサイトでは「WebCamp」がおすすめです。

他にもプロが厳選したおすすめのWebデザインスクールを紹介しているので、ぜひチェックしてみて下さい。

詳細はこちら

↓ ↓ ↓

業界のプロが教えるおすすめWebデザインスクール5選