【初心者向け】Web制作で「月5万円」稼ぐ具体的な方法を徹底解説

※本サイトで紹介している商品・サービス等の外部リンクには、プロモーションが含まれています。

今回の記事は、大人気「おすすめの副業」シリーズの新作です。

リベ大では、以下の方法により資産5,000万円超の小金持ち(準富裕層)になる方法を紹介しています。

資産5,000万円超の小金持ちになる方法
  • 5万円ムダな支出を減らす

→ 通信費・保険・住宅ローンの見直しなど

  • 今よりも月5万円収入を増やす
  • 浮いた10万円を投資に回して年利5%で運用する

上記の方法は、再現性の高い王道の資産形成法です。

そして多くの人にとって課題になっているのが、今よりも月5万円収入を増やすというステップです。

これを達成してもらうため、過去におすすめの副業10選を紹介しています。

 

今回は、おすすめ副業10選の1つ、ウェブデザイン・プログラミングに関わるお話です。

上記の記事を見て、以下のように感じた人はぜひしっかりと今回の記事を読んでください。

今回の記事をおすすめできる人
  • ウェブデザイン・プログラミングに興味を持てなかった人
  • ウェブデザイン・プログラミングで具体的にどうやって月5万円を稼ぐのかイメージが持てなかった人
  • ウェブデザイン・プログラミングで成果が出せなかった人
  • 今より月収を5万円増やしたいけど、転職まではしたくない人

こぱん
今回の記事では、おすすめの副業「Web制作」について紹介します。

「Web制作?何それ?全然自分に関係なさそう!」と思った人もいるかもしれませんが、そんなことはありません。

Web制作とは、Webサイト(ブログやホームページなど)を1から作ったり、リニューアルしたりする仕事です。

つまり、皆さんが毎日目にしているものなので、皆さんの生活に深く関係があるものになります。

ブログやホームページと言われると、ちょっとショボイと感じる人がいるかもしれませんが、それも誤解です。

2021年のウェブサイト価値ランキングによると、今の時代、企業のブランディング・マーケティングとWebサイトは、切っても切り離せないと分かります。

2021年のウェブサイト価値ランキング
  • 1位:NTTドコモ(約791億円)
  • 2位:トヨタ自動車( 約728億円)
  • 3位:ユニクロ(約725億円)

あひるくん
えっ!!すごい金額なんだね!!

中小企業もこぞってWebサイトにお金をかけ、価値あるWebサイトが数百万円~数億円で取引されています。

Web制作のように身近で需要が大きく、成長性もある仕事の分野は希少です。

ちなみにアメリカでは、FIREの達成手法として「Webサイトを作って億で売る」というのはよく見られる事例です。

Web制作の世界はお金の香りがすることが分かってもらえたのではないでしょうか。

こぱん
そこで今回の記事では、以下の点について解説します。
今回の記事で分かること

Web制作とは?

Web制作は稼げる?メリット・デメリットを紹介

Web制作で稼ぐための5つのSTEP

今回の記事通りに取り組めば、月5万円は必ず達成できます。

ちなみに、リベ大両学長は以下のような実績があります。

両学長の実績
  • 自分自身もWeb制作で稼いだ。
  • 会社でたくさんのWebデザイナーやプログラマを、0から育てた。
  • 現在も、Webサイト・Webアプリを自社制作し、管理運営している。

要するに、今回の記事で紹介する内容について、経験・実績・知識があるということです。

エアプではないので、安心して読み進めてください。
※エアプ:「エアプレイ」の略語で、自分が体験していないことを、あたかも体験したかのように振る舞ったり話したりする行為。

スポンサーリンク

解説動画:【初心者向け】Web制作で「月5万円」稼ぐ!超具体的な方法

このブログの内容は以下の動画でも解説しています!

Web制作とは?

Web制作とは?

先ほど説明したように、Web制作とはWebサイト(ブログやホームページなど)を1から作ったりリニューアルしたりする仕事です。

Web制作は、「ホームページ制作」や「サイト制作」ともいいます。

こぱん
リベ大公式ブログもWebサイトです。

作るものの規模によって、一人で制作することもあればWeb制作会社などで、チームを組んで制作することもあります。

副業のWeb制作で稼ぐというのは、企業や個人からWeb制作依頼を「1サイトいくら」「1ページいくら」という形で受注することです。

1ページ1万円の仕事を5つ受ければ、月5万円の達成です。

Web制作の仕事は、一般的に以下のような流れになります。

Web制作の大枠
Web制作の流れ
  • ①要件定義

→ どのようなコンセプトのサイトを作るのか決める。

  • ②Webデザイン

→ サイトの見た目を考える。紙へのスケッチや、Adobeソフトなどを使ってデザインを考える。

  • ③プログラミング言語による制作

→ ②で考えたデザインをWeb上で表現し、サイトの機能を作り込む。(「予約」、「お問い合わせ」など。)

  • ④テスト

→ 制作したサイトが正常に表示・動作するかチェックする。

  • ⑤完成

今回副業としておすすめするのは、図解の中の「コーディング」というプログラミング言語による制作という工程の一部分です。

コーディングというのは、依頼者やWebデザイナーさんが描いたデザインを、ブラウザ(Webページを見るソフト)で見える形にすることを言います。

あひるくん
ん?どういうこと?

例えば赤いクレヨンがあれば、画用紙に赤い文字を書けますが、クレヨンでWebページ上に赤い文字は書けません。

赤いクレヨンの代わりに使うのが、HTMLやCSSという言語です。

コーディング担当者は、HTMLやCSSを駆使してデザインをWeb上に表現していきます。

コーディングは、まさにWeb制作の基礎なので、「Webデザイナー」ほどデザインセンスが求められるワケでなく、「プログラマ」ほど高度なプログラミング能力が求められるワケでもありません。

こぱん
このような意味で、とっつきやすいと言えるでしょう。

Web制作といっても非常に幅が広いので、今回はザックリそんなものかという認識でOKです。

パッとイメージできなくても、後で紹介する無料体験できるサービスを利用することでイメージが掴めるはずです。

Web制作は稼げる?メリット・デメリットを紹介

Web制作 メリットデメリット

次は、Web制作(コーディング中心)のメリット・デメリットをそれぞれ紹介します。

こぱん
メリット5選は以下の通りです。
Web制作のメリット5選
  1. スキルを習得するまでの期間が比較的短い
  2. 学習の難易度が相対的に低め
  3. 需要が大きく案件が豊富
  4. 時間と場所にとらわれない働き方をしやすくなる
  5. ローリスク・ハイリターン

メリット①:スキルを習得するまでの期間が比較的短い

メリット①:スキルを習得するまでの期間が比較的短い

すでにお伝えしたように、コーディングのスキルは基礎的なものです。

Webデザイナーのようなセンス・経験が求められるワケではなく、プログラマのようなガチのプログラミングスキルも求められません。

HTMLやCSSといった言語であれば、2~3ヵ月あれば一通り学べるでしょう。

「リベ大調べ」では、副業で月5万稼げるようになるには平均1年~1年半かかります。

スキルゼロの状態から3カ月~半年でファーストキャッシュ(最初の売上)を得られるというのは、かなり早い方だと考えて良いでしょう。

メリット②:学習の難易度が相対的に低め

メリット②:学習の難易度が相対的に低め

「私は理系じゃないから、プログラミングとか無理!」のように考える人もたくさんいるでしょう。

しかし、HTMLやCSSに限っては、それほど身構える必要はありません。

学習難易度のイメージは、普通運転免許のように考えてください。

タクシーやバス、特殊車両の運転をするには専用の免許が必要で、プロのレーサーになるなら特別なライセンスも必要でしょう。

世の中には、プロのドライバーになれる人となれない人がいますが、普通運転免許というのは基本的にやれば誰でも取れるレベルです。

コーディングを学ぶのに、天才的なセンス・才能は要りません。

メリット③:需要が大きく案件が豊富

メリット③:需要が大きく案件が豊富

Web制作は、案件が非常に豊富です。

それはWebサイトという存在が、個人の情報発信、企業のビジネス、行政の市民・国民への情報提供というあらゆる場面で必須になっているからです。

大きな案件から小さな案件まで、仕事は探せばいくらでも見つかります。

仕事の大手マッチングサイト、クラウドワークスを見ると以下のような案件数があります。(2022年8月末時点)

クラウドワークスの案件数(例)
  • 「ホームページ制作・Webデザイン」のカテゴリ

→ 約12,000件

  • 上記中HTML/CSSコーディングのカテゴリ

→ 約1,000件

あひるくん
すごいたくさんあるんだね!

ランサーズココナラという他のマッチングサイトでも大量の案件があります。

そもそも市場規模の小さな副業はWeb制作のようなカテゴリにはなりませんので、これだけを見ても仕事量の多さは分かるでしょう。

メリット④:時間と場所にとらわれない働き方をしやすくなる

メリット④:時間と場所にとらわれない働き方をしやすくなる

デジタルスキルを活かして働くフリーランスには、2通りの働き方があります。

2つの働き方
  1. 取引先に常駐して働く
  2. フルリモートで働く

Web系の仕事は、リモートOKの仕事が非常に多い特徴があります。

そのため、「時間と場所にとらわれない働き方がしたい!」という人には、Web系の言語は非常に人気です。

コーディングで使うHTMLやCSSはまさにWeb系の言語なので、PCとネット環境さえあれば、いつでもどこでも副業ができるようになります。

メリット⑤:ローリスク・ハイリターン

メリット⑤:ローリスク・ハイリターン

コーディングの学習に必要なのは以下のモノだけです。

コーディング学習に必要なモノ
  • PC
  • ネット環境
  • 教材

PCやネット環境は、もとから持っている人が多いでしょう。

そして肝心の教材ですが、Webの世界は優しい世界なので、ネット上にはありとあらゆる無料教材が落ちています。

その気になれば1円もかけずに学習することが可能です。

書籍を買ったとしても1万円もかかりませんし、後ほど紹介する至れり尽くせりの有料スクールでも約10万円から受講可能です。

こぱん
このように学習の金銭コストは非常に低く、ローリスクと言えますね。

一方のリターンについては、3カ月~半年学べば月5万円程度は稼げるようになるでしょう。

もし「Web制作の世界は自分に向いている!」と思った人は、Webデザインやプログラミングなどの専門性を高めれば、月20万円、30万円、そして100万円を稼げるようになります。

副業のまま稼ぎを増やしていっても良いですが、IT企業に転職したり、フリーランスになったりなど、副業ではなく本業にできる可能性があるということです。

IT人材は常に不足しており、スキルがある人は引っ張りだこなので、ノった時のリターンは非常に大きいと言えるでしょう。

 

ここまではメリットをお伝えしてきましたが、デメリットについてもきちんと紹介します。

Web制作のデメリット4選
  1. 単価が低い
  2. 競合が多い
  3. 稼げる金額がバグらない
  4. クライアントワークならではのリスク

デメリット①:単価が低い

デメリット①:単価が低い

コーディングのみの案件は、単価が低いです。

1件数千円~数万円が相場で、時給換算すると1,500円~2,000円程度のものも少なくありません。

以下のような依頼者とのやりとりの時間を考えると、時給はさらに低くなる可能性もあります。

依頼者とのやり取り(例)
  • 仕事をとるための提案や営業
  • メールやチャットでの打ち合わせ
  • 代金の請求

デメリット②:競合が多い

デメリット②:競合が多い

Web制作は、市場規模が大きいだけに競合も多い仕事です。

特にコーディングなどは習得難易度が低いこともあり、「その仕事ができる」「その仕事がやりたい」という人も少なくありません。

そのため、1つの案件に10や20の応募がある場合もあります。

デメリット③:稼げる金額がバグらない

デメリット③:稼げる金額がバグらない

コーディングというのは労働集約型の仕事です。

要は、自分の時間の切り売りで稼ぐということなので、以下の仕事のように稼げる金額がバグる可能性はありません。

稼げる金額がバグる可能性がある仕事(例)
  • ブログやYouTubeのように、売り上げが急に200万円や300万円になる。
  • せどりのように、仕組化により月1時間の作業で月収50万が手に入る。

デメリット④:クライアントワークならではのリスク

デメリット④:クライアントワークならではのリスク

クライアント(依頼者)から仕事を受けて働くという働き方は、以下の特徴があります。

クライアントワークの特徴

常識のあるクライアントに当たれば天国

非常識なクライアントに当たると地獄

口うるさいだけでなく、納品後に代金未払いのままドロンする人さえいます。

 

トータルで見て、消耗戦になる可能性があるということが分かるでしょう。

特に以下のように忙しい人だと、「こんなのやってられるか!」という状況になりがちです。

忙しい人(例)
  • 本業だけでも忙しいのに、副業もやっていて時間が足りなくなる。
  • 時間が無く忙しいのに、見合うだけの高い報酬が得られない。
  • 本業の上司だけでもうっとうしいのに、クライアントも面倒だ。

しかし、上記のようなデメリットを踏まえても、紹介したメリットの方が大きいのではないでしょうか。

こぱん
メリットは以下の通りでしたね。
Web制作のメリット5選
  • ①スキルを習得するまでの期間が比較的短い

→ 3カ月~半年程度。

  • ②学習の難易度が相対的に低め

→ 特別な才能は不要。

  • ③需要が大きく案件が豊富

→ 仕事探しに困らない。

  • ④時間と場所にとらわれない働き方をしやすくなる

→ Web界隈の特徴。

  • ⑤ローリスク・ハイリターン

→ お金がかからず、ハマれば高年収人材に。

お伝えしているように、数百万円かけて2年間ビジネススクールに通う必要が無いWeb制作は、時間的・金銭的なリスクは小さいです。

そして「月5万円で十分」と満足した人はそのまま稼ぎ続ければ良いですし、「Webは楽しい。もっと専門性高めて稼ぎたい!」と思えば、年収500万円、800万円、1,000万円といった世界にも行けるポテンシャルがあります。

あひるくん
夢がある仕事だね!

両学長もWebで稼いで生きてきた人なので、Webが無ければ、いわゆる億万長者になることも無かったでしょう。

そのため、ポジショントーク全開で「少しでも興味があるなら、Webスキルを身につけなはれ!」と自信を持っておすすめしているのです。

今回の内容を実践すれば、稼げるようになる人がたくさん増えると思いますが、仮に稼げなくてもWebスキルは身につけておいた方が良いです。

Webスキルがあると、今後の人生を生きていくうえで必ず役に立ちます。

こぱん
興味・関心がある時点で、皆さんは最初の扉はすでに通過しています。

人は、自分に合わないモノには基本的に興味を持たないので、本当に向いていない人は記事をここまで読んでいないでしょう。

Webスキルは、IT時代を生き抜く強力な専門性になります。

高いWebスキルと十分な金融資産があれば情報・ネットが主役の2000年代、自由に生きていけるでしょう。

というワケで、次はWeb制作で月5万稼ぐまでの具体的な5つのSTEPを紹介します。

Web制作で稼ぐための5つのSTEP

Web制作 5STEP

Web制作で稼ぐための5つのSTEPは、次の通りです。

Web制作で稼ぐ5つのSTEP
  • STEP①:事前準備
  • STEP②:コーディングを学ぶ
  • STEP③:ポートフォリオの作成
  • STEP④:案件の受注
  • STEP⑤:作業・納品

Web制作では1万円の案件を5件クリアすれば、5万円になります。

金額はあくまでイメージしてもらいやすくするための参考値なので、5,000円 × 10件でも良いし、2.5万円 × 2件でも良いです。

「簡単に言っているけど、現実はそんなに簡単じゃないでしょ!」という声が聞こえてきそうですが、それはその通りです。

こぱん
大きく3つの問題があります。
3つの問題
  • 1万円の案件をこなすスキルをどう身につけるか?(STEP②、③で解説)
  • 1万円の案件をどのように受注するか?(STEP④で解説)
  • 1万円の案件をどのように実務でやりきるか?(STEP⑤で解説)

これから説明する各STEPを読んでもらうと、スタートからゴールまでの全体図が見えるようになるはずです。

STEP①:事前準備

STEP①:事前準備

まずは以下の事前準備が必要です。

必要な事前準備
  1. 実務に耐えうるPCを用意する。
  2. ネット回線、サブディスプレイなどの作業環境を整備する。
  3. タイピングが苦手な人はタッチタイピングを習得する。

事前準備①:実務に耐えうるPCを用意する

コーディングのために、高スペックのマシンは必要ありません。

なぜなら、コーディングの主な作業はテキスト編集だからです。

以下のスペックを備えたパソコンがあれば十分でしょう。

必要なパソコンのスペック(コーディング用)
  • メモリ:8GB以上
  • ストレージ:256GB以上

メモリを16GBまで用意できれば、かなり快適に作業できるでしょう。

「メモリやストレージって何?」と思った人は、以下の動画を参考にしてください。

  関連動画

パソコンの仕組み 超基本から解説【ゼロから学ぶITスキル】

また、コーディングのみならず、Webデザインまでやりたいという人は、以下のパソコンスペックは確保しましょう。

必要なパソコンのスペック(Webデザインもする人)
  • メモリ:16GB以上
  • ストレージ:512GB以上

デザイン業界でよく使われるツール(Adobeなど)を快適に使うためには、上記のスペックがあると安心です。

デスクトップ・ノートPCのどちらが良いかという問題については、断然ノートPCをおすすめします。

カフェやコワーキングスペースなどの自宅外でも作業できたり、勉強会やセミナーでも使えたりと、場所や時間に縛られにくいWeb系の仕事だからこそ、ノートPCが便利です。

絶対に外に出ず、自宅だけで仕事をするという人は、デスクトップの方が効率良く作業できるかもしれません。

あひるくん
僕は外にも持っていきたいから、ノートにするよ!

Windows・Macのどちらが良いかについては、特にこだわりがないならMacを選んでおけば良いかなという程度で、どちらでも問題ありません。

両学長のおすすめは、M1チップ以上が搭載されている「Macbook Air」「Macbook Proです。

お金に余裕がある人は、これを選んでおけば間違いありません。

事前準備②:作業環境を整備する

ネット回線は、最安ではなく並み以上のモノを使いましょう。

日常生活で使う通信費は格安SIMをはじめとした安いモノが良いですが、仕事で使う通信費は必要以上にケチってはいけません。

ショボショボの悪い回線だと、以下のようなデメリットがあります。

悪い回線で起こりえること(例)
  • 学習用の動画を見る時に、画質が悪かったり止まったりしてイライラする。
  • ネットで調べものをするときにWebページが遅すぎてイライラする。
  • クライアントとWeb会議する時に通信が切れてしまう。

プログラミングの学習は、つまずくとただでさえイライラするので、回線速度に足を引っ張られている場合ではありません。

稼げるようになれば簡単に取り返せるコストです。

その他、自宅作業用にサブディスプレイがあると、学習効率・作業効率が爆上がりして、とても便利です。

  関連動画

デュアルディスプレイで作業効率42%アップ!【ゼロから学ぶITスキル】

事前準備③:タッチタイピングを習得する

タイピングが苦手な人は、タッチタイピングの練習をしておきましょう。

コーディングの世界では、タイピングの速度が時間単価に直結します。

タッチタイピングの練習におすすめのサイトは、e-typingです。

無料でタッチタイピングの練習ができるので、e-typingのローマ字タイピングで250ptを取ることを目標に頑張りましょう。

ただし、そもそもの目的はWeb制作(コーディング)で稼ぐことなので、250pt取れないと次に進めないワケではありません。

こぱん
寝る前の歯磨き感覚で、毎日やりましょう。

ちなみに、Web制作の世界では検索力がモノを言います。

一流のプログラマやクリエイターも、すべてがアタマの中にあるワケではなく、以下のサイクルを高速でぐるぐると回しています。

クリエイターなどが高速で回すサイクル

・分からないことがあったら調べる

→ 調べたことを実践する。

→ 問題解決できたら終了し、問題解決できなかったらまた調べる。

調べれば何でも分かるのがネットの世界です。

普段からネットサーフィンしまくっている人は、プログラミング学習の才能があります。

万が一、「普段から検索なんて全然しないよ!」という人は、「両学長 年収」のような感じで、検索する練習をしておいてください。

あひるくん
両学長の年収は気になるな…。

STEP②:コーディングを学ぶ

STEP②:コーディングを学ぶ

事前準備が出来たら、いよいよ本番なので実際にコーディングを学び始めます。

大きく分けて、以下の2つのフェーズがあります。

2つのフェーズ
  1. お金をかけずに学習するフェーズ
  2. お金をかけて学習するフェーズ

フェーズ①:お金をかけずに学習するフェーズ

まず、「Progate(プロゲート)」のレッスンを受けましょう。

Progateは、非常に有名なオンラインプログラミング学習サービスです。

次の2つの無料レッスンを受けてみましょう。

最初に受ける2つのレッスン
  1. HTML & CSS(初級編):学習時間の目安は3時間50分
  2. JavaScript Ⅰ:学習時間の目安は2時間

先ほど少し触れましたが、HTML&CSSは「Webページの“見た目”を作る言語」です。

一方のJavaScriptは、「Webページに“動き”をつける言語」です。

おしゃれなサイトでは、トップページの画像が数秒ごとに切り替わりますが、このようなサイトの多くは、JavaScriptで作られています。

あひるくん
JavaScriptで作られているサイトは多いんだね!

HTML、CSS、JavaScriptはWeb制作に必須の重要言語です。

この2つのレッスンをやってみた時点で、「自分は死ぬほど向いてない!」と思った人や「吐きそう!ムリムリ!」という心の叫びが聞こえた人は、Web制作に関しては諦めても良いかもしれません。

とはいえ実際のところ、やっているうちに楽しくなってきたり、分かる・できると楽しくなってきたりすることは多々あります。

魅力的な副業はWeb制作だけではないので、別な方向を探すのも全然ありでしょう。

こぱん
この辺りは直感を信じていきましょう!

フェーズ②:お金をかけて学習するフェーズ

Progateをやってみて、「イケそう」、「なんか楽しい」と思った人は次の段階に進みます。

少しお金をかけて、学習効率をあげて以下の方法でインプットしていきましょう。

1オンライン学習サービスを利用する
オンライン学習サービス

Progateの有料会員コース(月額1,078円)

有料会員になると、初級編だけでなく次の講座も受講できるようになる。

・HTML&CSS中級~上級編…全6レッスン15時間分

・JavaScriptⅡ~Ⅶ…全6レッスン11時間分

ドットインストールのプレミアム会員コース(月額1,080円)

Progate同様有名な学習サービス。1レッスンあたり1~3分の動画なので、スキマ時間でも学習しやすい特徴がある。

・もっと詳しくHTML/CSSを学んでみよう…全142回

・もっと詳しくJavaScriptを学んでみよう…全95回

・よくみるUIを作ってみよう…全61回

上記で紹介したオンライン学習サービスの講座を学習すれば、 基礎は十分です。

Progateもドットインストールも、月額約1,000円で受講できるので、3カ月加入したとしても3,000円強の学習コストで済みます。

あひるくん
とても格安なんだね!!
2書籍を利用する

書籍を利用して学習するパターンもアリです。

おすすめの書籍は、「1冊ですべて身につくHTML & CSSとWebデザイン入門講座」です。

こぱん
全283ページのボリュームで、値段は約2,500円となっています。

こちらを一冊やりきれば、基礎としては十分なので、動画より紙が良いという人は、1つの選択肢になるでしょう。

そして補足としてお伝えしたいことは、世の中の学習方法すべてに言えることですが、人によって向き不向きがあるということです。

Progateやドットインストールのレッスン、書籍での勉強を通じて「自分には合わない!」と感じた人は、自分自身で合う教材を探す必要があります。

「HTML入門」「JavaScript入門」などのワードで検索して、分かりやすく教えてくれているサイトを探しましょう。

Web制作やプログラミング界隈は、情報発信している人が非常に多いという特徴があるので、相性の良い人も見つかるはずです。