2021/07/15 (更新日: 2022/03/14)

Web制作の始め方から月10万円を稼ぐまでの学習方法【3ヶ月あれば余裕】

WEB

こういった悩みを解決します。

※Web制作についての知識や全体の流れがイメージできていない方は、以下の記事「【Webサイト制作とは】Web制作の流れ・フローをWeb制作で稼ぐ僕が解説」より、理解を深めておきましょう。

上記のとおりです。さてWeb制作で稼ぐためには、以下のステップを順にこなしていきます。

Web制作の始め方

• 目標の確認
• 環境準備
• Web制作の基礎学習【所要時間：50〜70時間】
• 営業の準備＆営業【所要時間：35時間】
• 案件対応【所要時間：2週間〜1ヶ月半】

上記を順番に解説していきます。

　本記事の信憑性

Web制作をはじめて、4ヶ月で受注額が100万円を越えました。

つまり4ヶ月間、本記事のことを実践すれば僕と同じように稼げる再現性の非常に高い学習ロードマップになっています。

　これから学習を始める方へ

Web制作は効率的に稼ぐにはそれほど難易度の高いスキルは必要ではありません。

理由は稼げるようになるまでに時間がかかるし挫折ポイントが沢山あるからです。僕はWeb制作の学習中に以下のような気持ちになりました。

• 基礎学習から稼げるまでのイメージが沸かない。
• 模写コーディング難しい、これで本当にホームページを1から作れるようになるの？
• 営業が不安。。。

結論上記の解決策は、最速で稼ぐことです。まだ体験していないことへの不安、稼げるようになるのかという不安が挫折に繋がります。

挫折する前に稼ぐべきです。

そこで本記事で紹介するロードマップでは、以下3点を意識しました。

• 無駄を削ぎ落とした学習ロードマップ
• 営業に早くうつり、稼ぐイメージを鮮明に
• 挫折しない学習の順番

※もう1つ挫折を回避する方法があります。それがプログラミングスクールを利用することです。

メンターに指導してもらえるため、挫折の可能性が圧倒的に低くなります。以下から無料で体験できるので、気になった方はぜひ申し込んでみてください。

>>Web制作副業コースの無料体験はこちら

それでは本記事に戻ります。早速Web制作のロードマップをみていきましょう。

目標の確認

まず2つの目標を確認しましょう。

• 金額目標：月に10万円を稼げるようになる
• スキル目標：静的ページを作成できるようになる

上記をもっと明確にしていきましょう。

金額目標：月に10万円をWeb制作で稼ぐイメージ【初心者からでも可能】

Web制作で月に10万円を稼ぐためには、

※ランディングページとは商品などを売るための縦長1ページのサイト、ホームページは企業などが自身の情報を載せる目的で持っている複数ページに及ぶサイト。

上記を達成すればよいです。例えば、僕が担当したこちらのホームページ作成のお仕事（公開許可取り済）、1件で10万円ほどの受注額でした（Web制作を始めてから2ヶ月後に受注）。

Web制作で10万円を稼ぐというのは程遠い話ではないということです。参考までにクラウドソーシングでの大体の受注額目安を記載しておきます。

※僕が受注したものから算出した額です。

なので、1〜2件で10万円を稼ぐことが可能です。

Web制作は全くオワコンではないです

「Web制作はオワコンだ」という声をちらほら耳にしますが、結論需要がめちゃくちゃあります。なので自信を持って学習に励んでください。

こちらについては以下の記事「【Web制作はオワコンか？】Web制作で7桁を稼ぐ僕が解説」で解説しています。

スキル目標：静的ページに必要な言語

最速で稼ぐためにも、まずは以下を習得しましょう。

• HTML→文章をホームページに表示するためのもの
• CSS→ホームページをデザインするもの

少しわかりにくいと思いますので、HTMLのみで作成したホームページとHTML＆CSSで作成したホームページを以下に掲載します。

HTMLのみ

上記がHTMLのみで作成したホームページです。一方でCSSが加わると以下のようになります。

HTML＆CSS

両者のホームページの見た目ですが、かなり違いますよね。このようにWeb制作にはHTMLとCSSの両方が必須です。

環境準備

Web制作を始めるために必要なものはパソコンのみです。

Macbook Proがおすすめ

MacbookProがおすすめです。

>>Mac購入はこちら

僕の使っているモデル・スペックは以下の通り。これで快適に学習できる空間の完成です。

※その他の作業効率を爆上げするアイテム

• ノートパソコンスタンド（手が疲れにくくなり、長時間作業での負担軽減に）
• ワイヤレスマウス（滑らかなカーソル移動、サクサク作業で効率化）
• AirPods Pro（周りの音をシャットアウトし集中力UP）
• サブディスプレイ（複数ウィンドウを同時に見ながら作業可能に）

必要に応じで、上記を揃えてWeb制作に臨みましょう（ちなみに僕は全て揃えました）。快適な空間を作ると、身体的にも長時間作業を行いやすくなりますし、精神的にも作業へのモチベが上がるのでオススメです。

また、PCにインストールしておくべきものが２つあります。

上記のとおりです。またそれぞれの役割は、以下のとおりです。いずれも無料なのでサクッとインストールしてしまいましょう。

ここまではスムーズにやってしまいましょう。

※余力があればTwitterのアカウント開設もしておきましょう

これは完全に余力があればでいいのですが、Web制作と並行してTwitterはやっておくべきだと感じています。僕はTwitterアカウントを10ヶ月ほど運用しており、フォロワーが3,000名以上となっています(2022/3/12現在）。

その中で感じるTwitterを運用する理由は以下の通り。

• 学習状況をツイートすることで学習モチベの継続
• Web制作者と繋がることができる
• Web制作の有益な情報が流れてくる
• Twitterから案件が来るようになる：Twitterで案件獲得方法ノウハウはこちら

上記のとおりなので、余裕があれば並行してTwitterもやりましょう。

Twitter運用では、2つ目のWeb制作している方とつながるためにも、プロフィールで自分が何者なのかをはっきりさせておきましょう。

※僕のアカウントはこんな感じです。

またTwitterも並行して伸ばし、「SNSマーケティングもできるようになりたい！」という方は以下の教材がおすすめです。

>>Twitter×自動化収益6億円超えのTwitter攻略ノウハウ

他のおすすめするTwitter教材については、下記記事にまとめてあります。

>>おすすめのTwitter教材一覧はこちら

Web制作の学習開始【50~70時間】

Web制作に必要なスキルを習得していきましょう。ここでは以下のレベルまでを目標にしましょう。

上記を身につけるための、具体的な手順がこちらになります。

• ProgateでHTML＆CSSを学習【所要時間：10時間】→HTML＆CSSの基礎を学ぶ
• 模写コーディング【所要時間：20~30時間】→他の人のホームページを真似して同じものを作成
• デモサイト作成【所要時間20~30時間】→実際に自分のサイトを作成

上記のとおりでして、順番に簡単に解説していきます。もし本記事で理解が十分できない場合、以下の記事「【初心者必見】Web制作おすすめの独学法【僕はこれで100万円稼いだ】」にて詳しく解説しています。

それでは見ていきましょう。

ProgateでHTML＆CSSを学習【所要時間：10時間】→HTML＆CSSの基礎を学ぶ

Progateへの課金が必要になります。

といっても月額980円です。なので、Progateは１ヶ月だけ有料契約し、HTML＆CSSの基礎学習を終わらせる＆解約することがおすすめです。

Progateでやるべきコースは以下のとおりです。暗記はやめて、6〜7割の理解でサクサク進めていきましょう。

上記のとおりなので、Progateを使ってHTML＆CSSの学習を行うことをおすすめします。次のリンクより登録が可能です。

>>Prrogateの登録はこちら

※HTML＆CSSを学んだ後はサクッと解約

ProgateではHTML＆CSSのみを行えばいいので、その学習が終わったらサクッと解約してしまいましょう。

>>Progate有料会員プランの解約方法とタイミング｜保持データの注意点あり

模写コーディング【所要時間：20~30時間】→他の人のホームページを真似して同じものを作成

模写コーディングではiSaraのホームページを模写しましょう。

またこちらのiSaraの模写に関しては、解説動画もあるので、煮詰まったら動画ですぐに解決して次に進みましょう。

より実際の案件に近い練習方法

実際の案件では、デザインデータをもとにコーディングを行います。既存のホームページを模写する事はまずありません。

これが案件に近いです。１つ目の矢印を可能にするのが、Figmaです。使い方等は以下の記事で解説されています。

>>Figmaを使って模写コーディングしよう！

デモサイト作成【所要時間：20~30時間】→実際に自分のサイトを作成

デモサイトを作成していきましょう。目標は以下です。

• 2つ作成
• ぱっと見きれいなものを作成【営業で実績として使うため】

僕が作成したデモサイトは以下の通り。

• デモサイトその①
• デモサイトその②

1ページしかないホームページですね。

複数ページの作成は実際の案件では必要になるので、技術的にできる必要はありますが、実績ホームページに搭載する必要は必ずしもありません。

※もちろん余力があれば複数ページにしても可です。

とにかく効率重視でいきましょう。目的は稼ぐことなので、案件になったときには当然ですが最大限の力を発揮してお客様に価値を提供しましょう。

基礎学習はここまでで十分です

基礎学習はここまでで十分で、ここまでのスキルで対応できそうなものに提案していきましょう。

必ずググって調べたり、参考書を読んだりすることになります。どれだけ学習を重ねても完璧にはならないので、早めに完璧主義を捨てて稼ぐことに意識を向けましょう。

営業の準備＆営業【所要時間：35時間】

さてデモサイトを作成したら、いよいよ営業のために準備をしていきましょう。

流れは以下の通り。

順番に理解＆実践していきましょう。

クラウドソーシングサイトとは

クラウドソーシングサイトとは、発注者側と、受注者をつなぐプラットフォームです。

なにか仕事をお願いしようとなったときに「どこで探せば良いんだろう？」となる、その悩みを解決してくれる1つがクラウドソーシングで募集をするということです。

クラウドソーシングサイトでは、提案文を用いて公開提案（クラウドソーシングサイトによって若干表現は異なります）で案件の獲得を狙うのがいいと思います。

公開提案

公開提案とは、下図のように募集に対して複数人が提案文を出し、その提案文をもとに仕事を任せる人を発注者が選ぶという形です。

上記のとおりです。クラウドソーシングの仕組みなどについての基礎的な部分は、以下の記事「【クラウドソーシングとは】意味やサービス内容を実際の利用者が解説」にて詳しく解説していますので参考にどうぞ。

クラウドソーシングサイトの登録〜提案文作成【所要時間：5時間】

実際に営業のフェーズに入っていきます。

まずは以下の3つクラウドソーシングサイトを登録

• ランサーズ
• クラウドワークス
• ココナラ

登録が完了したら、クラウドソーシングでの営業のために準備するべきことは以下の通りです。

上記を準備しておきましょう。ここに関しては以下の記事「【Web制作100万円受注】クラウドソーシング提案の方法解説【提案文も】」で詳しく解説しています。

営業（提案）【所要時間：30時間】

さて、クラウドソーシングで提案する準備が完了したら実際に提案していきます。

これらを意識して、提案文を出していきます。上記をこなせば4件くらいは少なくとも受注できるはずです。あとは案件をこなしつつ、自分の時間と相談して提案のペースを決めましょう。

案件獲得のコンサルも行っておりまして、コンサル生の皆さんは下記の通り、かなり成果が出ています。

コンサル生さん達の声

>>案件獲得コンサルのご依頼はTwitterのDMまで

クラウドソーシングサイトで10件くらい実績が積み上がると、いつでも受注できるくらい実績のあるアカウントになります。

なので、ここまで来ると基本的に月10万円は安定してきます。

案件が取れるようになってからWordPressやjQueryを学ぶ

案件が安定して獲得できるようになって初めて、WordPressやjQueryを学習してください。（WordPressは、出来ると営業の幅も大幅に広がるので、挫折しない自信があれば、営業前に学習しても◎）

ぶっちゃけこの2つはHTMLとCSSに比べて難易度が高く、挫折ポイントになります。なので必ず稼ぐ経験をしたあとにトライしましょう。

WordPressについては以下の記事に詳細に解説されています。

>>今さら聞けない！WordPressとは【初心者向け】｜現役エンジニアが解説

上記のWordPressとjQueryの習得は間違いなく案件の幅を広げてくれます。なので、どこかのタイミングで効率的に学びましょう。

有料の上質なコンテンツで学ぶ→案件を獲得して資金を回収でいきましょう、これで実質無料で受講できます。下記にWordPressとjQueryの学習講座を載せておきます。

※ちなみにjQueryの方の講座は、1.5倍速or2倍速で聞くと丁度いいスピードでインプットでき、時間の節約にも繋がります。

>>WordPress開発マスター講座

>>手を動かして6時間でjQueryをマスターしよう

上記のとおりです。繰り返しになりますが、挫折する確率が低いタイミングで習得してください。

案件対応【所要時間：2週間〜1ヶ月半】

完全に案件によるのですが、大体受注から納品まで2週間〜1ヶ月半程かかります。なので、同時並行で複数案件に対応する形になります（月10万円が目標なら1ヶ月に1〜２案件に対応）。

案件対応は、かなり重要です。

お客様からの評価がイマイチだと、信頼できるアカウントとはならず受注が難しいです。なので、高い評価をもらうためにどのように案件に向き合えばいいのかを次に解説していきます。

4ヶ月間のランサーズとココナラの実績

僕のアカウントはこんな感じでかなり評価の高いアカウント（星5が両サイトとも最高評価）になっています。なのでかなり案件自体は取りやすい状態です。

こういった高評価獲得のためのノウハウをここからお伝えしていきます。

実際に受注した後に案件をこなしていく手順は以下のとおりです。

受注〜納品までの手順

• 流れ①：ヒアリング
• 流れ②：自分がやることと相手がやることの決定
• 流れ③：デザイン作成
• 流れ④：素材準備
• 流れ⑤：サーバー・ドメイン準備
• 流れ⑥：コーディング
• 流れ⑦：修正
• 流れ⑧：マニュアル作成
• 流れ⑨：テスト
• 流れ⑩：納品

上記について本記事では要点のみ解説していきます。下記の別記事「【副業/フリーランス用】Web制作案件の流れを徹底解説【体験談あり】」にて、詳細な解説は行っております。

上記のとおりです。またクラウドソーシング（ランサーズなど）でお仕事を受注する際にはあまり気にしなくてよいのですが、今後直接クライアント様と繋がるときには、しっかりと契約書を結ぶ必要があります。

今のうちに準備しておきましょう。

>>Web制作契約書はこちら（15〜16年法務関係のお仕事をされた方が作成）

ヒアリング

まずお客様からのヒアリング（テキストorビデオ通話など）で要望を整理しましょう。ここでうまくお互いの認識を合わせておかないと低評価をつけられたり、途中で案件が打ち切りになってしまったりします。

ヒアリングすべき項目などは以下の記事「Web制作におけるヒアリングシートとは？作り方と大切な理由」にまとめてあります。

デザイン作成〜コーディングまで

常にお客様と、こちら側との認識が完全に一致するよう進めていくのがベストです。ヒアリングで決めきれなかった箇所については都度確認しながら進めていきましょう。

上記はほんの一例ですが、密にコミュニケーションを取りながら案件終盤になって大幅な修正が来ることの無いように慎重に進めていきましょう。

納品

細かな修正や動作確認を経て、納品となります。このときに重要な点としては、なんとしても最高評価を頂くことです。

ですので感覚的に「少し良くない評価をつけられそうだな、、、」と感じるときは、クロージングのメッセージとともに以下の提案を無料で行いましょう。

アフターフォロー

1週間程度、無料でホームページ修正を承るという内容を無料で提案します。マニュアルをきちんと作成＆お渡ししていれば、通常は修正依頼は納品後に来ません。

ですが、このアフターサービスのお得感やサプライズ感で、お客様に喜んで頂けることは多いです。

まとめ：Web制作は稼げる

本記事ではWeb制作のはじめ方〜案件対応までを解説していきました。

オンライン販売の必要性や、オンライン集客の必要性が高まる昨今では需要はまだまだある領域かなと思います。それに何より、自分の手で10万円稼ぐ達成感はすごいです。

本記事が、その達成感を味わい、継続的にWeb制作に注力するための一助になりますと幸いです。

※最後にWeb制作での他の稼ぎ方をご紹介します

それがエンジニア就職（転職）です。

下記のエンジーニアス転職さんが実施している無料相談では、IT未経験者でも、スキルに不安があっても、貴方に合った優良なIT企業を紹介してくれます。

ぜひ迷っている方は、無料ですので一度相談してみてくださいね。

>>まずは無料で相談してみる

また本記事の画像は以下のサイトより使用しています。

Illustration by Freepik Storyset

Web制作

• facebook
• Tweet
• hatebu
• Share
• Read Later