未経験からWebデザイナーへ|独学でどこまで行けるか、ポートフォリオに何を入れるか

公開日:2026-09-06 / 更新日:2026-09-07 / 執筆:キャリアのナナメ相談所 編集部

※本記事にはアフィリエイト広告(PR)を含みます。広告表記について

先に言っておくと、独学だけでWebデザイナーになれる人もいれば、スクールに通っても手が動かないまま終わる人もいます。「独学かスクールか」から考え始めると、たぶんいつまでも決まりません。

大事なのは、何をどれだけ学べば応募できる水準になるのか、ポートフォリオに何を入れれば見てもらえるのか、そこを具体的に知っているかどうかです。ここが曖昧なまま始めると、教材を何冊終えても「まだ足りない気がする」と不安なままになります。

未経験からWebデザイナーを目指す道は、専業への一本道だけではありません。コーディングやデザイン制作のアシスタントという、隣接した職種から入る道もあります。前職の経験も、無関係ではありません。作品を作った理由を、自分の言葉で話せるようになります。

この記事では、応募できる水準の学習内容、ポートフォリオの具体的な構成、専業以外の入り方、前職の経験をどう作品に活かすか、そして未経験から働くときに見ておきたい環境までを整理します。

「独学でなれる」も「スクールが必須」も、半分だけ正しい

求人票には「Photoshopが使えること」「Webサイトの制作経験」など、いくつかの条件が並んでいます。それを見て「自分にはデザインの才能がないから無理だ」と感じてしまう気持ちは、よくわかります。でも未経験から最初に求められるのは才能ではなく、作品を見せながら自分の考えを説明できるところまで準備することなんです。

きれいな絵を描けることと、Webサイトを設計できることは同じではありません。誰に見てもらうサイトなのか、何を先に伝えるのか、どこを押してもらいたいのかを考えて、その意図に合わせて画面を組み立てる仕事だからです。

独学にも良いところがあります。自分の生活に合わせて進められますし、わからないところを調べながら自分で試して確かめる経験も積めます。ただ独学には、「今の自分がどこまでできているのか」が見えにくい弱点もあります。教材を進めている間は理解したつもりでも、白紙の画面を前にすると、何から作ればいいのかわからなくなることがあります。

一人だと先延ばししやすい人は、スクールを使う方法もあります。お金をかけるのは逃げだ、なんて思わなくて平気です。講師に質問できたり、制作した作品を見てもらえたりする環境なら、つまずいた場所を抱えたまま進む時間を短くできます。

独学がダメなわけでも、スクールに行けば自動的に転職できるわけでもありません。どちらを選んでも、最後は自分で作品を作って、その作品について「誰のために、何を考えて作ったのか」を話せるところまで進めないと、応募には届きません。

たとえば、教材の課題をそのまま完成させて終わる場合と、「このサイトを使う人は何に困っているのか」を自分で考えて一つのサイトを作る場合。同じ学習時間でも、経験する内容はまるで違います。目指すのは、応募できるところまでです。教材を終えた数を増やすことより、「これを作りました」と見せられる作品を少しずつ増やすほうへ意識を向けてください📐

何を学べば、応募できる水準になるのか

学習項目は、最初から広げすぎなくて平気です。Webデザインを調べると、Photoshop、Figma、HTML、CSS、JavaScriptと、覚えたほうがよさそうな言葉が次々に出てきますよね。全部やるのかと思うと、始める前から気が重くなります。ただ全部を一度に始めると、勉強そのものが目的になりがちです。まずは「作品を一つ完成させるために必要なこと」から順番に触れていくほうが進みます。

項目どこまでやれば応募できる水準か
HTML/CSS基本的なタグ、レイアウト、余白、文字サイズなどを扱える
デザインツールFigmaなど一つを使い、画面を組み立てて書き出せる
模写・トレース既存サイトを見ながら、配置や余白、文字の大きさなどを再現する
ポートフォリオ3〜5点を掲載し、そのうち架空案件を1つ以上入れる
作品説明誰向けのサイトか、何を解決したいか、なぜそのデザインにしたかを書く

この中でも、模写やトレースは最初の練習として使いやすい方法です。既存サイトを見ながら作ってみると、余白の取り方や文字の大きさ、画像と文章の位置関係など、自分だけで考えていると見落としやすい部分に気づけます。ただし、模写だけでポートフォリオを埋めるのは避けたいところです。模写で身につくのは、見る目と手の動かし方です。そのあとは、自分で課題を決めた作品へ進んでください。

地域のカフェを題材にするとします。「若い女性向けだからピンクにする」というところで止めず、初めて店を知った人が何を確認したいのかを考えてみます。営業時間を知りたいのか、メニューを見たいのか、駅からの行き方を確認したいのか。それによって、置く情報の順番は変わります。そこまで考えて作れば、完成した作品を見せるだけでなく、なぜその配置にしたのかまで説明できます🖥️

「きれいに見えるようにしました」だけでは、作品を作った理由が伝わりません。たとえば「初めて来店する人がメニューと営業時間をすぐ確認できるよう、ファーストビューから店舗情報へ移りやすい構成にした」。対象と目的と変更点を一緒に書くと、考えて作ったことが伝わります。同じ作品でも、ここが評価の分かれ目になります🔍

架空のカフェでも、ピアノ教室でも、地域の工務店でもいい。実際の企業から依頼された仕事でなくても、自分で「この人向けのサイトを作る」と決めれば、テーマを決めるところから作り終えるまで、ひと通り経験できます。

ポートフォリオでは、完成画面だけを並べるより、どういう順番で考えてその形にしたのかまで残しておくほうが、見る人には伝わります。誰を想定したのか、どんな不便を解決したかったのか、どの情報を優先したのか。そこまで書いてあると、読んだ人がその作品の中身をつかめます。

独学でそこまで考えながら進める自信がない場合は、学習からポートフォリオ制作までを見てもらえる環境を使う方法もあります。一人で抱え込まなくていいんです。自分だけでは判断できない部分を質問できれば、作品を完成させることに時間を使えます。

作品を完成させるところまで、質問しながら進めたい方へ

Winスクール(Webデザイン)の無料カウンセリングを見る

※Winスクールは、全国の教室とオンラインで個人レッスンを受けられるスクールです。 受講生の多くが未経験からのスタートで、学習の進め方とポートフォリオの相談を無料カウンセリングでできます。

いきなり専業を目指さなくていい

未経験からWeb業界に入りたいなら、最初から「Webデザイナー」という職種名だけを追いかけなくても構いません。専業の求人だけに絞ると、実務経験のある応募者と同じ枠で比べられます。

求人の量そのものにも、職種でかなりの差があります。

エンジニア(IT・通信) 11.06倍
専門職(建設・不動産) 5.3倍
営業 2.85倍
クリエイター 1.14倍
販売・サービス 0.73倍
事務・アシスタント 0.53倍

出典:パーソルキャリア「doda転職求人倍率レポート」 2026年6月時点(全国)。転職求人倍率は、求職者1人に対して何件の求人があるかを表します。棒の長さは最も高いエンジニア(11.06倍)を100%として表示しています。

クリエイターは1.14倍でした。求職者1人に1件ちょっとの求人しかない計算で、エンジニアの11.06倍とは10倍近い差があります。「Web系は人手不足だから未経験でも入りやすい」と聞いたことがあるかもしれませんが、その話が当てはまるのは主にエンジニア側です。

だからといって諦める話ではありません。倍率が低いのは、一つの職種名だけで探すと候補がすぐ尽きるという意味です📊

何社も応募して書類が通らないと、「ここまで勉強したのに、デザイナーになれなかったら意味がない」と焦ってしまいます。その気持ちはよくわかりますが、その時点で進路を一つに固定しなくて大丈夫です。

Web制作の現場には、HTMLやCSSの実装を担当するコーダーや、画像の差し替え、ページの修正、制作物の管理などを任されるアシスタント職もあります。制作現場に入れば、依頼を受けて修正し、確認してもらい、納品まで進める流れを経験できます。

30代の未経験転職 職種選びで結果が変わる

制作だけでなく、数字を見ながら改善する側の仕事も気になるなら、こちらで職種の中身を分けています。

未経験からWebマーケターへ 4種類と現実的な入口

もちろん、隣接職種に入れば自動的にWebデザイナーへ移れるわけではありません。勤務先でどこまで制作業務に関われるのか、自分でも作品制作を続けられるのかなど、次の動きは考えておいたほうがいいです。

それでも、最初から完成形だけを狙わなくていい。未経験のうちは、この差が大きいです。

制作アシスタントとして働きながら、先輩が作ったバナーの画像差し替えを担当する。そのあとに文字修正やレイアウト調整を任されるようになる、というケースがあります。「この部分なら自分もできます」と仕事の範囲を少しずつ広げていけば、次の応募で話せる経験も変わってきます。これは独学では手に入らない実務の経験です🛠️

現場では、依頼された内容をそのまま作って終わりではありません。確認事項を聞き、修正の意図を理解して、決められた時間の中で完成させる。ここは、独学だけではなかなか身につきません。

Webデザイナーを目指すこと自体はいいとして、最初の一歩まで同じ形にしなくて構いません。コーダーや制作アシスタントから入って、仕事をしながらデザインの経験を増やす。未経験からなら、この道も十分にありです。

前職の経験は、ポートフォリオにこう活きる

異業種からWebデザイナーを目指すと、「デザインと関係ない仕事しかしてこなかった」と感じてしまいますよね。けれど、作品を作るときに必要なのは、画面上の図形をきれいに並べる作業だけではありません。

利用する人が何に困るのかを考えたり、情報を整理したり、相手の要望を聞いて形にしたりする場面では、前職で身につけた視点を使えます。まずはそこからで十分です。仕事そのものをデザイン経験に置き換える必要はなく、そこで何を見て、どう考えていたのかを作品づくりに持ち込めばいいんです。

スキルなし・資格なしでも転職できる

前職で見てきた場面は、作品の設計理由になります。

接客で、同じ質問を何度も受けていた
→
質問が集中していた情報を見つけやすい位置に置く、という導線の根拠になる
事務で、入力や整列の確認を続けていた
→
文字やボタンの位置、余白、情報の並びを丁寧に整える手が身についている
営業で、相手の課題を聞いて提案していた
→
架空案件で依頼者の目的を設定し、要望からデザインの理由まで説明できる
その業界で働いていた
→
実際の利用者が何を知りたいかを知っているので、題材に現場感が出る

たとえば販売の仕事をしていた人なら、店舗でどんな質問を受けていたかを思い出してみてください。商品の場所を何度も聞かれる、料金表示が見つけにくい、案内を読んでも次に何をすればいいかわからない、といった小さな不便が見つかるはずです。

その経験を作品へ持ち込めば、「見た目をきれいにしました」だけでは終わらない説明ができます。質問が集中していた情報を目立つ場所へ置いて、初めて見る人でも次の行動がわかるようにした、と話せるからです。

ある販売スタッフは、店頭で案内表示を作るとき、文字が小さいと同じ質問が何度も出ることに気づいて、商品の場所と受付方法を分けて書き、案内を見た人が次にどこへ進めばいいのかがわかるように配置を変えていたそうです📝

「これくらいは普通の仕事だから、書くほどのことではないと思っていました」

本人はそう考えていましたが、この経験はWebデザインでそのまま使えます。利用者がどこで迷うのかを考えて、情報の順番を決めた話になるからです。

事務職なら、数字の照合や入力内容の確認を続けてきた経験があります。営業なら、相手の話を聞いてから提案内容を変えてきた経験があります。製造や物流なら、作業の順番を変えてミスや手戻りを減らした経験を持つ人もいます。

販売・接客の経験が活きる転職先

自分が実際に見てきた場面から始めると、作品の説明が具体的になります。面接で「なぜこの構成にしたのか」と聞かれたときにも、自分の言葉で答えられます。題材は、知らない業界でなくて構いません。自分が働いてきた業界を選んで、その中の困りごとをサイトで解決するほうが、書くことは出てきやすいはずです。

飲食店で働いていたなら、注文前にお客さんから聞かれた質問を思い出してみてください。メニューの内容、アレルギー表示、予約方法、営業時間。実際の接客で何度も説明していたことがあれば、それがそのまま、サイトで解決する困りごとになります。

そこから「初めて来る人が迷わないページを作る」という架空案件を設定して、必要な情報を並べてみます。前職を消してから、Webデザイナーになる必要はないんです。

未経験Webデザイナーの働き方のリアル

働く環境も確認しておきたいところです。Webデザイナーはパソコンに向かって一人で制作する時間がありますが、修正の確認や打ち合わせ、チャットでの相談など、人とやり取りしながら進める場面もあります。

元事務職の人が、初めて在宅中心の制作案件を担当したときの話です。バナーの余白について確認したくなったものの、先輩からの返信がなく、そのまま作業を進めました。「忙しそうだから、今聞いたら迷惑かもしれない」と考えていたそうです。夕方になって提出したところ、そもそもの指示の受け取り方が違っていて、作り直しになりました。

つまずいたのは、制作の技術ではありませんでした。質問するタイミングや、どこがわからないのかを文章で伝えることに慣れていなかったので、画面の前で考え込む時間が長くなっていたんです。

これはリモートワークが悪いという話ではありません。自宅のほうが集中できる人もいます。一方で未経験の段階では、隣の席にいる人へ「この余白で合っていますか」と聞ける環境のほうが進めやすい人もいます。画面を見せながら確認できれば短いやり取りで終わる内容でも、チャットだけなら、どこがわからないのかを文章にして伝える必要があるからです。

最初から自由な働き方を選びたい気持ちは、よくわかります。ただ、働き方の希望と、今の自分が仕事を進めやすい環境は別の話です。リモートで働きたいからといって未経験の段階から完全在宅だけに絞る必要はなく、出社と在宅を組み合わせた求人から経験を積む方法もあります🏠

求人を見るときは、「リモート可」という一言だけで判断しないことです。研修中は出社なのか、質問はチャットだけなのか、デザインのレビューは誰が担当するのか。

未経験転職エージェントの使い方

働き方の条件を自分だけで探すのが難しい場合は、求人の探し方から相談する方法もあります。未経験から入れる求人と、経験を積んだあとに在宅へ移りやすい求人。この2つを分けて考えれば、「最初から理想の働き方でなければ失敗」という受け止め方からも離れられます。

未経験転職におすすめのエージェント比較

働く場所から仕事を選びたい方へ

Remoful(リモフル)で無料相談してみる

※Remofulはリモートワークの求人に特化した無料のサービスです。 未経験から入れる求人がどれくらいあるのか、面談で確かめてから判断できます。

よくある質問

スクールに通わないと、本当に転職できませんか?

必須ではありません。独学でHTML/CSSやデザインツールを学び、作品を作って応募する道もあります。独学だと「自分の作品のどこを直せばいいのか」がわからなくなりやすいので、質問できる相手がほしい、制作したものを見てもらいたい、学習のペースを自分だけで管理するのが難しいという場合は、スクールや添削を使う方法もあります。スクールへ行くかどうかではなく、応募するときに見せられる作品を完成させられるかを基準に考えてみてください。

ポートフォリオに実務経験がなくても大丈夫ですか?

未経験からの応募で、実務で作った作品を並べられないのは当たり前です。架空案件でも、誰を対象にしたのか、どんな課題を想定したのか、その課題に対して何を考えてデザインしたのかまで説明できれば、制作の過程を伝えられます。模写作品だけで終わらせず、自分で課題を設定した作品を含めてください。

HTML/CSS以外に、覚えておいたほうがいいことはありますか?

JavaScriptの基礎があると、Webサイトの動きや表現を理解する助けになります。ただ最初からすべてを覚える必要はなく、まずHTML/CSSで基本的な構造を理解し、Figmaなどのデザインツールを一つ使える状態にして、作品制作へ進むほうが実践に近い学習になります。求人を見て応募先で求められているスキルがわかってきたら、そこから必要な技術を足していく方法もあります。

独学が続かない場合、どうすればいいですか?

やる気が足りないと決めつけないでください。一人で予定を立てること自体が負担なら、作業会に参加したり、学習仲間を作ったり、講師へ質問できる環境を使ったりする方法があります。教材を何度変えても進まない場合は、教材ではなく学び方を変えてみるのも一つです。毎回まとまった時間を取ることが難しいなら、作品制作の一部だけを進める日を作るなど、自分が続けられる形を探してみてください。

まとめ:足りないのではなく、まだ手を動かしていない

Webデザイナーを目指して作品を探していると、完成度の高いサイトに出会います。そのあとで自分の画面を開くと、「自分にはセンスがない」と落ち込んでしまいますよね。前職がデザインと無関係なら、「経験もないし、何を作品にすればいいのかわからない」と不安になる人もいるでしょう。

でも、最初からセンスの有無を決める必要はありません。順番があるだけです。HTML/CSSの基礎を学び、デザインツールを一つ使い、模写を経験して、自分で課題を決めた作品を作る。そこまで来て、やっと自分の苦手な部分も見えてきます。

ポートフォリオも、最初から完璧な作品だけを並べる必要はありません。前職で知っている業界を題材にしたり、接客中に感じた不便をサイトの課題にしたりすれば、教材の課題をそのまま出す人とは違う理由を、自分の言葉で書けます。

独学で進められるなら、その方法で構いません。続けることが難しいなら、スクールや添削を使う手もあります。専業の求人が難しければ、コーダーや制作アシスタントから制作現場へ入る道もあります📌

「センスがないから作れない」「経験がないから作品を作れない」と思ってしまうのは、まだ自分に何ができるのかを、確かめていないからかもしれません。足りないのは、才能でも前職の肩書きでもありません。まだ手を動かしていないだけなら、作品はこれから作れます。