そこでWebデザイナーとしてのスキルを身に着けて就職・転職に活かしたいという人も増えていますが、「どんな学習方法を選べば効率的に学べるのかわからない」という声も多いようです。
まずは独学とスクールのメリットやデメリットを把握し、自分の目的やペースに合った学習方法を見つけてみましょう。
Webデザインを独学で学ぶ前に知っておくべきこと
Webデザイナーの将来性ってどうなの?
Webデザイナーの将来性を考えると、Webサイトの需要は今後も高まるいっぽうであり、需要も引き続き高いと思われます。ただし、Webデザイナーはエンジニアに比べると比較的誰でも学びやすい面があり、実力を問わなければ少し学習しただけで「Webデザイナーです」と言えてしまうところがあります。
そのため、簡単な作業しかできなかったり、デザインセンスがなかったり、クライアントの意図を理解しなかったりする人材は淘汰されていく可能性があります。
ちなみに、Webデザイナーはただ単純にデザインスキルさえあればよいのではなく、HTMLやCSS言語を使用してサイト化する力がないと即戦力とみなされません。プラスして、たとえば美術学校で基礎から学んでいる人や、テーマやコンセプトから企画をたてられる人材は貴重とされ、今後も必要とされるでしょう。
いずれにしてもクリエイティブな分野の仕事は、本人の実力次第で将来が大きく広がります。
Webデザインの独学を開始して習得にかかる目安期間
Webデザインの学習を独学で開始した場合、習得にかかる期間は約半年から1年程が目安となります。ただし習得にかかる期間は、ベースに持っている知識や、日々の学習に充てられる時間などによって、一人ひとりで大きく違います。例えば、集中して学習時間がとれる方や、既にある程度のデザインやプログラミング知識がある方は、半年以内でも基礎的なスキルの習得は可能です。一方で忙しくて勉強時間をとれない方やパソコン作業が苦手な方は、1年以上の期間を要することもあります。
上述したように、Webデザイナーとして仕事をするには、デザイン以外にもプログラミング言語やIllustrator・Photoshopなど、幅広いスキルが必要です。スキルは机に向かって勉強をするよりも、実際に手を動かして作るほうが、速く効率的に身に着けられます。ある程度の基礎が習得できたら、実践を通して基礎力のスキルアップを目指しましょう。
Webデザインを独学で勉強するのに向いている人
- コツコツ作業できる
- アーティスティックなセンス・クリエイティブなセンスがある
- 相手の求めるものを読み取れる
またWebデザイナーはクライアントが求めるものをデザインしカタチにするのが仕事です。デザインやスキルだけでなく、こうしたコミュニケーション能力もある人が向いています。
Webデザインを独学で勉強する前に準備するもの・必要なもの
- パソコン
- マウス
- デザインソフト(Photoshop・Illustratorなど)
- テキストエディタ
- デスク
またデザイン作業に使うソフト、代表的なのがAdobe社のIllustratorなどですが、これらも必須です。すべて揃えるとそれなりの金額になるので、最初はPhotoshopやIllustratorだけを契約して使う方法でも大丈夫です。
テキストエディタは必須とまではいいませんが、コーディング/プログラミングを行うのに使いやすい専用のエディタがあれば効率よく作業が進みます。同じようにデスクや椅子もなるべく快適なものを揃えましょう。
ここには挙げていませんが、独学をすすめて実際にサイトを制作してみる段階ではドメインやレンタルサーバー(作成したWebサイトをアップする)なども必要となります。
Webデザイン独学を続けるコツ
Webデザインの独学に向いている人は、予備知識がある人・関連業務を経験したことがある人です。たとえばWebデザイナーの必須スキルともいえるIllustratorやPhotoshopを使ったことがある人は、未経験者よりも短時間でスキルアップできるでしょう。さらにコーディングのスキルがあれば、Webサイト制作がスムーズに進みます。スケジュールの自己管理ができる人や自制心がある人も、学習時間を確保しやすいでしょう。仕事とプライベート、学習を両立しやすくなります。
働きながらなどWebデザインの独学が厳しい場合はスクールを利用する
Webデザインは、デザインだけではなくコーディングや企画、実装など幅広い内容を学習する必要があります。そのため、働きながら独学をしても、理解できない箇所もあるでしょう。その場合には、Webデザインスクールを利用することがおすすめです。スクールの講師は、現役のWebデザイナーが担っているケースが多くあります。現場で活かせるスキルをプロの講師から直接学ぶことで、短期間で即戦力となるスキルを身に付けられます。
Webデザインを独学で学ぶ勉強方法
Webデザインを独学で学ぶおすすめの方法は、以下の3つです。- 教本を参考にサイトを作成する
- ノウハウを公開しているサイトや動画で学習する
- スクールの無料体験などを利用し概要を掴んでから独学を開始する
教本を参考にサイトを作成する
独学でWebデザインを学ぶなら、教本は欠かせません。教本ではWebデザインの基礎を網羅的に学習できます。教本の流れに沿って学習して、実際にサイトづくりに取り組むことによって、Webデザインの基礎知識・スキルを身に着けられます。
単に眺めているだけよりも勉強した内容を実践することで、ツールに慣れることもできますし、スキルも圧倒的に身につきやすいです。Webデザイナーを目指す人向けの教本は多数出版されているので、評判の良い本を探して学習しましょう。
ノウハウを公開しているサイトや動画で学習する
最近はWebデザインの需要が高いこともあり、ノウハウを公開しているサイトや動画も多数あります。情報は玉石混交のため選ぶ必要はありますが、実際にプロのWebデザイナーとして活躍している人が発信しているサイト・動画で学ぶと、Webデザイナーに関する様々な情報を知ることができて、モチベーションのアップにもつながりやすいでしょう。またWeb・IT業界はどんどん新しい技術が出てくるので、新たな情報を得やすいのもメリットといえますね。なお、学習する際にはProgateやドットインストールなどのオンライン学習サービスもおすすめです。スマホだけで学習できるものも多いので、スキマ時間を活用しやすく、効率的に学べます。おすすめのオンライン学習サービスは、こちらの記事↓で紹介しています。
スクールの無料体験などを利用し概要を掴んでから独学を開始する
独学で学習する、と言っても「何からはじめるべきかわからない」「学習後は本当にWebデザイナーとして仕事ができるのか」と悩む方は多いのではないでしょうか。そこでおすすめの方法が、スクールの無料体験の活用です。Webデザインのスクールでは無料体験を実施しているところが多いです。スクールの無料体験では、Web制作の体験以外にも業界の情報を聞くことができ、Webデザインの概要や学習後のキャリアなどの全体感を掴めるようになります。学ぶべき内容も見えてくるので、学習もしやすくなるでしょう。
おすすめのWebデザインスクールは、後ほど詳しく紹介します。
Webデザインを独学で学ぶメリット・デメリット
Webデザインを独学で習得するのは難しい?何から始めるべき?
Webデザインを独学で学ぶ場合、学習の目的や内容、時間、ペースなどを全て自分で決めて取り組みます。Webデザインを独学で学ぶ際に「何から学習を始めればいいかわからない」という人が多いようですが、まずは学習目的や将来就きたい職種を考えることが大切です。方向性を明確にしたのちに、自分が学ぶべきスキルや継続しやすい学習方法が見つかるでしょう。
また独学ではモチベーションの維持が成果を大きく左右するので、自分に合った学習ペースを早期に確立することが大切です。自分に適正な方法で独学を続けることができれば、早々に現場で活躍する人材になれるかもしれません。
Webデザインを独学で学ぶメリット
Webデザインを独学で学ぶメリットは以下の3つです。- 費用を抑えられる
- 自分のペースで学ぶことができる
- 自分の好きな作品を作れる
また自分のペースで学習を進められるので、仕事やプライベートで忙しい人も空いた時間を活用できます。自分が作りたいサイトやプロダクトが決まっている場合は、独学によって最短で目標を達成できる人もいます。独学でデザイン制作を行ったという自信もつくでしょう。
Webデザインを独学で学ぶデメリット
以下はWebデザインを独学で学ぶデメリットです。- 最適な学習方法が見つからない
- 挫折しやすい
独学は一人で根気強く学習を続けることが大切ですが、モチベーションを保てずに挫折してしまう場合もあります。自分だけでは疑問を解消できないというのも、挫折の要因になるでしょう。
Webデザインを独学で学んで稼げる?

上記の調査結果によると、Webデザイナーを副業としている人はほぼ半数です。年収でもっとも多いのは200万円未満で40%以上です。200万円未満はたいへん幅が広くなるので、月に換算して2万円程度の人もいれば10万円くらいの人もいるでしょう。
副業でどれくらい稼ぎたいかにもよりますが、最初はお小遣い程度と思っていたほうがよさそうです。
しかし、実績がつき、クライアントから継続して案件を受注できるようになり、高額な案件を扱えるようになるフリーランスになれば年収400万円台以上も可能です。
さらに有名なWebデザイナーになれば、年収はうなぎのぼりで、ある意味上限がないのが「フリーランス」でもあります。とはいえ、現実には上記のように副業なら月々数万円、独立したらまず生計が立てられる年収300万円〜をめざすのが現実的です。
Webデザインの案件相場
クラウドワークスから、ランダムにWebデザインの案件を拾い出してみました。


内容や工程数によって、報酬は大きく変わります。ざっくり見ても、サイト制作では数万円〜10万円程度が多く、バナー制作などパーツ部分のデザイン制作になると何千円という単位です。こうしたクラウドソーシング型のサイトでは、高額な案件はわずかです。
最初は実績作りと割り切って報酬にこだわらずに受注するのもありです。
就職した場合のWebデザイナーの給与相場
「求人ボックス 給料ナビ」の2022年の求人統計データによると、Webデザイナーの正社員の給与相場は、月給37万円で、初任給は21万円程度が相場となっています。平均年収は約448万円となっており、平均の430万円と比べると高めの水準です。ただし年収のボリュームゾーンは、もう少し低め。Webデザイナーは現時点では比較的若い年代層が多いため、どうしても年収が低く出てしまいます。20代で年収300万〜400万であれば、実際にはかなり良い方でしょう。
これから実績を積み上げ、Webデザイナーとして「すべて任せられる」50代が増えてくるでしょうから、平均年収も上がってくる可能性が高いのではないでしょうか。
また実際に年収が高いWebデザイナーはフリーランスとして独立していることも多いです。売れっ子のWebデザイナーになると、年収が1,000万を超える人も実際にいます。それだけ「実力・実績」が重要だとも言えます。
参考:doda
Webデザインで案件数が多いWebサイト3選
クラウドワークス

クラウドソーシングで特に有名なのがクラウドワークスです。さまざまなジャンルが網羅されていますが、Web制作でもたくさんの案件が掲載されています。
ランサーズ

ランサーズもクラウドワークスと並んでクラウドソーシングの有名サイトです。ランサーズの特徴はワーカーがレギュラーから認定ランサーまでランク制度があること。コツコツ案件を受注し確実に成果を出していけば、認定ランサーへとランクアップしていきます。
レバテッククリエイター

レバテッククリエイターはクリエイターと企業をマッチングしてくれるエージェントサービスです。クラウドソーシングとの違いは、コーディネーターが間に入り、報酬の交渉や商談の設定など行ってくれる点です。
なかなか接点のない大手や上場企業の案件が受注できるチャンスも大きな魅力です。
Webデザインを独学で学ぶために参考にしたいサイト5つ
Webデザインの知識やスキルを伸ばしたい方は良質なWebデザインに数多く触れることが大切です。ここでは、Webデザインの参考にしたいサイトを5つご紹介します。straightline bookmark

straightline bookmarkは、国内外9000以上の幅広いWebサイトのトップページをまとめたギャラリーサイトです。カラー・業種・言語・レイアウトなどのタグでサイトを絞り込めるのが特長で、ブックマーク・お気に入り機能が付いているので後で見返しやすいのもポイントです。
掲載サイト一例
- 高松伸建築設計事務所
- TOKYU Garden City
- ラースパ麻布
- 蔵の宿
- 古民家宿TOKITOKI
- せきがはら人間村
- ダンロップタイヤ
S5 Sty!e

S5 Sty!eは、建築設計事務所や飲食店、中小企業の採用サイトなどのハイクオリティなWebサイトが集められたギャラリーサイトです。最新のWeb広告から、キャッチーでポップなデザイン、写真を美しく際立たせたデザインなどを学びたいWebデザイナーにおすすめです。
掲載サイト一例
- フェリシモ
- オトナミューズ ウェブ
- 株式会社WOWOW
- 毎日放送
- BEAMS BEAUTY
- Panasonic Design
- 株式会社野村建設
MUUUUU.ORG

MUUUUU.ORGは、国内外4000以上ののハイセンスなWebサイトを集めたギャラリーサイトです。カテゴリーが業界・デザイン・サイトタイプ・カラーに分かれており、目的に合ったWebサイトのデザインが探しやすく、サイト制作にWebデザインを参考にしたい企業やWebデザイナーにおすすめです。
掲載サイト一例
- 富士紡ホールディングスFUJIBO
- 株式会社三輝
- オムロンヘルスケア
- 有田焼 深川製磁
- 医療法人社団 西宮回生病院
- Vermicular House公式サイト
l/O 3000

l/O 3000は、抽象的なデザインを効果的に配置した美しくテーマ性のあるWebデザインが揃っているギャラリーサイトです。食べ物や商品の写真が際立つWebサイトも掲載されているため、ランディングページを制作したい企業やWebデザイナーにおすすめです。
掲載サイト一例
- 川崎胃腸科・内科クリニック
- 草津電機株式会社
- 日本海洋事業株式会社
- YOXOカレッジ
- ヌーベルバーグカンパニー
- 山田幼稚園
- 大塚製薬
retrobanner

retrobannerは、自動車やスマートフォン、食べ物やアクセサリーなど広告バナーのみを掲載しているギャラリーサイトです。広告バナーのように、小さなサイズで目を引くバナー制作の勉強がしたいWebデザイナーにおすすめです。
掲載サイト一例
- Rakuten Mobile
- SUBARU IMPREZA
- 国税庁による確定申告
- 四谷大塚
- ビビッドアーミー
- にしたんクリニック
- 丸亀製麺
Webデザインスクールのメリット・デメリット
Webデザインスクールとは
Webデザインを学べるスクールは、カリキュラム内容に沿って講義への参加や課題の提出、面談などを行うことでスキルが身に付くという形式がほとんどです。スクールごとに習得できるスキルや費用、期間や独自のサービスなどさまざまです。特にマンツーマンでのメンタリングやオリジナルの学習計画作成など、受講者が挫折しにくいサポートを用意しているスクールもあります。
スクールに通うことで必ず技術を得られるわけではなく、Webデザインを学ぶ目的や積極的に学ぼうとする姿勢が大切です。
Webデザインスクールのメリット
Webデザインスクールのメリットは以下の3つです。- 必要なスキルが効率よく身につく
- 最新情報を学べる
- 経験者と交流できる
- 就職支援が充実している
また日々進展するWebデザイン業界では、最新のソフトを扱うスキルが評価されることもあります。Webデザインスクールでは時代に合ったスキルを指導しているので、現場で求められる技術を身に着けられます。
プロ講師や現役Webデザイナー、他の受講生と交流できるイベントを実施しているスクールもあります。さらに就職支援が充実しているスクールでは、ポートフォリオや履歴書の作成指導が可能です。プロのアドバイスを受けられるというのはWebデザインスクールならではのメリットでしょう。
Webデザインスクールのデメリット
Webデザインスクールのデメリットは以下の3つです。- 受講費用が高い
- 受講期間内に時間を確保する必要がある
- 自分に合ったスクールが選べない
またスクール選びで迷ってしまい、なかなか学習を始められない人もいるでしょう。 各スクールの特徴をふまえて自分に合ったスクールを選ぶことが学習継続への第一歩です。
Webデザインを独学ではなくスクールでスキルアップするコツ
Webデザインスクールでスキルアップするためには、自ら学ぼうとする姿勢が大切です。講義や個別指導を受け身の姿勢で聴いているだけでは技術が身につかず、費用や時間を無駄にしてしまいます。学んだことを復習して、他の受講者と差をつけましょう。受講期間内になるべく多くの学びを得ようという意識があると、Webデザインスクールの効果的なカリキュラムをより有効に活用できます。
Webデザインが学べるおすすめスクール
独学で学ぶのに不安が残る人に、特におすすめしたいWebデザインが学べるスクールをピックアップしました。デジタルハリウッド STUDIO by LIG

- Web制作会社LIG(リグ)が運営するWebデザインスクール
- 制作会社だからこその実践的なスキルが学べる
- LIGの仕事に挑戦できる
独学だけでは物足りない人、即戦力をめざすならピッタリのスクールです。
コース | Webデザイナー専攻 |
受講料 | 495,000円(税込) |
期間 | 6ヵ月 |
授業スタイル | オンライン授業、対面授業 |
学べる内容 | Adobe illustrator、Adobe Photoshop、XD、Dreamweaver、デザインスキル、HTML5、CSS3、JavaScript、jQuery、Webサイトコーディング、レスポンシブデザインなど |
サポート | マンツーマンサポート体制 |
テックアカデミー Webデザイン

- 週2回マンツーマンのメンタリング
- 期間内で4つのWebサイトのリリース
- 受講終了後は副業の仕事の紹介とサポートもあり
TechAcademyのWebデザインコースは、オリジナルwebサイトを公開するのがゴールです。週に2回、ビデオチャットを使用しマンツーマンで指導を受けたり相談したりできるので、独学で挫折した人や続きそうにない人にも向いているスクールです。
コース | Webデザインコース |
受講料 | 社会人4週間プラン:174,900円(税込) 社会人8週間プラン:229,900円(税込) 社会人12週間プラン:284,900円(税込) 社会人16週間プラン:339,900円(税込) |
期間 | 4週間、8週間、12週間、16週間 |
授業スタイル | オンライン授業 |
学べる内容 | Adobe Photoshop、jQuery、HTML/CSS3、Sass、ワイヤーフレーム、Webデザインの原則、Adobe Creative Cloudコンプリートプラン3ヵ月分無償提供 |
サポート | 毎日15~23時のチャット・レビューサポート、テックアカデミーワークスを利用可能、メンターのサポート |
Famm(ファム)WEBデザインスクール

- 小さいお子さんがいるママが自宅で学びやすいスクール
- 自宅にシッターを無料で手配
- 平日午前中開催・1ヶ月でカリキュラムが完了
短期講座のため、案件獲得に不安が残りますが、講座を卒業するとFammより実際の案件を受注できるシステムもあり、小さな実績の積み重ねでフリーランス独立の夢も叶うかもしれません。
コース | コース名なし |
受講料 | 173,800円(税込) |
期間 | 1ヵ月 |
授業スタイル | ライブ配信 |
学べる内容 | Adobe Photoshop、Adobe illustrator、デザインの基礎、ワイヤーフレーム作成、フライヤーデザイン、HTML/CSS、ポートフォリオ作成など |
サポート | 講座以外の時間も質問可能、案件受注までをサポート、無料シッター利用サービス有り |
インターネット・アカデミー

- 豊富なWebデザインコースでさまざまなスキルを取得できる
- 対面(校舎)でもオンラインでも受講可能
- 東京藝術大学・気象庁などの制作実績を持つWeb制作会社「IBJ」による運営
受講途中でも案件を受注した場合にはその仕事に関してもプロ講師に質問ができるところも魅力。
専門スクールで講師や仲間と交流しモチベーションを保ちながら人脈を広げられるので、「ひとりで学んでもその後につながらない」と考えている方にも向いています。
コース | Webデザイナー入門コース、Webデザイナーコース、Webデザイナー総合コース、Webディベロッパーコース、Webデザイナー検定コース、Webデザイナー転身コース |
受講料 | Webデザイナー入門コース:209,000円(税込) Webデザイナーコース:367,400円(税込) Webデザイナー総合コース:760,760円(税込) Webディベロッパーコース:892,100円(税込) Webデザイナー検定コース:426,800円(税込) Webデザイナー転身コース:639,320円(税込) |
期間 | Webデザイナー入門コース:1~3ヵ月 Webデザイナーコース:3~4ヵ月 Webデザイナー総合コース:6~8ヵ月 Webディベロッパーコース:10~12ヵ月 Webデザイナー検定コース:3~4ヵ月 Webデザイナー転身コース:4~6ヵ月 |
授業スタイル | ライブ授業、マンツーマン対面授業、オンデマンド授業 |
学べる内容 | Adobe Photoshop、Adobe illustratorなど(コースによって内容は異なる) |
サポート | 質問対応サービス |
有料・買い切り型のWebデザイン講座
独学で学びたい理由のひとつとして「高い受講費を払いたくない・払えない」があります。有料ですが低価格で学べる講座サイトを紹介します。独学で学ぶプラスツールとして利用すると効率よく学習が進みます。Progate

- ビギナー向けプログラミング学習サイト・アプリ
- 有料でも1ヶ月税込1,078円
- 基礎から応用までさまざまなレッスンがある
Progateだけで完全にスキルをマスターできるかは微妙ですが、独学にプラスするにはピッタリの学習サイトです。デザインやソフトの使い方を独学で行い、コーディングはProgateで学ぶなど併用する方法がおすすめです。
Udemy

- 180,000以上のオンラインビデオコースがラインナップ
- 買い切り型なので何度でも視聴が可能
- 学びたいものだけ・必要なレッスンだけを選べる
たとえば上記のコースは40時間以上のオンデマンドビデオで、初心者がプロのWebデザイナーとして働けるレベルになることを目的としています。講座の詳細をよく見て、独学では足りない部分をカバーする内容を選ぶとよいでしょう。
Webデザインを独学で学ぶ方法まとめ
Webデザインを学びたい人は、独学かスクールのどちらかを決めましょう。まずは目的や方向性を考えたうえで、自分の生活リズムや費用などに合った方法を選ぶことが大切です。Webデザイナーとして仕事を受注するためには、確かなスキルと実績が必要です。Web業界は日々新たな技術が開発されているため、常に時代に合った制作ができるように学び続ける姿勢も重要視されています。自分に合った学習方法で、着実にスキルアップを目指しましょう。