収益の目安：月５万〜１０万円
作業時間　：１日１０分
難易度　　：★★★★★
即金性　　：★★★☆☆
継続性　　：★★★★☆
読了時間　：9分

月額０円！副業サロンへようこそ！

今回は、
「WEBデザイン、イラスト」
の稼ぎ方についてお話ししていきます。

この記事では、
Web業界未経験者がどうすれば
Webデザイナーとして
在宅で稼げるようになるのか？

実際に現役Webデザイナーの意見と
目線でいろいろと解説していきたいと思います。

そもそも在宅のWebデザイナーは稼げるのか？

そもそも在宅の
Webデザイナーってどれくらい稼げるのか？

という気になる疑問から考えてみます。

これは、在宅で働くWebデザイナーが
どの程度収入を上げているか、

国が公式に発表している数字は
存在しないため平均などを
表すことはできません。

そこで、たとえば具体的に
ホームページ制作ってどんな
料金で仕事を受けているの？

というところから見てみると
大体のイメージがつくのではないでしょうか。

以下はざっくりと算出してみた
ホームページ制作のおおよその値段です。

フリーランスの初心者を基準で
算出していますので実際はもっと
多い場合も少ない場合もありますが、
まずは参考までにご覧ください。


ホームページ制作料金

・トップページデザイン：50,000円／1ページ
・第2階層ページデザイン：15,000円／1ページ
・トップページコーディング：30,000円／1ページ
・第2階層コーディング：8,000円／1ページ
・バナー制作：5,000円／1点（小〜中サイズ）


後ほど解説しますが
「コーディング」というのは
デザインしたページを構築する作業のことです。

こんなイメージで、

例えば
・バナー制作10点依頼された場合：50,000円の売上
・Webデザイン10ページ分＋コーディングを依頼された場合：287,000円の売上

という形で受ける仕事の
内容によって金額が積み重なってきます。

技術力があってしっかり活動できる人は、
毎月60万円も稼げる方もいらっしゃいますし、
全く稼げない方もいらっしゃいます。

しかし、Web制作のスキルを
学ぶことは これだけ稼げる技術を
習得できるということですので、

手に職を持つメリットは
大きいのではないでしょうか？

未経験から在宅で働くWebデザイナーになるために必要なこと

もしあなたが今から在宅の
Webデザイナーを目指すなら、
最低でも2つ必要なことがあります。

最低でも必要なこと2つ
1.パソコンやソフトなどを用意すること
2.Webデザインやソフトの使い方を勉強すること

Webデザイナーにはパソコンや
ソフトが必須です。

そして次にWebデザインの
勉強が必要となります。

どちらもそれなりに
費用がかかりますが、
この2ステップは必ず必要に
なりますので、以下より詳しく解説します。

在宅のWebデザイナーに必要なパソコンやソフトとは？

在宅でWebデザインを行う上で
最低限必要なパソコンやソフトは以下の通りです。

最低限必要な環境

1.メインパソコン：MacBook Pro
※できれば外部ディスプレイも
2.確認用パソコン：Windows PC
3.確認用スマホ：iPhone
4.ソフト：Adobe CC

01. メインパソコン

一般的にデザイン作業を
含むWebデザイナーを
目指す場合はMacが主流です。

Windowsと比べてだいぶ
割高なのでハードルが高いですが、

作業の効率性がとても良く
、一度購入すれば数年は使えますし、
何より他社とのデータのやりとりなどを
考えるとやはりMacの用意が必要です。

デスクトップとノートパソコンがありますが、
こちらはノートパソコンがおすすめです。

お客様と打ち合わせする場合や
Web関連のイベントに参加する際などに
自前のPCを持っていく場合が多いためです。

気分転換にカフェで
仕事をすることもできます。

5インチ型のMacBook Proが
あれば仕事がしやすいですが、

価格を考えると13インチ型を購入し、
自宅での作業用に
外部ディスプレイを1台用意する形が理想です。

最近のWebデザインは横幅が
大きいタイプが多いため、

大画面で作業をすると
仕事の進みが全く違います。

ただし、こちらは最初は
無くても大丈夫ですので、
仕事をスタートして慣れてきた頃に
必要であれば購入しましょう。

02. 確認用パソコン

また、Windowsのパソコンも1台必要になります。
MacとWindowsではフォントや
構築時の仕上がりなどが異なるために、

確認用として1台必要になりますが、
こちらは多少古いものでも
お持ちであればそれで大丈夫です。

03. 確認用スマホ

スマートフォンが必要な理由は、
上記同様、表示の確認を行うためです。

昔のWeb制作はパソコン表示だけを
考慮していればよかったですが、
今ではスマートフォンの
閲覧シェアが半分以上を占めています。

スマホにはiPhoneとAndroidという
2つのタイプが存在しますが、

確認用としてはできれば
iPhoneを用意しましょう。

海外では圧倒的にAndroidユーザーが多いですが、
日本国内ではiPhoneユーザーがAndroidの2倍です。

※補足：ちなみに、iPadなどの
タブレットもあればなお良いですが、
こちらはPCでも簡易的に
確認できるため特に必須ではありません。

04. ソフトウェア

このあと解説しますが、
Web制作には「デザイン作業」と、
「HTML/CSSなどの構築作業」が必要になります。
Webの「デザイン作業」に
必要なソフトは以下2点が基本セットです。

デザイン作業に必要なソフト
・Adobe Photoshop：12,936円／年（税込）
・Adobe Illustrator：28,776円／年（税込）

そして「構築作業」に
必要なソフトは、以下の中で
好みに応じて使用します。

構築作業に必要なソフト
・Adobe Dreamweaver：28,776円／年（税込）
・Sublime Text：無料で利用可能
・Atom：無料で利用可能

「Adobe」と書かれたソフトは
それぞれ1年ごとに上記の金額が必要になりますが、
WebデザイナーはAdobe製品が
すべてセットになったAdobe CC（税込72,336円／年）を
使用するのが一般的です。

Webデザイナーが習得すべきスキルとは？

Webデザイナーに必要なスキルは、
どのようにお金を稼いでいきたいかに
よって以下のように習得するスキルが異なります。

バナー・ロゴ・イラスト受注程度（月収目安：1万〜5万円ほど）
・Photoshop ※デザインソフト
・Illustrator ※デザインソフト

Webサイトのデザインのみ受注（月収目安：3万〜18万円ほど）
1.Webデザインの基本知識
2.Photoshop ※デザインソフト
3.Illustrator ※デザインソフト
4.HTML/CSS基本 ※構築言語

Webサイトの構築を含むデザイン受注（月収目安：5万〜30万円ほど）
1.Webデザインの基本知識
2.Photoshop ※デザインソフト
3.Illustrator ※デザインソフト
4.HTML/CSS 基本・応用 ※構築言語
5.JavaScript/jQuery ※プログラミング
6.レスポンシブデザイン ※※HTML/CSSの応用版

それぞれどんなものかサクッとご紹介します 。

Webデザインの基本知識

Webサイトをデザインする前には、
あらかじめWebデザインの基本知識に
ついて理解しておくとその後の
スキル習得がスムーズに進むためおすすめです。

Photoshop（フォトショップ）
PhotoshopはWebデザインのレイアウトや
バナー作成、写真加工などを
行うためのデザインソフトです。

Webデザインの
定番ソフトですので、まず始めに習得しましょう。

Illustrator（イラストレーター）
IllustratorはPhotoshopでは
苦手なロゴやイラストなどを
制作するためのデザインソフトです。

Illustratorで作ったロゴなどを
Photoshopに入れ込んだり、
逆にIllustratorのみで全ての
Webデザインを行う方もいらっしゃいます。

HTML／CSS
実はPhotoshopなどのデザインは
あくまでデザインサンプルであって、

実際はそれをHTML・CSSという2つの
技術を用いてインターネットで
閲覧できるように再構築する必要があるのです。

そして構築することで
ようやくWebサイトとして一般公開できます。

JavaScript／jQuery
JavaScriptはHTML/CSSだけでは
表現が難しいアニメーションなどを
作る場合に必要な知識ですが、

こちらはやや複雑ですので
初心者は基礎知識程度でかまいません。

jQuery（ジェイクエリー）というのは
JavaScriptをさらに簡単に
使えるようにした技術ですので、
こちらをベースに学びましょう。
レスポンシブサイト
パソコン・タブレット・スマホの
いずれかで見ても最適化された
Webページが表示されるサイトの
ことをレスポンシブサイトといいます。

今ではパソコンよりも
スマホでWebが見られる
機会が多くなりました。

レスポンシブサイトは基本的に
HTML/CSSの応用版ですので、
こちらをおさえれば比較的
スムーズに知識習得が可能です。

独学vsスクール。未経験者が在宅Webデザイナーで稼ぐためのスキル習得方法

つづいては、そのスキル
習得方法について解説します。
スキルを磨くためには
以下の方法がありますので、
それぞれのメリット・デメリットと
おすすめのスクールなどを
合わせてご紹介します。

スキルを磨く方法独学で学ぶ
オンラインスクールで学ぶ
教室へ通うタイプのスクールで学ぶ

方法1：独学で学ぶ

一般的にはこの独学で学ばれる方が
多いのではないでしょうか。

独学で学ぶことのメリットは
あまりお金をかけずに学べるということです。

また自分のやり方に合わせて
自宅で自由に学べることもメリットではないでしょうか。

デメリットは計画的に
進めないと挫折してしまう点です。

たった一つの小さな疑問点に
丸一日かかることも珍しくなく、
分からないことが続くとそれだけで
モチベーションは低下します。

また、ちゃんと学んだつもりでも
まだまだ基本的なことしか学んでいなかったり、
いざ仕事をしてみると応用的なこと
ばかりでついて行けない場面に出くわすことがあります。

メリット
・あまりお金をかけずに学べる
・自宅で学べる
・自分のやり方に合わせて自由に学べる

デメリット
・学ぶための本やサイトを一つ一つ自分でセレクトしなければいけない
・学んだことがちゃんと仕事として使えるか分からないため不安になる
・効率的な勉強方法がわからないために、思った以上に時間がたっている

方法2：オンラインスクールで学ぶ

オンラインスクールとは
自宅にいながら自分のパソコンを
通して勉強が進められるスクールのことです。

オリジナルカリキュラムや課題、
講師とのチャットなどを通して、
短期間で効率的に学習を進められます。

スキマ時間に学習が
進められるオンライン学習が
とっても効率的です。

不安なことも講師に質問を
しながら学べるため、

独学にありがちなデメリットが
払拭されることが主なメリットです。

一方、デメリットはお金がかかることです。

メリット
・短期間で効率的に学習を進められる
・講師に疑問点や不安なことなどを相談しながら進められるため安心
・在宅ワークや就職する際のサポートが得られる

デメリット
・学ぶためのお金がかかる

方法3：教室へ通うタイプのスクールで学ぶ

パソコンスクールが代表的ですが、
最近ではWeb・プログラミングに
特化したスクールも増えてきました。

子育てをしながらのスクール
通いはなかなか難しい面もあると思いますが、

講師を目の前にして学習＆質問が
できる環境は習得効率が全く違いますし、
何より人脈が作れるメリットは
卒業後にも大きく貢献します。

デメリットはやはり設備が
整う分、オンラインスクールよりも
料金が高い点や、通うための
コストがかかる点です。

メリット
・講師にすぐ、身振り手振りで質問ができるため理解が早い
・同期や講師などの仲間が作れる
・独立や就職のためのさまざまなサポートが受けられる

デメリット
・オンラインスクールよりも料金が割高
・通うためのコストがかかる


ここまでいかがでしたか？
もっと詳しくWEBデザイン、イラスト
について知りたい、聞きたい人は、
しゅん公式LINEまで

「WEBデザイン、イラスト詳細希望」

と一言送って下さい。
クリックしたらLINEに飛びます↓

公式ラインアカウントリンク

送って頂いた人には、
個別にコチラからご連絡
させて頂き、

詳しいWEBデザイン、イラストについて
個別レクチャーします。