未経験者がWebデザインを独学で勉強する方法を徹底解説【現役Webデザイナー直伝】

このような悩みをお持ちの方のための記事です。

 Webデザインの「基礎スキル」
 Webデザインの「実践で使えるスキル」
 Webデザインの「発展スキル」
 Webデザインの「応用スキル」

と、Webデザインと言っても、各スキルによって学習方法は変わってきます。習得したいスキルに適した学習を行う必要があります。

そもそもWebデザインとは？

Webデザインとは、ページの訪問者が目にする全てのものをいいます。それは、サイトの装飾だけでなく、機能や動きなどユーザーのとって使いやすさも含めた広い概念として扱われています。

ここには目的があります。会社は自社のサービス、商品を購入してもらうことを目指します。つまり、Webデザインも、ブランドイメージを作り、対象顧客の購買につなげることが目的なので。

Webデザイナーを目指す前に知るべき前提

Webデザインの敷居は下がっている

Webデザインを取り巻く環境は徐々に変わりつつあります。実は、WebデザイナーでなくてもWebサービスが作れる「NoCodeサービス」の開始や「WordPress」の普及で、スキルのない人でもWeb制作は可能です。

Webデザイナーの守備範囲は徐々に侵されているのです。これらを考えた時に、今後必要なスキルは、上記では実現できない、企業のより細かなニーズに対応できるスキルと言えます。例えば、JavaScriptであれば最低限2つ以上のライブラリ(JavaScriptを使いやすくしたものと考えてください）を扱えたり、バックエンドやマーケティングのスキルがあれば付加価値が高まります。初学者の学習範囲ではありませんが、本質的でWebデザイナーの目指すべきところです。

長い道のりが覚悟できるか？

Web上では「未経験からプロ並みに」や「未経験からフリーランスを目指す」など甘い言葉が踊ります。確かに、HTML、CSS、そしてPhotoshopやIllustratorのスキルは、最短4週間で基礎を固めることができます。

しかし、企業が求めるレベルに行くにはその先の時間の方が圧倒的に長いのです。学んで終わりではなく、2-3年ごとに新しいスキルのアップデートが求められます。この長い道のりを覚悟し、学習を進めるべきなのです。

私もスクールでWebデザインのメンターを担当したことがありますが、生徒さんで、途中で挫折した方は、「フリーランスで仕事したいから」「未経験からの就職に有利だから」という理由の方が多く、逆に途中で挫折せず続けた方は、デザインすることが面白いと感じる方でした。こちらの記事にあるように、長時間を犠牲にすることになるため、諦めを思いとどまらせるものは、理屈ではない面白さだという点には強く共感します。
長く続く人に共通していたことは、デザインに対する理由のない「好き」という感覚や作りたいサービスへの「ワクワク感」が強いということでした。

Webデザイナーになるための必要スキルとは？

Webデザイナーは、グラフィックデザイナーのようにデザインのみではなく、HTML/CSSなどのコーディングスキルも必要となります。デザイナーとWebデザイナーの違いと言えます。

コーディングスキルは必要ないというWebデザイナーの方もいらっしゃいますが、企業案件を受けるとなると、コーディングスキルを所持していなければまず雇ってもらえません。

 参考：【初心者向け】大成するプロのWebデザイナーが大切にしている必要スキルとは？

基礎から応用まで学習ステップを徹底解説

Webデザインスキルの基礎から応用面までの学習ステップをまとめて紹介します！

最初にHTMLとCSSから初めてください。JavaScriptは毛色が違う言語であり、HTML、CSSの理解を前提とするため、応用と考えてください。また、Webデザインの基本はHTMLとCSSです。

PhotoshopとIllustratorの学習はそこそこにHTMLとCSSの学習により時間を割くと良いでしょう。

Webデザインを勉強する上で参考になるオンライン学習教材

以下は、日本でよく知られたサービスです。下記のコースを受けてみて、学習が直感的に「面白い」と思えば、Step3以降に進めても良いでしょう。

 参考：【有名Webデザインスクール比較】社会人向けおすすめスクール6つを徹底比較！

手を動かすことでしかスキルは身につかない

上記のStep1の後、Step2に移ります。この段階で基本的なタグやプロパティ(コードの書き方)の使い方を理解しています。Webデザインの学習で大切なことは、とにかく手を動かし、コードを書くことです。

例えば、Youtubeで「html css チュートリアル」や「html css 入門」で検索してください。参考になる短時間のコースが見つかります。分からないうちは、コードをまねて、コーディングに慣れてください。そして、分からない点が出てきたら、必ず調べる癖をつけてください。

独学でもWebデザインは学べるのか？

基本面(step2)まではWebデザインスクールに頼らずに独学でWebデザインは学ぶことができます。

ただし、一般的にはどれだけ頑張ってもStep4までです。それ以上はやはりどうしても限界が出てきます。また、独学の際は、以下に注意してください。

十分な時間が確保できるか？

上記のStep1からStep4まで1日10時間を使って、1ヶ月程度で進むことは可能です(人により差があります)。最低限、300時間程度は確保しましょう。

質問者、フィードバックをくれる人はいるか？

挫折する人の一番の理由は、自分でエラーを解決できないことです。

その場合に、すぐに人に聞ける環境であれば、「進んでいる」感覚を持ち、挫折しにくいです。また、書いたコードが良いのか悪いのか、初心者のうちは自分で判断できません。その際、近くにフィードバックをくれる人がいればスキルは上達します。まずは質問ができるオンラインコースなど(スクールではない)をお勧めします。

深堀はしないこと

例えば、HTMLだけでも全てを学習しようとすれば数ヶ月かけられます。しかし、それは効果的な学習とは言えません。プロのエンジニアでも調べながら業務をやっています。よく使う基本的スキルを学べば深掘りせず、次に次にと学習を続けていただくと良いですよ。

Webデザインスクールを活用する

Webデザインスクールを学習の初期段階から活用するというのも良い手でしょう。

最短距離で学習するなら、スクールの選択もお勧めです。

メンターの質を事前に確かめよ

実は、メンターと言っても卒業生であり、実務経験がない人も中にはいらっしゃいます。プロジェクトに関わった経験がないため、実務上のつまづきなど経験上のアドバイスができないのです。そこで、豊富な実務経験のあるメンターかどうかは、事前に確認してください。

コース終了後の就職紹介はあるか？

コース終了後に紹介できる企業案件数にスクールの力の差が表れます。紹介数が少なければ、自分で就職活動することとなり大変です。そこで、何件の紹介実績があるのか、直接聞くだけでなく、ネットでもリサーチしてください。

 参考：【有名Webデザインスクール比較】社会人向けおすすめスクール6つを徹底比較！

この記事のまとめ

独学のポイントは、Step4までの期間を効率よく終わらせることです。

Stepを更に進めようとすれば、実践的な企業案件を請け負うことが最も効果的です。そのために、案件獲得力のある企業に就職することが最も近道です。実際、チーム開発、バージョン管理など学習する項目は多岐に渡り、それを独学で行うことは無理があります。就職に強いWebデザインスクールに通う選択が有効なのもこの理由からです。

また、人によっては、別職種で入社し、エンジニアと仲良くなる中でプログラミングを覚え、部署移動する人もいます。多様な進路があるという点も覚えておいてください。