前回の記事で、WEBデザイナーに最低限必要な知識とスキルは以下の3つだと書きました。

  • デザインスキル
  • HTMLとCSSの基本的なコーディングスキル
  • WEB制作の周辺知識や著作権の理解

今回はこちらの3つの勉強方法を書いていきます。

デザインの勉強方法

まずはデザインの本を何冊か読んでみる

WEBデザインでも、DTPデザインでも基本的なルールは変わりません。
まずはデザイン一般のルールやデザイン関連の用語のような基礎知識を本で覚えましょう。

初心者におすすめのデザイン書籍

①デザインの原則を覚えるなら『ノンデザイナーズ・デザインブック』

ノンデザイナーズ・デザインブックはその名の通り、デザイナーではない人にもわかるように書かれたデザインの本で、デザインを初めて学ぶ人におすすめです。デザインの基本的な原則を学ぶことができます。5

②レイアウト方法と考え方を学べる『レイアウトデザインの教科書』

次におすすめしたいのが、レイアウトデザインの教科書です。
レイアウトには一定のパターンがあるため、覚えておくと応用も効きやすくなります。この本のいいところはデザインの考え方まで書かれていることです。自分が学び始めの時にこの本に出逢っていたらもっと早く上手くなれたのに!と思える本です。

③文字の扱い方を覚える『タイポグラフィの基本ルール』

デザインの原則も覚えて、レイアウトも組めるようになってきたけど「きれいな文字組がわからない」「文字の何を見て文字を詰めればいいかわからない」タイポグラフィの基本ルールはそんな人におすすめの本です。

HTML・CSSの勉強方法

①まずは初心者向けの本を1冊買おう

ProgateやUdemyなどオンラインの学習サイトもありますが、
それよりも、まずは初心者向けのHTML・CSSの本を1冊購入するのがおすすめです。

購入する際は以下の点に注目してください。

  • 発行年数が1~3年以内か
  • 「初心者向け」「基礎から学べる」「入門」など銘打たれたもの
  • 電子書籍ではなく、出来れば紙の本で買う

Web制作の技術は日々移り変わっていますから、4年も5年も前の本だと情報が古くて使い物にならない場合があります。
必ず、発行年数が新しくて、初心者向けのものを手に取ってみてください。

また、電子書籍よりも紙の本がおすすめです。
パソコンの横に置いたまま作業ができるので、スムーズに制作を進めることが出来ます。

②本を見ながらWebサイトを完成させよう

まずは、「本を見たり、ネットで調べながら1つのWebサイトを最後まで完成させること」をはじめの目標にしましょう。

出来れば複数ページのサイトで、レスポンシブ対応まで出来ると完璧です。

③Webサイトをもっとたくさん作ろう

Webデザイナーになりたいなら、Webサイトを沢山作る。
実践が一番の成長の近道です。

忘却曲線といって、人間の記憶は何もしないとどんどん失われてしまいます。

・20分後には42%を忘れ、58%を覚えている。
・1時間後には56%を忘れ、44%を覚えている。
・1日後には74%を忘れ、26%を覚えている。
・1週間後(7日後)には77%を忘れ、23%を覚えている。
・1ヶ月後(30日後)には79%を忘れ、21%を覚えている。
引用元:https://ferret-plus.com/4951

せっかく覚えたHTMLやCSSの知識も1度作っただけではどんどん忘れてしまいます…。

学んだ知識を完璧に定着させるために、
「1年以内に最低3つのWEBサイトを完成させること」を目標にしましょう。
複数ページのある公式サイトでも、1枚ペラのLPでも構いません。レスポンシブデザインにも挑戦してみましょう。

ここさえクリアできればその知識は一生モノになります!

「でもWEBサイトを作ると言っても、一体何のWEBサイトを作ればいいんだろう…?🤔」

▼そんな人にオススメなお題がこちら▼

  • 友達のお店やバンドのサイトを練習で作らせてもらう
  • サークルや部活の公式サイトを作ってみる
  • Vtuberの公式サイトを作らせてもらう
  • 既存のサイトを自分なりにリニューアルしてみる
  • 自分のポートフォリオサイトを作ってみる

などなど…。

もちろん、架空のお店やサービスを自分で考えてそのサイトを作るでもOKです👍

架空の課題でもリアルな課題でも一番大切なのは「WEBサイトの目的やターゲットを考えてデザインすること」「自分が作ったデザインを、何故このデザインにしたのか人に説明できること」です。

デザイナーと聞くとなんとなく感性やセンスで作ってそうなイメージがあるかもしれませんが、特にWebデザイナーは「なぜこのデザインなのか」の説明をを求められる場面が多いです。

「デザインだけやりたいけどコーディングもやらなきゃ駄目なの?🤔」

いずれはデザイン1本でやっていきたい人も、HTML/CSSの基礎知識は必須です。なぜなら、コーディングの知識が無いと「このデザインはコーディングで再現できるのか?」がわからないからです。

WEB制作の周辺知識の身につけ方

デザインやコーディング以外にも、どんなフローでWEB制作の仕事が進むのか?どんな技術がWEBサイトに使われているのか?を知っておきましょう。

「Webディレクション」でWeb制作の全体像を掴む

Webディレクションの新・標準ルール 改訂第2版 現場の効率をアップする最新ワークフローとマネジメントイラスト図解式 この一冊で全部わかるWeb制作と運用の基本 など、Webディレクター向けの本を読むと全体像が把握しやすいと思います。

会社員なら入社後に学ぶことが出来ますが、始めからフリーランスを志望している人には必須の知識です。

まとめ〜WEBデザイン初心者を脱するために〜

さて、ここまで来たら手元に本が無くてもHTMLやCSSが書けるようになっているのではないでしょうか。PhotoshopやXDといったデザインツールも問題なく使えるようになっていると思います。

更にデザインスキルを高めてグラフィックに強いデザイナーを目指すもよし、デザインもHTML/CSSもバランス良く出来るWEBデザイナーを目指すもよし、
プログラミングも出来ちゃうWEBデザイナーになるもよし、

「どんなデザイナーになりたいか」「どんな会社に就職したいか」を思い描きながら、ここからはどんどん得意なスキルを伸ばしていきましょう💪


(更に細かい勉強方法…デザインスキルの高め方、模写のやり方やソフトの使い方はまた今度の記事で紹介します)