未経験からWebデザイナーになるには？求人倍率0.11倍の現実と練習方法

2026/10/5 （更新：2026/10/9）

Webデザイナー（Web制作会社）の平均年収は539.6万円、ハローワーク求人の月給は28.2万円、有効求人倍率は0.11倍です（厚生労働省 job tag、令和7年の賃金構造基本統計調査と令和7年度のハローワーク求人）。求人倍率はIT・Web系の職業の中でいちばん低く、「デザインだけできる人」は応募先で選ばれにくいのが現実です。

それでも、未経験から目指せない仕事ではありません。この記事では、数字の読み方を確かめたうえで、差をつける「デザイン＋α」の組み合わせ、段階ごとの練習と作るもの、採用で見られるポートフォリオのチェック表を整理します。

数字で見るWebデザイナーの仕事

job tag の「Webデザイナー（Web制作会社）」を、同じWeb系の2つの職業と並べると次のようになります。

有効求人倍率0.11倍は、仕事を探している人およそ9人に対して、求人がおよそ1件という意味です。Webサービス開発のSE（2.54倍）とは20倍以上の差があります。

読むときの注意が2つあります。1つは、これはハローワークの求人だけの数字だということ。Web制作の求人は民間の求人サイトや紹介会社にも出るため、実際の求人がこれだけというわけではありません。もう1つは、年収は経験者を含む全体の平均で、未経験の最初の年収ではないことです。今の年収との差はITエンジニアの年収くらべで計算できます。

Webデザイナーの仕事内容

• Webサイトやアプリの画面デザイン：レイアウト、配色、文字の大きさなどを決める
• バナーや広告画像の制作：SNSや広告で使う画像を作る
• コーディング（会社による）：デザインをHTMLとCSSで実際のページにする

job tag でも、仕事の中心はデザインとしつつ、HTMLやCSSを使ったWebサイトの制作が仕事内容に挙げられています。求人倍率が低い職種だからこそ、デザインに加えて何ができるかが応募のときの差になります。

差をつける「デザイン＋α」の組み合わせ

デザインの力に、もう1つの力を足すと、任せてもらえる仕事の範囲が広がります。

求人倍率がより高いWebサービス開発に近づくなら、コーディングを伸ばすのが近道です。学ぶ順番は未経験からWebエンジニアになるには？で、数字で効果を確かめながら改善する仕事に興味があるならWebマーケターの始め方で整理しています。どの組み合わせが自分に合うか迷う人は、IT職タイプ診断で2番目に強いタイプを確かめてみてください。

必要なスキル

デザインの基本は4つのルールから

初心者が最初に覚えると効果が大きいのが、次の4つです。

1. 近づける：関係のある情報同士はまとめて配置する
2. 揃える：要素の端をそろえて、整った印象にする
3. 繰り返す：見出しやボタンなどのデザインを統一する
4. 差をつける：大事な部分は大きさや色ではっきり目立たせる

この4つを意識するだけで、「なんとなく素人っぽい」画面がかなり整って見えるようになります。

段階ごとの練習と、作るもの

「教材を読み終えたか」ではなく、何を作れるようになったかで進み具合を測ると、次に進むタイミングがはっきりします。

1. 好きなサイトの模写

Figmaなどのデザインツールで、好きなWebサイトの画面をそっくりに再現してみましょう（無料で使える範囲は公式サイトで確認してください）。余白の取り方や文字サイズの差など、上手なデザインのルールが体で覚えられます。模写した作品は練習用にとどめ、ポートフォリオには載せないようにしましょう。

2. 架空のサイトをデザインする

「近所のパン屋さんのサイト」「趣味のサークルの紹介ページ」など、架空の依頼を自分で設定してデザインします。誰に向けて、何を伝えるページかを先に決めるのがポイントです。

3. HTMLとCSSでページにする

作ったデザインを、実際に動くWebページにしてみます。デザインとコーディングの両方ができる証明になります。

PR1冊ですべて身につくHTML & CSSとWebデザイン入門講座 第2版（Mana）楽天ブックスで見る →

4. ＋αの作品を1つ足す

上の「デザイン＋α」から1つ選び、それに合う作品を作ります。たとえばマーケティングなら「架空のパン屋さんの新商品の広告バナーを3案作り、どれをなぜ選ぶか」まで書くと、考え方が伝わります。

生成AIとの付き合い方

画像を作るAIを使えば、案はすぐにたくさん出せます。だからこそ、案を選び、なぜそれがよいのかを説明できる力がデザイナーの価値になります。仕事でAIの画像を使う場合は、権利や利用規約の確認が欠かせません。考え方は生成AIの画像は商用利用できる？、ツールの種類は生成AIの種類と使い分けでまとめています。ポートフォリオにAIで作った素材を使ったときは、どこにAIを使ったかを書いておくと誤解を防げます。

採用で見られるポートフォリオのチェック表

数は3〜5作品が目安です。数より、1つ1つの説明の丁寧さが大切です。提出前に、次の表で見直してみてください。

就職・転職の進め方

job tagでは、入職に学歴や資格は特に必要とされないもののデザインの基礎は必要で、制作会社に入って写真や画像の加工など素材作りから始め、徐々にページ全体のデザインを任されるようになる流れが紹介されています。まずはアシスタント的な立場で経験を積み、実績を増やしていくつもりで考えましょう。

学び方は、次の3つから選べます。

まずは本や無料の教材で1〜2か月続けてみて、続けられそうかを確かめてから判断するのがおすすめです。スクールを検討するなら、受講料を年収の増え方で何か月で回収できるかをスクール代の回収期間の計算ツールで先に確かめておくと、高すぎるコースを避けられます。ほかの職種と比べて決めたい人はIT職種の選び方も参考にしてください。

まとめ

• Webデザイナーの平均年収は539.6万円、ハローワークの有効求人倍率は0.11倍で、IT・Web系の中でいちばん低い
• だからこそ、コーディング・マーケティング・動画などの「デザイン＋α」で差をつける
• 練習は「模写 → 架空のサイト → HTMLとCSS → ＋αの作品」の順に、段階ごとに作るものを決める
• ポートフォリオは「目的・選んだ理由・動くページ・＋α」をそろえる

デザイナー以外の職種との相性も知りたい人は、IT職タイプ診断を試してみてください。

参考：Webデザイナー｜職業情報提供サイト（job tag）厚生労働省（2026年10月8日確認）／システムエンジニア（Webサービス開発）｜job tag（2026年10月8日確認）／Webマーケティング（ネット広告・販売促進）｜job tag（2026年10月8日確認）

→ 自分に合う職種を「IT職タイプ診断」で調べる