知識ゼロの人向けに「WEBデザインの勉強のはじめ方」をまとめました。

知り合いにWEBデザインに興味ある人が結構いるんですが、一番最初の「WEBデザインってなに？」ってところでつまづいて、何から勉強を始めればいいか分からないという話を聞きます。

そこで、まだ勉強を始めてすらいない「レベル0」の人に役立つ基礎知識をまとめてみました！

WEBサイトは、デザインとコーディングで出来てる。

WEBサイトは、めちゃくちゃザックリ言うとこの2つで出来ています。

①デザイン（見た目を作る）
②コーディング（PCやスマホで見れるようにする）

①デザインは、見た目の部分を作ることです。写真を綺麗に加工して配置したり、文字の大きさやボタンの形を決めたりします。

②コーディングは、PCやスマホで見れる状態にすることです。ボタンをクリック出来るようにしたり、WEBサイトがネットから見れるようにします。

①デザインって、どうやって作るの？

専用のアプリを使います。主なアプリは「Photoshop、Illustrator、XD、Sketch、Figma」など。

アプリによって得意なことが違うので、Webデザイナーは複数のアプリを使い分けている人が多いです。

初心者がまず1つだけ覚えるとしたら、「Photoshop」がおすすめ。これひとつで、とりあえずはどんなサイトも作れます。有料で月額980円になりますが、必要な出費です。

デザインってどうやって勉強したらいいの？

まずは、Photoshopの使い方を覚えましょう。おすすめの勉強方法は、本を一冊買ってやることです。

ここではあくまでアプリの操作方法を覚えることが大事。Youtubeでも解説動画が見つかりますが、最初は一通りの操作を体系的に覚えた方がいいので、本がおすすめです。

「どうしても動画で勉強したい！」という人は、Udemyというサービスもいいですね。

次にするのは、デザインの理論を勉強することです。Webデザインはセンスや好みではなく「見てる人が使いやすいか」が大切です。そのためには配色やレイアウトのコツを知っておく必要があります。これも本で勉強するのがオススメです。

②コーディングって、どうやるの？

コーディングは、「VS Code」というアプリを使うのがオススメです。こちらは無料なのでこれから勉強する人には嬉しいですね。無料でも高機能で、プロも使っている強力なアプリです。

コーディングでは、まず最初に「HTML」と「CSS」を覚えましょう。これはWebサイトを表示させるための技術です。

といっても初心者は意味不明ですよね。それで大丈夫。HTMLとCSSは実際に自分で作りながら理解していくものなので、安心してOKです。

コーディングってどうやって勉強したらいいの？

HTMLとCSSを、実際に作りながら覚えましょう。そのためにオススメなのが「Progate」というサービスです。

とても分かりやすい上に、実際に画面に入力しながら覚えられるのが素晴らしいです。コースはたくさんあるので、まずHTMLとCSSを選んでやってみてくださいね。

まとめ

・Webサイトは、デザインとコーディングで出来てる
・デザインは以下の2つを勉強する
　1. 本でPhotoshopの操作を覚える
　2. 本でデザインの理論を覚える
・コーディングは、ProgateでHTMLとCSSを覚える

このあたりが最初のステップです。効率の良い勉強のコツは、少しでもいいから毎日やること。ぜひぜひ頑張ってみてくださいね！