logo

小さなお店や女性向け店舗等の
ホームページを作成しております

blog

ブログ

【実録】在宅でwebデザイナーになり収入を得るための手順公開

【実録】在宅でwebデザイナーになり収入を得るための手順公開

副業でも、本業でも!在宅でwebデザイナーの仕事をするために必要な手順を解説します。


目次

    1. 1.webデザイナーの種類
    2. 2-1.①コーダーとして活動したい
    3. 2-2.②デザイナーとして活動したい

1.webデザイナーの種類

webデザイナーの種類
子育て中だったり、親族の介護をしていたり、または副業として空いた時間に、在宅でできる仕事といえば、今人気のwebデザイナーです。
まず初めに、webデザイナーと一言で言っても、仕事の内容はさまざまです。自分がどの部分をやりたいか、また得意なのかを最初にはっきりと決めておくと最短で技術を身につけ、収入を得るのに近づくことができるでしょう。

簡単に分けると以下の3種類になるかと思います。
①html/cssといったプログラミングに近いコードを書いてwebページを作っていく「コーダー」
②webページをかわいくしたり見やすくしたり装飾してデザインする「デザイナー」
③両方を一挙に請負う「Webデザイナー」

わかりやすく区別するためにあえて名前を変えて説明しましたが、どの作業もwebデザイナーと言えば当てはまる職業となります。

私の場合、上記の種類を最初に把握しておらず、全てを一気に習得しました。なので、基本を抑えるのに半年以上かかってしまいました。
①または②のみに特化する場合は、最短1ヵ月ほどで技術の習得も可能ではないかと思います。
では順に解説していきますね。

2-1.①コーダーとして活動したい

コーダーとして活動したい
コーダーとして活動していきたい、という場合は、htmlとcssについて勉強します。私の場合は、まず初めにprogate(プロゲート)というサイトで無料で勉強を開始しました。
progate画面キャプチャ

基礎的な部分はなんと無料で使用することができます。なので、まずは無料の部分をやってみて、自分に合っているのか、この先これを学んで楽しく仕事にすることができるのか、そのようなことを考えながらお試しするにも丁度よいサイトかな、と思います。

progateでは、htmleやcss、JavaScript、jQueryなど、webデザイナーになるために知っておきたい言語を学習することができます。
本格的に勉強したい、となったときに有料会員に移行し、勉強を進めて行けばよいと思います。

html&cssのマークアップに関して、一通りのコースを学習し終えたら、あとは実際に手を動かしてやってみる、それにつきます。
おすすめなのは、「サイト模写」を行うこと。世にすでにあるwebサイトを自分でhtml&cssでマークアップしてみるのです。
サイト模写しやすいページ、というのがありますので、レベルの簡単なものからチャレンジしてくださいね。
初めから難しいものを選んでしまうと、絶対に挫折します。

ここで一つおすすめしたいのは、Writeというページになります。
writeのデモページ

また、独学で勉強しているとき、躓いた時はたいていのことはGoogle先生にお尋ねすれば回答をもらえることが多いです。
もし答えが見つからない場合は、Q&Aサイトのようなところに投稿して聞いてみるのも手かもしれません。

そして、もう一つのおすすめは、本で勉強すること。
私の場合は、progateで一通り勉強した後、本での勉強もしました。
本で勉強した場合、常に手元に置いておけば、辞書のようにすぐ調べることができるのでおすすめです。

私は、こちらの『1冊ですべて身につくHTML & CSSとWebデザイン入門講座』を何回か繰り返し勉強しました!わかりやすく、おすすめです。

1冊ですべて身につくHTML & CSSとWebデザイン入門講座 [ Mana ]

価格:2,486円
(2021/3/2 16:18時点)
感想(19件)

2-2.②デザイナーとして活動したい

デザイナーとして活動したい
デザイナーとして活動していきたい、という場合は、デザインソフトの勉強が不可欠になります。adobeのPhotoshop、illustratorなどがそれにあたります。
例えば「バナー」を作成する場合、どちらかのソフトが使えれば作成することは可能でしょう。ただどちらを学べばよいのか、という質問に対しては、私は2つとも使えるようになっていたほうがよいと思います。
それぞれにできること、出来ないこと、得意なこと不得意なことがあります。
具体的に言うと、Photoshopは、その名前からもわかるように、写真を加工することが得意です。カラーの写真をモノクロにしたり、セピア色にしたり、一部背景を消したり。
またillustratorはその名からもわかる通り、イラストを描くのに適しています。実際にお絵描きするようなペンで絵を描く、というのとは少し違うかもしれませんが(実際ペンを使ってイラストを描くこともできると思いますが、私の場合はそのような使い方はしていません。)四角形や三角形、丸などの図形を使用して様々なイラストを作成することができます。

なので、それぞれ使えたほうが良いに越したことはありません。ただし、両方ともすごく奥が深く、すべての機能を知る、使いこなす必要はありません。
基本的な操作、webデザインに必要な操作を覚えて入れば十分でしょう。

これらのソフトの勉強の仕方としては、Youtubeなどで先輩webデザイナーのかたが無料で教えてくださっていたりするので、そちらを参考にするか、私の場合はオンラインのスクールを使用して、勉強させていただきました。
スクールは、もちろんお金はかかるのですが、その後技術を身につければ比較的すぐに元がとれるかな、と思うので、無駄ではないです。ただし、決して安い金額ではないので、どんなことを教えてくれるのか、きちんと調べてから入会することをお勧めします。

③webデザイナーとして活動していきたい

webデザイナーとして活動していきたい
webデザイナーとして活動した、つまり、自分でホームページを0から完成まで作り上げていきたい、という場合です。
この場合は①のhtml&cssの勉強や、②のデザインソフトの勉強、さらに踏み込んでjQueryやPHP、CMS(WordPressなど)についての勉強も必要になってきます。
最終的にwebデザイナーとして活動したい!という場合も、①または②、順番はどちらでもよいですが、一つ一つ積み上げていくのが一番よいと思います。
最初から全て勉強しよう!と思うと、心が折れます。決して回り道になることはありませんので、一つ一つ身につけていきましょう。