こんにちは、現在フリーランスのweb制作者として5年ほど活動しているしょーごと申します。
今回は私がWeb制作フリーランスとして活動する上でかかった費用についてお話します。
といったことがありましたので、みなさんはこの記事を呼んで事前に何にどれぐらいお金がかかるのか認識しておくようにしましょう。
必要なのはパソコンだけではありません。
Web制作フリーランスになるうえでかかる費用及び調達手段、お得に入手・契約する方法
お金がかかるもの一覧
- パソコン
- ネット環境
- スクール費用
- 学習教材費用
- Adobe CC
- サーバー・ドメイン
- WindowsOS（Windowsの人はMacOS）
- freee（フリーランスになるなら）
- WordPress有料テーマ
- 自宅作業環境
- 名刺
- 住民税、健康保険料
この記事を書いたのは
しょーご（@samurabrass）
当ブログ「しょーごログ」の運営者。2018年からWeb制作・フロントエンドエンジニアとして主にWordPressでのサイト制作やシステム開発のフロントエンドを担当。同時にブログとYouTubeで情報発信を行っている。駆け出しエンジニアのコーディング課題添削も行い、スクール講師を4年以上している経験を活かした分かりやすい記事制作を心がけている。
＼現役エンジニアのレビュー付き／
実践レベルのコーディング課題公開中
- デザインカンプからのコーディングを経験したい
- 現役エンジニアのレビューを受けてみたい
- 即戦力級のポートフォリオを用意したい
2024年にデザインを完全リニューアルしています！
コーディングに自身をつけるにはプロからのレビューを貰うのが必須なため、制作会社も利用するレビューツールで添削をしています。
Web制作学習ロードマップにも取り入れているため、学習終了まで迷わず進むことが可能です。コーディングを本気で仕事したい方はぜひご活用ください！
＼無料の入門編から本格企業サイトまで／
Web制作で必要なもの① パソコン
当たり前ではありますが、パソコンが必要です。
以前「Web制作・デザインに最適なパソコン」について述べていますので、詳しくはこちらを御覧ください。
MacBookがベストだが…
私は基本的にMacBookがいいと思っています。
ただ、これからWeb制作を始める方の圧倒的大多数がWindowsをお使いかと思います。
なので、スペックを満たせていればまずは大丈夫かなと思います。
最低スペック
| CPU | corei5 |
|---|---|
| メモリ | 8GB |
| ストレージ | SSD256GB |
推奨スペック
| CPU | corei5~7 |
|---|---|
| メモリ | 16GB |
| ストレージ | SSD512GB |
スペック不足を一番実感するのは、Photoshopやイラレのデザインカンプをもらったときです。メモリが4GBだとまともに動かなくなります笑
ちなみに、MacBookを買うなら、上記スペックを兼ね備えたMacBook Airで十分かと思います。
Web制作で必要なもの② ネット環境
ネット環境は誰の家にあるわけではありません。
しかし、実際に案件に取り組むようになると、家に「安定した」ネット環境があるのは必須になってきます。
- 顧客と案件開始まえのビデオミーティング、しかしネット回線が不安定で遅延が起こり、円滑にいかず終了。
- 1GB近くあるデザインデータを受け取るも、ダウンロードに一時間かかる
- WordPressサイトを本番に公開しようとするも、マイグレーションファイルが大きすぎて、寝て起きても終わっていない（実体験）
一つ一つ恐ろしさを説明していきます。
①ビデオミーティングでの遅延への印象
発注者の視点からだと、シンプルに「コミュニケーション・制作には不安定そうな環境だな」と思います。
実感としてネットのスピードが最低10Mbpsないと、円滑なビデオミーティングができないので、相手の心象を鑑みても必要です。
②③ 巨大データを扱えない
家のネットスピードが遅いと、Web制作で扱いがちな巨大ファイルが手に負えなくなることがあります。
例えば私の場合は、泊まっている宿のネットスピードが「2Mbps」しかでなく、WordPressサイトの本番環境への反映（All in one WP Migration）に半日かかりました。
ネットのスピードのせいで、当初予想していた工数を意外なところでオーバーしてしまったので、ネット環境は大事です。
出先での安定したネット環境
もし外出さきで作業することが多い方は、「ポケットWIFI」を利用すればOKです。
私が利用しているのは縛りなしWiFi
の通常プランですが、
毎日2GB使える上に、契約期間の縛りがない&常に20Mbps出ていてスピードも安定しているので、
出先で作業することも多い私には重宝しています↓↓↓
カフェなんかのWiFi使うよりこっちの方が途切れないし使いやすいですね。
Web制作で必要なもの③ スクール費用
学習をスクールで進める人も多いかと思います。
例えばWeb制作を勉強されるなら、最近リリースされた、案件獲得して納品まで経験できるテックアカデミーの6ヶ月間の『Web制作副業コース』に通う人がいるかもしれません。
Webデザインを学ぶなら、
Web制作会社の雄、LIGが運営するクリエイタースクールの『【デジタルハリウッド STUDIO by LIG】
』で、
Webデザインを勉強する人もいるでしょうし、
こちらは実戦形式で広告運用を学べる『マケキャン』に行く人もいると思います。
メンターをつける場合も
Web制作で必要なもの④ 学習教材費用
これはエンジニアになる以上、どんなベテランもずっと勉強を続けるので付き合いの長いものになります。
想像より多くの参考書を見ることになると思います。
以下は私が過去に学習する上で使ってきてよかった教材になります。
私がWeb制作関連で読んできてよかった本
プログラミング関連で良かった動画教材
WordPressのPHP勉強法
エンジニア35歳定年説
学習を止めるな
この「エンジニア35歳定年説」もあながち馬鹿にできるものでもなく、
学習を続けるのが想像以上に大変なため、プログラミングを好きでない人は35歳前に脱落し他の道にいくのだと思います。
特にWebの世界は変化が激しすぎるので、どんどん学習していく癖をつけておくのが、とってもとっても大事です！
Web制作で必要なもの⑤ Adobe CC
Adobe CCはもしあなたがWeb制作者になるたい場合、間違いなく必要になります。
「Web制作会社と仕事がしたい！」という場合はもはや逃れるすべはありません。
制作現場でほとんどのWebカンプはPhotoshopもしくはillustratorで作られている→Adobe CCを持っていないとデザインデータを開けない→案件開始前に持っていない&当然使い方を学習していない→差し迫る納期の中契約して、素材書き出しの学習からしないといけない→追い詰められ激しい後悔
Adobe CCを最安で手に入れる方法
Amazonがいくらセールをしようが以下の記事の手法より絶対に安くなりません。この3年間そうでした。
デザイナーだけではなく、コーダーにも必須のツールになりますので、ぜひ最安で契約しておきましょう！
Web制作で必要なもの⑥ サーバー・ドメイン
サーバー・ドメインは以下のような場合に必要になります。
- 自分でブログを立てる
- ポートフォリオサイトを作る
- お客さんの代わりにドメイン・サーバーを契約する
お客さんの代行作業
ドメイン・サーバーをどちらが契約するかは案件によりますが、直請けの案件だと
ドメイン・サーバーとかわからないから契約してよ。お金払うから
と言われるケースが大変多いです。
こんなときに自分でドメイン・サーバーの契約をしたことがない人は苦労します笑
なので私は案件前に「自分でWordPressブログを公開する」ことを推奨しています。
Web制作で必要なもの⑦ WindowsOS（Windowsの人はMacOS）
これもAdobe並に想定外になりやすいコストですが、Windows,MacOSのOSを揃える必要があります。
- WindowsPCを持っている人→MacOSが必要
- Macを持っている人→WindowsOSが必要（つまりWindows10）
- フォント確認
- ブラウザ確認（Chrome,FIrefox,Safari,Edge,IE）
詳しくは以下の記事を御覧ください。
Web制作で必要なもの⑦ freee（フリーランスになるなら）
フリーランスになる予定なら、
- 開業届
- 青色申告承認申請書
これを開業freeeで作成して提出し、日々の会計及び確定申告を会計freeeで行う必要があります。
遅かれ早かれ必要になるので、無料会員登録でいいので、登録しておきましょう！
Web制作で必要なもの⑧ WordPress有料テーマ
WordPressのテンプレートテーマを使用する場合、こちらで建て替えて実費請求する場合があります。
テンプレートの相場は大体¥15,000~30,000程度です。
テーマの使用代金はきちんと請求すれば先方から負担してもらえますが、一時的に立替えることになるので、
直近のキャッシュフローが安定していない人には予想外の出費で厳しいかもしれません。
Web制作で必要なもの⑨ 自宅作業環境
作業環境もとても大切です。
個人的に誰しも必要だと思うのは「PCスタンド」「モニター」です。
「無くても仕事はできるが、ないともう仕事にならない」ほど、快適になります。
おすすめスタンド
おすすめモニター
デスク周り全アイテム
Web制作で必要なもの⑩ 名刺
フリーランスは何気ない出会いが案件につながることが多いです。
そんなときに「自分を想起してもらうツール」として「名刺」が生きてきます。
名刺自体はデザインをCanvaで作成し、ラクスルで印刷・配送しました。
おまけ：住民税、健康保険料
これを読んでいる方がもし会社員で、将来的に退職→フリーランスを目指している場合はここ要注意です。
まず住民税・健康保険はフリーランスは自分で支払わなければなりません。
私は新卒一ヶ月で退職したので無関係でしたが、フリーランス独立すると前年度の会社員時代の所得にかかる住民税・国民健康保険を翌年6月から支払わないといけないので、
貯金を残しておかないと納税で苦しむことになります。
周りの会社員時代に高所得だった駆け出しフリーランス仲間は、いきなり住民税で数十万飛んでいてかなり苦しんでいました笑
これも思わぬ出費となりがちなので、以下の本で軽く予習しておきましょう。
これ一冊で確定申告まで対応できます。
Web制作フリーランスになるには意外に多くの費用がかかる
ここまでWeb制作フリーランスになるうえでかかる費用を解説してきました。
「勉強もしたしパソコンもあるし準備万端！！」では実はないので、
何にいくらかかるのか
あらかじめわかっておくといいですね。
今回の記事がそのお役に立てれば嬉しく思います。
それでは！
HTML初心者からWordPress実案件レベルまでのコーディング演習課題を「専用ページ」にて公開しています。
- Figma,Photoshopデザインからのコーディング
- サーバーアップロードでサイト公開
- プロによる最大3回の表示確認特典
- レビュー返しは爆速
- 2024年にデザイン刷新！被らないポートフォリオ
「初級編」は初めてデザインからコーディングする方向け
「中級編」はJavaScriptやjQueryの練習
「上級編」はWordPressの実案件を模擬体験できるレベル感にしています。
中級者の方には高難易度課題を詰め合わせた「即戦力セット」も出しています。
全課題で「実務レベルの、プロの厳しいレビュー」を受けられるようにしています。
また、2024年には随時デザインの刷新をしており、完全リニューアル！！
他者と差をつけられるポートフォリオが準備できます！
制作会社も使用する専用レビューツールで分かりやすく添削していきます！
基本的に「まとめて購入」していただくとかなりお得になります↓
コーディングは書籍だけではなかなか実力がつかないので、実務レベルのレビューを受けて自身をつけたい人は是非挑戦してみてください！
＼課題の購入はこちらから／
ご寄付を頂けると今後の更新の励みになります！
本や動画がメインになりますが、最近が学習サービスも多いですね。