InstagramやTwitterなどのSNSでは、Webデザインの副業で稼ぐ人がたくさんいます。デザインに対して興味を抱く方なら、自分も副業を始めてみたいと思うかもしれません。しかし、未経験でもデザインの副業がはじめられるのか不安になりますよね。
結論、未経験でもWebデザインの副業ははじめられます。
しかし実際にWebデザインの副業を行うとなると、どんな仕事があるかや、どのくらい稼げるのかなど疑問も多いと思います。
この記事で紹介していることはWebデザインの副業における、仕事の種類や報酬の相場、必要なスキルです。記事の後半では、未経験から副業を始める際のロードマップを公開しています。
最後までお読みいただきますと、Webデザインの副業のスタートラインに立つことができます。
- Webデザインの仕事で副業をするメリット
- Webデザインの副業の仕事や必要なスキル
- Webデザインの案件の報酬相場
- Webデザインを未経験から始める手順
無料でプログラミングの質問ができるサービス
30日間無料でweb制作が学べるZeroPlus Gate！
- Web制作に特化
- 50本以上の動画教材で学べる
- 30日間に4回の対面サポートがある
- Slackで質問し放題
目次
Webデザインの仕事で副業する3つのメリット
在宅でWebデザインの副業をするメリットには、以下の3点があります。
- 在宅で働ける
- 将来性が高い
- 高い収入が見込める
在宅で働ける
Webデザインはパソコンとネット環境さえ整えれば、在宅で働けるのがメリットです。
デザインの作成に伴って、依頼者と打ち合わせをする必要はあります。しかし、打ち合わせについて直接会う必要はなく、ZOOMやGoogle Meetを使用したビデオ通話で済ませることができます。そのためWebデザインは家事や育児で忙しく、外へ働きに出られないといった主婦でも在宅で隙間時間に取り組める人気の副業です。
将来性が高い
将来性の高さもWebデザインの魅力です。Webデザインの将来性の高さを裏付ける事実として、多くの企業でWebマーケティングを取り入れていることが挙げられます。
以下は電通が発表した日本の広告費における、2005年から2021年までの推移です。
引用元：電通報「2021年 日本の広告費」解説－広告市場は大きく回復。インターネット広告費がマスコミ四媒体の総計を初めて上回る
マスコミ四媒体広告費とはテレビ・新聞・ラジオ・雑誌を媒体とした広告費用の合計額のことです。データによるとインターネット広告費は2005年から右肩上がり。そして2020年には初めてインターネット広告費がマスコミ四媒体広告費を実額で上回っています。
今後もこの傾向は続くと予想できるため、WebサイトやWeb広告のデザインに関する案件も増えると予測できます。そのためWebデザインのスキルを身につけることは、将来性が高いといえるのです。
高い収入が見込める
Webデザインの副業を行うメリットとして、高い収入が見込めます。以下はクラウドソーシングサイトの最大手「クラウドワークス」におけるデザインの案件の報酬相場です。
引用：クラウドワークス「クラウドワークスの相場一覧表」
バナー作成は5,000円、ロゴ作成は20,000円、Webデザインは50,000円がそれぞれ相場となります。たとえば「月間50,000円を副業で稼ぐ」にも現実的な相場といえます。
同様にパソコンを使用して在宅で稼げる副業である、Webライティングの相場も見てみましょう。
クラウドワークス「クラウドワークスの相場一覧表」
Webライティングでは一記事あたり2,000円が相場となっています。このように他の副業と比較してみると、Webデザインの報酬相場は高額であることが見て取れます。
Webデザインの副業における仕事の種類
Webデザインの副業における仕事には以下の種類があります。
- バナーデザイン
- ロゴデザイン
- サイトデザイン
- LPデザイン
- ページリニューアル
それぞれ詳しく紹介します。
バナーデザイン
バナーとは「旗」や「のぼり」を意味する単語のことで、Web上に設置されるリンク画像のことを指します。ユーザーを特定のページへ誘導することがバナーの目的となります。下はバナーの一例です。
このようにバナーは写真・イラストとキャッチコピーを組み合わせて構成されています。画像やキャッチコピーといった素材が依頼主から用意されている案件では、配色やレイアウトを決めて作成するのみです。
他の仕事と比べて、短時間で作成できる特徴を持つため、初心者にも取り組みやすい仕事といえます。
ロゴデザイン
ロゴとは企業の理念や商品のイメージを、文字や図形、イラストを使って図案化したものです。以下はロゴデザインの例です。
ロゴデザインは報酬がバナーデザインより高い傾向にあります。
しかし、事業や商品の顔になる部分をデザインするため大きな責任が伴います。またヒアリングを通してデザインにまとめあげる難しさもあります。
たとえばスターバックスのロゴは、ギリシャ神話に登場するセイレーンという人魚をモチーフにしてデザインされています。セイレーンは美しい歌声で船人を魅了したという逸話があり、スターバックスのロゴには「コーヒーの香りで道行く人々を魅了したい」という意味が込められています。
このように商品・サービスについて深く掘り下げ、デザインへと反映させていく点がロゴデザインの難しい点です。
サイトデザイン
サイトデザインとはWebサイト全体のデザインを作る仕事です。Webデザイナーの仕事といえば、真っ先にサイトデザインをイメージする方も多いでしょう。
サイトをデザインするにあたっては、見栄えが良いだけではなく、ユーザーの利便性を意識したデザインを考案する必要があります。またWebサイトを作る目的は依頼者ごとに異なります。目的を達成できるようにヒアリングや市場調査を通して得た情報を、デザインに反映します。
サイトデザインは高いスキルが求められる仕事のため、バナーやロゴのデザインで実績を重ねてから挑戦することをおすすめします。
LP（ランディングページ）デザイン
LP（ランディングページ）とはサービスや商品の魅力を伝えて、販売につなげることを目的とした、チラシに似たWebサイトです。
LPの特徴として、縦長のレイアウトと単一のページで構成されている点が挙げられます。複数のページを必要とするWebサイトよりもデザインの分量は少なめのため、取り組みやすい面があります。
しかし、LPデザインにはLPなりの難しさがあります。それは商品やサービスの販売につなげなければならないという、明確な目的があることです。
売り上げの目標を達成できるようにユーザーの心理を考慮して、情報を見せる順番やレイアウト、配色を決めるといった、マーケティング目線をデザインに反映させる必要があります。
ページリニューアル
ページリニューアルとは、既存のサイトにおけるデザインの改善案を作成する仕事です。
一口にリニューアルといっても、既存のサイトの一部を改修するものから、全く新しいサイトに完全リニューアルするものまで、案件の内容は様々あります。
ゼロからサイトをデザインするよりも、取り組みやすいように感じるかもしれません。しかし既存のサイトの問題点を正確にとらえる分析力、そして改善案を作成する提案力が求められます。
Webデザインに関連する3つのスキル
Webデザインに関連する3つのスキルを紹介します。
- デザインスキル
- コーディングスキル
- Webマーケティング
それぞれ詳しく紹介します。
デザインスキル
デザインスキルはWebデザイナーにとって根幹となるスキルです。ここではデザインスキルにおける代表的なものを紹介します。
デザインの基礎知識
デザインの4大原則や配色といったデザインの基礎知識は、Webデザインを行うために必須のスキルです。たとえば利用しやすいレイアウトや、ターゲットユーザーに好まれる色やフォントを決めるうえでは、デザインの基礎を理解しておく必要があります。
UX/UIデザインツール
AdobeXD（アドビエックスディー）やFigma（フィグマ）などUI/UXデザインツールは、Webサイト全体のレイアウトを作成するために使用します。UI/UXデザインとは端的に表すと「ユーザーが快適にサイトを利用できるような」デザインのことです。
たとえばECサイトであれば商品が選びやすく、購入まで迷わず進めるサイトはUI/UXのデザインに優れているといえます。
Photoshop（フォトショップ）
PhotoshopはAdobe製の写真加工ソフトです。写真の明度調整や彩度の変更、ぼかしや合成といった加工を施せます。
写真はWebサイトの印象を大きく左右する要素です。必然的にWebデザインにおいて写真を利用する頻度は高まるため、Photoshopのスキルはデザインの副業においても欠かせません。
Illustrator（イラストレーター）
IllustratorはAdobe製のグラフィックデザインツールで、イラストやロゴの作成に適しています。Photoshopと比較すると使用頻度はやや低めですが、使い方を習得すれば仕事の幅を広げてくれるデザインツールです。
コーディングスキル
コーディングスキルはブラウザ上にWebサイトを構築するためのスキルです。デザインをもとにしてプログラミングしながら、忠実にWebサイトを形にします。
Webデザイナーがデザインからコーディングまで一貫して請け負えると、市場価値を高められます。
ここではコーディングに必要なスキルを紹介します。
HTML/CSS
HTMLはWebサイトのテキストや画像などの要素を作成できる、マークアップ言語です。普段目にしているWebサイトの文章や画像は、HTMLによって表示されています。
一方、CSSはHTMLで作成した要素を装飾する役割を持つスタイルシート言語です。テキストの色を変える、太文字にするなど、見た目に変化をつけるために用います。
Webデザイナーがサイトデザインを請け負うならば、コーディングスキルのうちHTML/CSSは必ず習得しておくべきです。コーディング作業が円滑になるポイントを押さえたデザインが作れます。コーディング担当者との連携がスムーズになるため、「現場でモテるWEBデザイナー」になれます。
HTML/CSSを学んでみたいと思うあなたへ
この記事を読み、HTML/CSSを学んでみたいと考える方もいらっしゃるのではないでしょうか。HTML/CSSを短期間で身につけるためには、プログラミングスクールの利用がおすすめです。
しかし「プログラミングスクールは学費が高額なイメージがあるので通えない」。このように思っていませんか？
そんなあなたに紹介したいのが無料で通えるプログラミングスクール「ZeroPlus Gate」です。ZeroPlus Gateとは、30日間でHTML/CSSをマスターできるプログラミングスクールです。
ZeroPlus Gateの3つの特徴を紹介します。
- 現役エンジニアが作成したカリキュラムを、完全無料で学習可能
- 毎週1時間、メンターとの1on1面談
- 本格的なWebサイトを作れるように、専属のメンターが徹底サポート！（質問は無制限）
信頼できるメンターと二人三脚になり、Webサイトを制作できるスキルをつかみ取れます。
興味を持ってくださった方は「ZeroPlus Gate公式サイト」をぜひご覧ください。
ZeroPlus Gateとはたった30日間で、Webサイトを作る技術が身につくプログラミングキャンプです。
ZeroPlus Gateの3つの特徴を紹介します。
- 現役エンジニアが作成したカリキュラムを完全無料で学習可能
- 毎週1時間メンターとの1on1面談
- 本格的なWebサイトが作れるように専属のメンターが徹底サポート！（質問は無制限）
30日という短期間で信頼できるメンターと二人三脚になり、Webサイトを制作できるスキルを掴み取れます。
プログラミングが自分に向いているかわからず、一歩踏み出して挑戦するのが不安に思う方もご安心ください。
プログラミングキャンプZeroPlus Gateは完全無料のサービスです。
ZeroPlus Gateに興味を持ってくださった方は、「ZeroPlus Gate公式サイト」よりお申し込みください。
JavaScript
JavaScriptはWebサイトに変化や動きをつける際に使用するプログラミング言語です。HTML/CSSと比較すると習得の難易度は高いものになります。
デザインの副業においては必須のスキルではありません。もしコーディング作業に深く関わりたいと考えるならば習得する必要があります。
Webマーケティングの知識
Webマーケティングとは、「Web上で集客を行い商品を販売する活動」を指します。
Webマーケティングに強いデザイナーは、依頼主からの信頼を得やすくなります。バナーやLPのデザインが解決すべき課題は、多くの場合、集客力や売上を高めることにあるからです。
Webマーケティングの知識を身につければ売り上げを高めるために、根拠をもってデザインを作成できます。またサイトの集客力を高めるために、SEOについて理解しておくことも有効です。
Webマーケティングは、Webデザインの副業における報酬の単価アップに欠かせないスキルといえます。
用語解説：SEO
Googleの検索結果において、特定のキーワードで上位表示するための施策
【未経験者向け】副業Webデザインの始め方
副業でWebデザインを始める4つのステップについて解説します。
- STEP1. スキルを学ぶ
- STEP2. クラウドソーシングでコンペ案件に応募
- STEP3. ポートフォリオサイトを制作
- STEP4. 営業する
ステップごとに説明します。
STEP1. スキルを学ぶ
Webデザインのスキルを学ぶ方法には、独学とデザインスクールで学ぶ方法の2通りがあります。
独学
独学のメリットは、学習コストを抑えられることです。一方デメリットとしては、疑問をすぐに相談できる相手がいないことが挙げられます。そのため壁にぶつかったときに挫折してしまうことが多くなります。
独学でデザインを学ぶ方法には以下の手段があります。
- YouTube
- SNS
- 書籍
近年はプロのデザイナーがYouTubeやSNSでデザインのノウハウを活発に発信しており、誰でも手軽にデザインを学べます。また書籍を使った学習も、正しい知識を身につけるうえで有効です。
ここではWebデザインを学ぶうえでおすすめの書籍を2冊紹介します。
1冊ですべて身につくHTML&CSSとWebデザイン
『1冊ですべて身につくHTML&CSSとWebデザイン』はWebデザイナー志望で、コーディングも学びたい方におすすめの書籍です。
一般的なHTML/CSS関連の書籍はデザインがおざなりになっている傾向にあります。その点本書は、HTML/CSSの教本でありながらデザインについてのトピックも多くそろっています。
WebデザインとHTML/CSSの基礎を併せて学ぶには、ピッタリの書籍です。
Photoshop よくばり入門 CC対応 (できるよくばり入門)
『Photoshop よくばり入門』は初めてPhotoshopを使う方が、手にとる一冊としておすすめです。基礎から丁寧に解説されており、正しいPhotoshopのスキルが身に付きます。
Amazonの口コミでは、自己流でPhotoshopを使ってきた読者より「正しい知識を学べてよかった」との声もあります。動画解説付きで手を動かしながら取り組めるため、実践的に独学が行える一冊です。
スクールで学ぶ
短期間でデザインスキルを身につけたいと考えるならば、スクールの利用がおすすめです。
スクールに通うメリットとして、現場で活躍するデザイナーから学べることが挙げられます。自分のデザインをフィードバックしてもらえる機会は貴重です。「こうしたらもっと良くなる」といった建設的なアドバイスがもらえるため、早く上達できます。
また疑問に思うことをすぐ質問できる環境を得られるため、挫折を防ぎやすくなります。
ここでおすすめのスクールを3種類紹介します。
famm
「famm」は主婦専用のWebデザイナースクールです。主婦が育児をしながら学習できるように設計されています。
デザイナースクール「famm」の特徴
- ライブ講義は平日の時間帯に開催
- 子供と一緒に講義への参加が可能
- ベビーシッターの無料サービス付帯
| Famm | |
| 学べるスキル | HTML /CSS・Photoshop（卒業後に約40種類のスキルが学べる応用講座へ参加可能） |
| 講義期間 | 1カ月 |
| 受講料（税込） | 173,800円（オンライン講座） 195,800円（対面講座） |
デジタルハリウッドSTUDIO by LIG
「デジタルハリウッドSTUDIO by LIG」は、Webデザインのスキルを幅広く身につけて大きく稼ぎたい方にはおすすめのスクールです。
デジタルハリウッドSTUDIO by LIGの特徴
- 半年でデザインツールの使い方やコーディングを含む20種類のスキルを学習できる
- 在学中に模擬案件を体験できる
- マンツーマンで添削を受けながらポートフォリオサイトを作成できる
| デジタルハリウッドSTUDIO | |
| 学べるスキル | HTML /CSS・JavaScript・Photoshop・Illustrator・デザイン基礎原則・バナー作成など全20種類 |
| 講義期間 | 6カ月 |
| 受講料（税込） | 495,000円 |
半年間でWebデザイナーを目指す「デジタルハリウッドSTUDIO」
インターネット・アカデミー
「インターネット・アカデミー」は豊富なデザイナー向けのコースをそろえたスクールです。自分のキャリアプランに合わせたコースを選択できます。
インターネット・アカデミーの特徴
- PhotoshopとIllustratorの講座に特化した「Webデザイナー入門コース」
- コーディングスキルも学べる「Webデザイナーコース」
| インターネット・アカデミー | |
| 学べるスキル | Photoshop・Illustrator・HTML /CSS・JavaScriptなど受講コースによって異なる |
| 講義期間 | 1〜3カ月（Webデザイナー入門コース）3〜4カ月（Webデザイナーコース） |
| 受講料（税込） | 209,000円（Webデザイナー入門コース） 367,000円（Webデザイナーコース） |
STEP2. クラウドソーシングでコンペ案件に応募
クラウドソーシングとは仕事を頼みたい企業や個人と、仕事を請け負いたい人のマッチングサイトです。登録したら、まずはコンペ案件に応募してみましょう。
クラウドソーシングにはコンペ形式と契約形式、2種類の案件が存在します。
| 案件の種類 | 内容 |
| コンペ形式 | 与えられたテーマに沿ったデザインを提案。採用されれば報酬を得られる。 |
| 契約形式 | 契約を交わしてから案件に着手する |
コンペ形式は応募したデザインが採用されない限り、報酬を得られません。とはいえ自由に応募できるため、学習段階でも腕試しとして挑戦できます。うまく採用されれば、この時点で収入を得られます。
一方、契約形式で案件を受注できれば、デザインを納品した後には確実に報酬を得られます。ただし、実績を示すポートフォリオがなければ契約を結ぶことが難しく、未経験者にはハードルの高い面があります。
まずはコンペ形式の案件に積極的に応募してみましょう。
STEP3. ポートフォリオを作成する
ポートフォリオは、自身のデザインをまとめたWebサイトのことです。営業の際に自分のデザインをまとめて見せられます。そのため依頼者側が仕事を頼むかどうか判断しやすくなるといったメリットがあります。
学習を進めながら自分の作品を増やし、ポートフォリオにまとめましょう。
ポートフォリオを作成する手段には以下の2つがあります。
- ポートフォリオ制作サービスを利用する
- ポートフォリオサイトを自作する
それぞれの方法について紹介します。
ポートフォリオ作成サービスを使用する
ポートフォリオ作成サービスを使用すれば、手軽にポートフォリオを作れます。
ここでは無料で利用できるおすすめのサービスを2つ紹介します。
Foriio（フォリオ）
Foriioは「30秒で作れるポートフォリオ」がキャッチコピーとなっており、短時間でポートフォリオを作れるサービスです。
またイラスト・写真・動画制作の分野で活躍する、約43,000名以上のクリエーターとSNSの感覚で気軽に交流できます。そのためForiio経由で案件の受注も狙えます。
RESUME(レジュメ)
RESUMEはシンプルなポートフォリオが簡単に作れるサービスです。
スキル一覧・経歴・作品集・リンク集などを端的にまとめた、見やすいポートフォリオが作れます。ただしカスタマイズ性は低めで、デザインがやや画一的に感じられるといった声が上がっています。
ポートフォリオサイトを自作する
コーディングスキルを身につけているならば、ポートフォリオサイトの自作をおすすめします。デザインスキルと合わせて、コーディングスキルもアピールできるため営業の際に有利です。
なおデザイナースクールによっては、ポートフォリオサイトの作成がカリキュラムに組み込まれている場合もあります。ポートフォリオのクオリティは仕事の獲得のしやすさに直結する要素となりますので、スクールに通う大きなメリットといえます。
STEP4. 営業
ポートフォリオが完成したら、営業をかけてみましょう。
営業の方法には以下の3種類があります。
- 知人・友人
- クラウドソーシングサイト
- SNS
友人・知人
友人や知人への営業はハードルが低いため、実績が少ないときでもおすすめの方法です。
たとえば個人事業主ならば、自分の事業におけるWebサイトを持ちたいと考えていたり、ロゴやバナーを必要としている場合があります。名刺やフライヤーの作成を提案してもよいでしょう。
最初は低単価でもかまわないので、実績を積むことを優先します。作成したデザインをポートフォリオに掲載させてもらえるか、事前に交渉しておくのがおすすめです。
クラウドソーシングサイト
クラウドソーシングサイトを利用すれば、効率よく案件に応募できます。希望の案件を選び、応募文を送るだけで営業を完了できます。ポートフォリオを活用して、自分のスキルをアピールしましょう。
ここで代表的なクラウドソーシングサイトを2種類紹介します。
クラウドワークス
クラウドワークス は最大手のクラウドソーシングサイトです。初心者向けから上級者向けの案件まで、豊富にそろっています。初めての案件探しにおすすめなサイトです。
ランサーズ
ランサーズはクラウドワークスに次ぐ大手のクラウドソーシングサイトです。クラウドワークスと比較すると、やや案件の報酬単価が安定している印象がありますが、それほど大きな差はありません。
SNS
TwitterやInstergramなど、SNSに自分のデザイナー用のアカウントを作りましょう。
サイト制作会社のアカウントが案件を募集していたり、異業種の方と交流するうえで仕事につながったりと、案件を獲得できるチャンスが様々あります。
副業を始めるならば税金の知識は必須
副業を安全に行ううえで欠かせないのが、税金に対する理解です。副業収入を得ているならば自分で確定申告を行い、税金を納める必要があります。
【原則】副業所得が20万円以上なら確定申告は必須
給与以外の副収入の合計所得が20万円を超えた場合には確定申告が必要です。所得とは収入から経費を引いた金額のことを指し、計算式にすると所得 ＝ 収入 − 経費と表します。
たとえばWebデザインで年間25万円を稼ぎ、仕事用に8万円のパソコンを購入した場合を考えてみましょう。
所得17万円 ＝ Webデザインの収入25万円 － パソコンの購入費用8万円
パソコンの購入費用の8万円は経費と認められるため、所得は17万円で確定申告は必要ありません。
しかし、パソコンの購入費用が5万円の場合は所得が20万円を超えます。このケースでは確定申告の手続きを行って、所得税を納める必要があります。
所得20万円 ＝ Webデザインの収入25万円 － パソコンの購入費用5万円
副業所得が20万円未満でも確定申告はしたほうがよい
実は副業所得が20万円未満でも、確定申告をしたほうがよいのです。
「副業所得が20万円を超えなければ確定申告は必要ないんじゃなかった？」
このように思われるかもしれません。
副業所得が20万円未満でも確定申告をした方が良い理由は、住民税は副業所得が少しでもあれば納付義務があるためです。
住民税の税率は一律10％のため、5万円を副業で稼いだ人ならば5千円の税金を納めなければなりません。所得が20万円未満でも確定申告をしておけば、自動的に住民税が計算されて6月ごろに納付書が届きます。
一方、確定申告を行わない場合は住民税の納付書が届かず、そのまま放置しておくと住民税の納付もれとなってしまいます。そのため副業所得が20万円未満でも確定申告はしておいた方がよいのです。
また主婦の場合は稼ぎすぎてしまうと、旦那さんの税金が増えてしまうこともあります。主婦が副業をする際の税金や扶養に関する注意点を知りたい方は以下のページをご覧ください。
主婦向けの副業12選！隙間時間で稼いでお小遣いや家計の足しに
こちらをお読みいただきますと、主婦が副業をする際に押さえておくべき注意点を押さえておくことができます。
まとめ
この記事では副業で請け負えるWebデザインの仕事内容や、必要となるスキルについて紹介しました。仕事内容はバナーのようにサイトのパーツとなる部分をデザインする仕事から、サイト全体をデザインする仕事まで様々あります。
Webデザイン副業を行う場合に求められるスキルとして、デザインツールの使い方やデザインの基本原則を身につけておく必要があります。また、単価アップを狙うのであれば、コーディングスキルやWebマーケティングを学んでいくとよいでしょう。
記事の後半では未経験者が、デザインの副業を始めるまでのロードマップを公開しています。
手順は以下のとおりです。
- STEP1. スキルを学ぶ
- STEP2. クラウドソーシングでコンペ案件に応募
- STEP3. ポートフォリオサイトを制作
- STEP4. 営業する
ぜひ参考にして、Webデザインの副業に挑戦してみてくださいね！
プログラミング学習でこのような経験はありませんか？
- 目標に向けて何を学べば良いかわからない
- 調べても解決策が見つからない
- 現場レベルのスキルが身につくのか不安
これらの悩みは、学習環境を整えることで全て解決することができます。
ZeroPlus Gateでは、30日間無料で最適な学習環境を提供しています。
- なんでも相談できる専属メンター
- いつでも技術相談ができるプロ講師
- 元IT企業CTO監修のカリキュラム
条件なしでこのレベルの環境を無料で提供しているのはZeroPlus Gateだけです。
ただし、無料サービスの提供には参加者の数に制限があります。
少しでも興味がある方は、以下のリンクからサービスの詳細をご覧ください。
