Webデザインを独学で始めるのに何から勉強すれば良いか分からない初心者向けに、おすすめのWebデザインとHTML＆CSSの教材を紹介します。
ウェブデザイナーは独学でも転職や就職は難しくありません。ですが、どこまで技術を身に着ければよいのかを把握していないと時間が掛かってしまいます。
Webデザイナーに必要な知識やスキルはデザインだけでなくHTML＆CSSも必要です。ここで紹介する書籍で学習すればWeb制作を一通り学べるので、Webデザイナーを目指す方は参考にしてくださいね。
以下、 何から始めて、何が必要かを項目ごとに分類しました。
- デザイン全般の基礎知識
- Webデザイン、HTML＆CSSの基本からしっかり
- ウェブマーケティング知識
- 制作ツール系は書籍不要の理由
この記事の目次
デザイン全般の基礎知識
ウェブデザイナーになりたいけど「そもそもデザインとは？」という、基本や基礎から理解したい方におすすめの本です。
デザインの勉強や学習をすれば、デザインはセンスだけでは無い事が分かります。デザイン初心者でも自信を持ってデザインが出来る様になりますよ。
1.ノンデザイナーズ・デザインブック
「デザイナーでない人のための、デザインの定番基本書。」というだけあって、デザイン初心者にも分かり易いように「4つの基本原則」を解説してあります。
デザイナーを目指す人なら当然知っておくべき内容です。
読みやすいデザイン、伝わるプレゼン資料、わかりやすいレイアウト。これらは 「4つの基本原則」 を知る所から始まります。
2. なるほどデザイン〈目で見て楽しむ新しいデザインの本。〉
デザイナーがどんな事を気にかけ、どんな基準で良し悪しを判断しているのか。とてもわかりやすいサンプルで解説されています。
基本のキであるノンデザイナーズ・デザインブックに書いてある様な、デザインの基本原則を理解した後に読めば、より一層「なるほど」と思えるような内容です。
著者は新人を指導する立場の方だそうです。どうりで説明がわかりやすい訳ですね。
3. けっきょく、よはく。余白を活かしたデザインレイアウトの本
本当に上手なデザインは、読みやすく情報が整理され、余白を上手く使いこなしています。
デザインを始めたばかりだと、余白があるとついつい何かを足したくなるもの。余白を上手に使える様になると、読みやすく洗練されたオシャレなデザインになりますよ。
4.デザインの教室 手を動かして学ぶデザイントレーニング
かなり古いので買うかどうかは別として、デザインの基本的な理論や法則なども理解しておいた方が良いです。
普遍的な内容なので、今でも参考になります。
5.タイポグラフィの基本ルール
Webデザインでもフォントが重要な事に違いはありません。 バナーやメインビジュアルなどで活躍する機会が多いです。
デザインの中でもごまかしが効かず、上手い下手がすぐにバレてしまう部分です。 中身も濃く、丁寧に解説してある書籍なので一冊は手元に持っておくと良いですよ。
6.ほんとに、フォント。フォントを活かしたデザインレイアウトの本
新米デザイナーを先輩デザイナーが指導する会話形式で楽しく学べます。新米デザイナーが使ったフォントの何がダメだったのか？お手本を見せる形で解説していきます。
難しい理屈やルールよりも、改善前と改善後の事例をビジュアルで見比べたりする方が楽しいかもしれません。
フォントの勉強を始める最初の1冊目にどうぞ。
Webデザイン、HTML & CSSの基本からしっかり学習
WebデザインとHTML、CSSは切り離して考える事は出来ません。ウェブサイトでどんな事が出来るのか？どの様にサイトを構築するのかを知っている必要があります。
ウェブサイトのチュートリアルも良いですが、わかりやすくまとめられたコーディングの本も紹介します。
デザインの表現の幅を広げる為にも、WebデザインとHTML、CSSを並行して学習するのが効率的でおすすめです。
1. いちばんよくわかるWebデザインの基本
こちらもデザインの基本が書かれてありますが、紙のデザインとは違うWebデザインならではの解説が参考になる書籍です。
ウェブならではの表現やルール、今どきの技術的な事について学べます。
何かを深堀りした技術というより、Web制作で知っておきたい全般的な事を知れる書籍です。
2.コンバージョンを上げるWebデザイン改善集
Webサイトのデザインを改善するために役立つ実際の改善事例やTipsなど、ちょっと進んだ内容になります。
どの様にすればコンバージョンが上がったのか？実例を知る事は、逆に言うと、これから自分がデザインする際に気を付けるポイントでもあります。
例えば、面接でデザインの質問をされた際にこう言ったポイントについて答えられると説得力が生まれます。
3.あるあるデザイン〈言葉で覚えて誰でもできるレイアウトフレーズ集〉
Webデザインならバナーデザインなどで活躍しそうな、「あるある」なデザイン手法を45個のワンフレーズにまとめてあります。
例えば、「丸インパクト」で情報を目立つようにしよう！「さんかく散らす」でおしゃれな雰囲気に！そんな風にフレーズで覚えて活用する感じです。
デザインに困った時の引き出しとして使えますね。
4.1冊ですべて身につくHTML & CSSとWebデザイン入門講座
Webクリエイターボックスというサイトを見た事がある人も多いかと思います。運営されているManaさんはウェブデザイナーやコーダーなら知らない人がいないくらい有名な方です。
本当に丁寧に解説されているので、入門講座として凄く分かり易い内容です。
私は昔にサイトを見て勉強させて頂いてました。今では書籍としてまとめられているので間違いなくお勧め出来ます。
5.1冊ですべて身につくHTML & CSSとWebデザイン実践講座
先に紹介した入門講座の実践講座バージョンです。入門講座から一歩踏み込んだ内容になっているので、先に入門講座を読んでおくことをお勧めします。
単にWebサイトを作れるだけでは仕事になりません。プロのWebデザイナーやコーダーを目指しているなら読んだ方が良いです。
6. これだけで基本がしっかり身につく HTML / CSS＆Webデザイン1冊目の本
手を動かしてWebサイトを作りながらHTML/CSSとWebデザインの基本を楽しく学べる入門書です。
かわいいイラストで解説してあり、ステップバイステップ形式で飽きずに楽しく読み進められます。内容は、デザインよりもHTML、CSSが充実しています。
最初の1冊目として読んでみてはいかがでしょうか。
ウェブマーケティング知識
Webデザイナーになりたいのに何でマーケティングの勉強？って方にこそ読んで欲しいです。
Webサイトは運用して効果を出す事が最大の目的。紙のデザインと違い、デザインして終わりでは有りません。
レイアウトや文章を含めそのデザインで効果が出せたのかを測定します。マーケティングの専門家になる必要は有りませんが、デザイナーとして知っておきたい知識です。
1.沈黙のWebマーケティング アップデートエディション
前述したように、Webサイトは運用して効果を出す必要があります。Webデザイナーはデザイン面で効果の下支えをします。
だからこそ、どうすればサイトに訪問したユーザーの心を掴めるのかを知っておく必要があります。
Webマーケッター「ボーン・片桐」が活躍するマンガ風のストーリーと、理解を深めるための解説記事を交えた構成になっていて初心者の方でも楽しく読み進める事が出来ます。
Webマーケティングの世界は情報の移り変わりが早いので、買うならこちらの改訂版をお勧めします。
2.沈黙のWebライティング —Webマーケッター ボーンの激闘
出版されてかなり立ちますが、基本的な考え方は今でも役に立つと思います。先ほどのライティング版になります。
ECサイトを始め、 オウンドメディアやブログなど、 検索エンジンからのアクセスを集めるにはSEO対策が必要です。 検索エンジンとユーザーから評価される為に必要なライティングが学べます。
SEO対策はライティングだけでは有りませんが、とても分かり易い内容の為、記事を書くブロガーにも人気があります。
Web制作の武器として、マーケティングと一緒にライティングの知識もあれば確実に強みとなります。
3.現場のプロから学ぶ SEO技術バイブル(特典PDF付き)
書かれている内容が理解出来ていない様ではSEOは語れません。そんな一冊です。
Webサイトに実施すべき一通りのSEO施策に関して、その背景から実際の考え方、そして技術まで踏み込んだ実装方法をまとめています。
SEOにはどういった施策があるのか、どういった手順で取り組むべきなのか、そして、どのように実装していけば効果的なのか。マーケティング担当、SEO担当だけでなく、実装を担当するエンジニアにも役立つ内容です。
4.「やりたいこと」からパッと引ける Googleアナリティクス分析・改善のすべてがわかる本 改訂版
ウェブサイト内の知りたい部分、行った施策の評価等、どのように分析して、改善施策に活かせばよいのかの具体例の豊富さが特徴です。
「やりたい」「知りたい」ことから引ける目的別インデックス付きなので、必要な時にサッとページを開いて調べる事が出来ます。
著者はWebマーケティングの分野でとても有名な小川卓さんなので安心して読めます。
Web制作に携わるなら、せめてGoogle Analyticsの基本位は押さえておくべきです。マーケティング担当でなくても手元に置いておきたい1冊です。
制作ツール系の書籍は不要な理由
Webで制作で使うツールにはadobeのPhotoshopやIllustrator、XD・Figmaなどが必須です。ただし、無理して書籍を購入する必要はありません。
理由は、ツールのアップデートが早く、書籍を購入していてはツールの進化に追いつけないので無駄になってしまうから。
ネットで無料のチュートリアルが充実しているので、先にそれらをやってみる事をお勧めします。
まとめ – 書籍とオンラインを使い分けよう
書籍でWebデザインを勉強することもできますが、今ではオンラインで学べるサービスも沢山あります。
ウェブデザイナーは独学でも書籍やチュートリアルなどでも学習可能ですが、効率的に学ばないと時間が掛かるだけでなく質問も出来ません。
メリットは初期費用が安く、ウェブデザイナーが自分に合っているのか試す事が出来る事。
一方、スクールだと初期費用がある程度掛かります。
メリットは習得までに掛かる時間。詳しく質問できるスクールでHTMLやCSSと併せて学ぶ方が速いです。多くの場合、就活までサポートして貰える事も。
今の時代、ウェブ制作の知識がある事はそれだけでメリットがあります。この記事が参考になれば嬉しいです。
note
