独学でwebデザイナーになろう!初心者・未経験者におすすめの本・参考書

独学でwebデザイナーになろう!初心者・未経験者におすすめの本・参考書
えりー
こんにちは、えりーです。

わたし自身、独学でwebデザイナーになりましたが、勉強方法の一つが「本(参考書)」でした。

本(参考書)だと手元に置いていつでも見返すことが出来ますし、知識の全体像を把握するのにも優れています。書き込んだりマーカーを引いたり出来るのも良いですね!

にゃーご
電子書籍より紙のほうが良いのかにゃ?
えりー
それは好き好きかな!持ち歩くなら電子書籍のほうが楽だし、書き込みたいなら紙のほうが良いよね!わたしは紙派だよ!

今回は、わたし自身が読んで良かった本(参考書)やわたしの周りで活躍している現役webデザイナーがおすすめしている本(参考書)をまとめてご紹介したいと思います。

数が多いので、目次から気になる本(参考書)にジャンプしてくださいね!

もくじ

独学でwebデザイナーになるためにおすすめの本・参考書【デザインについて】

デザイン全般について学びたい方におすすめの本・参考書
  • ノンデザイナーズ・デザインブック
  • なるほどデザイン
  • デザインのルール、レイアウトのセオリー。

【デザイン全般について学びたい方におすすめの本・参考書】ノンデザイナーズ・デザインブック

おすすめ度:★★★★★
デザイナーではない人のためのデザインの基本書。「デザインとは?」という基本的なところから学べます。デザインの「4つの基本原則」(近接、整列、反復、コントラスト)、名刺・チラシ・パンフレット・広告などをデザインする際のテクニック、活字を用いたデザイン等。これからwebデザイナーを目指す方にもおすすめです。

ノンデザイナーズ・デザインブック [第4版] [ RobinWilliams ]

【デザイン全般について学びたい方におすすめの本・参考書】なるほどデザイン

おすすめ度:★★★★★
「デザイン=楽しい」を実感できる新しいデザイン書籍。デザインする上で必要な基礎、概念、ルール、プロセスを図解やイラスト、写真などのビジュアルで解説しています。眺めるだけでも楽しいです。

なるほどデザイン 目で見て楽しむデザインの本。 [ 筒井美希 ]

【デザイン全般について学びたい方におすすめの本・参考書】デザインのルール、レイアウトのセオリー。

おすすめ度:★★
グリッドシステムやホワイトスペースの使い方、ジャンプ率などのレイアウトのセオリーと、アイキャッチやコラージュ、メタファーやタイリングなど、グラフィックデザインの手法や原則を具体的なサンプルと実例で解説した、現場のためのデザイン・ルール見本帳。webデザインだけでなくグラフィックデザインも学びたい、という方におすすめです。

【中古】【古本】デザインのルール、レイアウトのセオリー。 デザイン現場のための新しい教科書。/伊達千代/著【コンピュータ エムディエヌコーポレーション】

UIについて学びたい方におすすめの本・参考書
  • インターフェースデザインの心理学 – ウェブやアプリに新たな視点をもたらす100の指針
  • だから、そのデザインはダメなんだ。 WebサイトのUI設計・情報デザイン 良い・悪いが比べてわかる
  • 世界一わかりやすいAdobe XD UIデザインとプロトタイプ制作の教科書 世界一わかりやすい教科書

【デザイン全般について学びたい方におすすめの本・参考書】新人デザイナーのための Webデザインを基礎から学べる本

おすすめ度:★★
デザインの考え方の基礎から、「文字」「配色」「画像」といった各パーツごとの役割とその扱い方、そして使い勝手のよい「ナビゲーション」をいかに構築するか、それらを統合したさまざまな「レイアウト」を定番のパターンや豊富な作例を見ながら学んでいくことができます。

新人デザイナーのためのWebデザインを基礎から学べる本 [ 滝上園枝 ]

【UIについて学びたい方におすすめの本・参考書】インターフェースデザインの心理学 – ウェブやアプリに新たな視点をもたらす100の指針

おすすめ度:★★★
人々の心を捉えるにはどうすればよいのか?長年にわたりインタフェースデザインに携わってきた心理学者が「よりよいデザインに役立つポイント」を科学的な研究によって明らかにされた事実とともにウェブやアプリのデザインに応用できる形でわかりやすく解説。ユーザーインターフェース(UI)を学びたい方におすすめです。

【UIについて学びたい方におすすめの本・参考書】だから、そのデザインはダメなんだ。 WebサイトのUI設計・情報デザイン 良い・悪いが比べてわかる

おすすめ度:★★
情報デザイン設計の第一線で活躍する著者が、ユーザー視点に立った「本当に使いやすい」Webサイトを、○×形式でわかりやすく解説しています。ユーザビリティを学びたい方におすすめです。

だから、そのデザインはダメなんだ。 WebサイトのUI設計・情報デザイン 良い・悪いが比べてわかる【電子書籍】[ 香西 睦 ]

【UIについて学びたい方におすすめの本・参考書】世界一わかりやすいAdobe XD UIデザインとプロトタイプ制作の教科書 世界一わかりやすい教科書

おすすめ度:★★
Adobe XDの基本から機能を丁寧に解説し、サンプルサイト制作を通じてXDによる実践的なプロトタイプ作成・公開・共有・改善の流れを学べます。webデザイナーを目指す方はもちろん、将来的にwebディレクターを目指す方にもおすすめです。

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

Photoshop・Illustratorについて学びたい方におすすめの本・参考書
  • 世界一わかりやすいIllustrator & Photoshop操作とデザインの教科書
  • Photoshop / Illustrator 逆引きデザイン事典

【Photoshop・Illustratorについて学びたい方におすすめの本・参考書】世界一わかりやすいIllustrator & Photoshop操作とデザインの教科書

おすすめ度:★★★
「Illustrator」「Photoshop」の基本操作を1冊でマスターできます。「Illustrator」「Photoshop」初心者向けの入門書です。

世界一わかりやすい Illustrator & Photoshop 操作とデザインの教科書 CC/CS6/CS5対応 (世界一わかりやすい教科書) [ ピクセルハウス ]

【Photoshop・Illustratorについて学びたい方におすすめの本・参考書】Photoshop / Illustrator 逆引きデザイン事典

おすすめ度:★★
「Illustrator」「Photoshop」でやりたいことを逆引き出来る本です。「あれを作りたい」「これどうするんだっけ」からサッと引けて簡単にやり方がわかります。手元に置いておくと役立ちます。

独学でwebデザイナーになるためにおすすめの本・参考書【コーティングについて】

HTML・CSSについて学びたい方におすすめの本・参考書
  • HTML5&CSS3デザインブック
  • HTML5/CSS3モダンコーディング フロントエンドエンジニアが教える3つの本格レイアウト スタンダード・グリッド・シングルページレイアウトの作り方
  • スラスラわかるHTML&CSSのきほん 第2版
  • CSSグリッドレイアウト デザインブック
  • レスポンシブWebデザイン「超」実践デザイン集中講義

【HTML・CSSについて学びたい方におすすめの本・参考書】HTML5&CSS3デザインブック

おすすめ度:★★★★
「Webページのデザイン」=「ボックスを並べること」という視点で、ボックスのレイアウト手法を徹底解説。「ブログ・ニュース系サイト」と「ビジネス系サイト」の実例サイトを、1からパーツを組み立てながら作成。スマートフォンなど多様なデバイスに対応するテクニックを学べます。

HTML5&CSS3デザインブック ステップバイステップ形式でマスターできる

【HTML・CSSについて学びたい方におすすめの本・参考書】HTML5/CSS3モダンコーディング フロントエンドエンジニアが教える3つの本格レイアウト スタンダード・グリッド・シングルページレイアウトの作り方


おすすめ度:★★★
HTML5/CSS3を使ってモダンなサイトを制作するためのコーディングテクニックをハンズオン形式で学ぶ書籍です。現在主流のWebページのデザインスタイル、「スタンダードレイアウト」「グリッドレイアウト」「シングルページレイアウト」を適用した3つのサイトを作りながら、各スタイルの特徴や使い分け、コーディングテクニックを学びます。実際のWeb制作の現場と同様に、サイトのデザインを基にして骨格を見極め、枠組みから中身までひと通りコーディングするというフローをなぞることで、HTML5/CSS3の実用的なコーディングスキルやテクニックを無理なく身につけることができます。『HTMLとCSSはなんとなくわかるけれど、まだ一からサイトをコーディングするのは難しい』という方におすすめの本です。

HTML5/CSS3モダンコーディング フロントエンドエンジニアが教える3つの本格レイアウト スタンダード・グリッド・シングルページレイアウトの作り方/吉田真麻【1000円以上送料無料】

【HTML・CSSについて学びたい方におすすめの本・参考書】スラスラわかるHTML&CSSのきほん 第2版

おすすめ度:★★★
小さなサイト作りを通してHTMLとCSSの基礎が学べる入門書。PCだけでなくスマホやタブレットにも対応したサイトが完成します。コーディングの知識がゼロの方でも実習形式で一から覚えることができます。

スラスラわかるHTML&CSSのきほん 第2版 [ 狩野 祐東 ]

【HTML・CSSについて学びたい方におすすめの本・参考書】CSSグリッドレイアウト デザインブック

おすすめ度:★★
CSSグリッドレイアウトの入門書です。CSSグリッドを利用すると、もっと簡単・自由にレイアウトが出来るようになります。HTML5・CSS3の基礎がわかる方におすすめです。

CSSグリッドレイアウト デザインブック [ エビスコム ]

【HTML・CSSについて学びたい方におすすめの本・参考書】レスポンシブWebデザイン「超」実践デザイン集中講義


おすすめ度:★★
レスポンシブWebデザインのサイト設計やデザインの考え方、基本的な制作方法がこの1冊で習得できます。HTML・CSSはわかるけれど、レスポンシブがイマイチわからない、という方におすすめの本です。

レスポンシブWebデザイン「超」実践デザイン集中講義【電子書籍】[ 山崎 大助 ]

JavaScript・jQueryについて学びたい方におすすめの本・参考書
  • 確かな力が身につくJavaScript「超」入門
  • Web制作の現場で使うjQueryデザイン入門

【JavaScript・jQueryについて学びたい方におすすめの本・参考書】確かな力が身につくJavaScript「超」入門

おすすめ度:★★★
JavaScriptを一から学べる入門書です。JavaScriptをこれから始める人にも、前に挫折したことのある人にも。手を動かしてサンプルをひとつずつ作っていくことで、知識だけでなく、現場で活きる、応用・実践につながる基礎力がこの一冊で身につきます。『HTML・CSSはわかるけれど、JavaScriptは苦手…』という方におすすめです。

確かな力が身につくJavaScript「超」入門 [ 狩野祐東 ]

【JavaScript・jQueryについて学びたい方におすすめの本・参考書】Web制作の現場で使うjQueryデザイン入門

おすすめ度:★★★
HTML/CSSの知識をベースに、jQueryの基本的な使い方から、タブパネル、スライドギャラリー、カルーセルパネルなど商用サイトでおなじみのUIの作り方まで、100本超のサンプルでしっかり解説。改訂版ではjQuery 1.9とHTML5に対応し、スマートフォンやタブレット向けサイトのサンプルが追加されています。全サンプル商用利用可能・可変自由・著作権表示不要なので、業務でもすぐに活用できます。

Web制作の現場で使うjQueryデザイン入門改訂新版 (Web professional) [ 西畑一馬 ]

WordPressについて学びたい方におすすめの本・参考書

本当によくわかるWordPressの教科書 はじめての人も、挫折した人も、本格サイトが必ず作れる

【WordPressについて学びたい方におすすめの本・参考書】本当によくわかるWordPressの教科書 はじめての人も、挫折した人も、本格サイトが必ず作れる

おすすめ度:★★
WordPressでサイトを作るための入門書。「Webサイトを作ってみたい」と漠然と思っている人から、「一度WordPressを触ってみたけど挫折した」という人まで。HTML、CSS、PHPなどのプログラミング知識は一切不要。手順通りに操作するだけで、本格サイトが作れます&WordPressのことが分かります。

本当によくわかるWordPressの教科書 改訂2版 [ 赤司 達彦 ]

webサイト制作全般について学びたい方におすすめの本・参考書
  • 現場のプロが教える Webデザイン 新・スタンダードテクニック37
  • いちばんよくわかるWebデザインの基本きちんと入門
  • 新人デザイナーのための Webデザインを基礎から学べる本
  • Webデザインの新しい教科書 改訂新版 基礎から覚える、深く理解できる。

【webサイト制作全般について学びたい方におすすめの本・参考書】現場のプロが教える Webデザイン 新・スタンダードテクニック37

おすすめ度:★★★
「これからのWeb制作のスタンダード」となる手法をまとめた解説書です。近年のWebサイトでよく見られるレイアウト/ナビゲーション/エフェクト/UIパーツを、ステップ・バイ・ステップ形式で紹介しています。ドロップダウンメニューやスライドショーなどの基本から、背景全面動画やMasonryなどの流行の手法まで、いまのWebデザインに欠かせないテクニックを網羅。サンプルデータもダウンロードできるので、手を動かしながらコードの挙動なども確認できます。

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

独学でwebデザイナーになるためにおすすめの本・参考書【web制作全般について】

【webサイト制作全般について学びたい方におすすめの本・参考書】いちばんよくわかるWebデザインの基本きちんと入門

おすすめ度:★★★
レイアウト4つの原則とレスポンシブWebデザイン、 配色の基本と実例デザインの配色見本集、ユーザーの心を動かす写真と図版の使い方、タイポグラフィの選び方、フレックスボックス、インタラクション、マーケティングの知識までWebデザイナーに必須の基礎知識を網羅された解説書です。

いちばんよくわかるWebデザインの基本きちんと入門 レイアウト/配色/写真/タイポグラフィ/最新テクニック [ 伊藤 庄平 ]

【webサイト制作全般について学びたい方におすすめの本・参考書】Webデザインの新しい教科書 改訂新版 基礎から覚える、深く理解できる。

おすすめ度:★★
Webデザイン・Webサイト制作の「本当に必要な正しい基礎」を伝える入門書の改訂版。WWWやインターネットの仕組みを始まりに、サイト制作のワークフロー、HTML・CSSの技術的な解説、Webサイトを公開・運用するまでの基礎知識を、系統立てて解説しています。

Webデザインの新しい教科書改訂新版 基礎から覚える、深く理解できる。 [ こもりまさあき ]

まとめ:やる気さえあれば、本(参考書)だけでもwebデザイナーになれる!

今回は、独学でwebデザイナーになるためにおすすめの本(参考書)をご紹介しました。

わたし自身、独学でwebデザイナーになりましたが、やる気さえあれば本(参考書)の勉強だけでもwebデザイナーになることが出来ます!

わたしの場合、本(参考書)を買うとなんかワクワクしますし、やる気が出ます!やる気になるために本(参考書)を買ってみる、というのも良いかもしれませんよ。(もちろん、買うだけじゃダメなんですけどね…^^;)

少しずつ、楽しみながら勉強していきましょう!

ABOUTこの記事をかいた人

猫と気ままに暮らすフリーランスwebデザイナー。
芸術学科卒 → 超ブラック企業のホームページ更新担当(正社員) → 正社員よりも稼ぐフリーター → 制作会社(バイト→正社員) → フリーランス(今ここ)
苦労もたくさんしてきましたが、やっぱりwebデザインは楽しい!これからwebデザイナーを目指す人にもwebの楽しさを伝えたい!そんな気持ちで記事を書いています。