こんにちは、しゅうです。
この記事では、最短で稼げるようになるためのWEBサイト制作の学習方法について解説していきます。
これから学習を始める方、すでに始めているけど思うように進まない方向けに丁寧に解説していきますので、
ぜひ最後まで読んでみてください。
稼ぐための最低スキルを知っておこう
副業でもフリーランスとしてでも、WEBサイト制作で稼ぎたいと考えているのであれば、
稼ぐためのスキル感は先に知っておきましょう。
結論ですが、HTML&CSSだけ書けるだけでも仕事はあるので稼げます。
↓のように、HTML&CSSだけのコーディング依頼もあります。
これなら学習初めて3ヶ月目からとかでも全然狙えます。
実際にどんな案件があるかは、クラウドワークスなどのクラウドソーシングサイトで見れるので、
気になる方は登録して覗いてみてください。
その上で、下記のスキルを身につけていくと収益や単価も上がっていくので、最終的な学習のゴールとして見据えておきましょう。
- HTML&CSS
- jQuery
- WordPress
今回の記事では、上記3つのスキルを身につけていくための具体的な学習方法を解説していきます。
先に失敗しがちの学習方法を知っておきましょう
学習を始める前に、失敗しがちな学習方法を教えておきます。
それは「インプットに時間をかけて、全て完璧に覚えようとすること」です。
これは多くの方がやりがちだと思うのですが、本当にもったいないので覚えておいてください。
WEBサイト制作の学習では完璧な暗記を目指すよりも、
「こんなこともできるんだ」という概要レベルだけだけしっかり理解できれば、
実際に仕事を受けたときにも「こんなこともできたはず」とググって対応できます。
正直、僕も全てのコードを覚えているわけではないです。必要なものをググって見つけてきて書くことがほとんど。全部覚えることは多分無理ですし、大体はググれば出るので大丈夫です。
優秀なコーダーさんでも、同じようにググって対応することがほとんどなのでこれは理解しておいてください。
学習と聞くと教材を読んでしっかり理解することのように感じますが、
WEBサイト制作では「作る→分からないところに出会う→ググる→対処する」
この流れの中で圧倒的に成長できるので、基礎の学習はほどほどに。
- 内容が理解できればどんどん進む
- 同じ教材を何周もやらない
- 教材は軽く流し見、あとは実際に作ってみる
WEBサイト制作学習ロードマップ
WEBサイト制作の学習方法について、具体的に解説していきます。
学習のステップとしては、以下の通り。
【STEP1】HTML&CSSを書けるようになる
【STEP2】jQueryに触れてみよう
【STEP3】WordPressまでできれば十分
それぞれ詳しく解説します。
【STEP1】HTML&CSSを書けるようになる
WEBサイトの制作を行うには、HTML&CSSの理解は必要不可欠です。
とはいえ全て覚える必要はないので、「どんなことができるのか」を理解していきましょう。
HTML&CSSは下記の流れで学習を進めるのがおすすめです。
①HTML&CSSの基礎理解
②デザインからサイトをコーディングしてみる
学習の流れ
WEBサイト制作の基礎となるHTML&CSSの基礎を身につけるには、ProgateというサイトのHTML&CSSコースがおすすめです。
Progateはプログラミング学習サイトで、イラストも用いて基礎からわかりやすく解説してくれます。
無料で学べるところもありますが、一部有料で1ヶ月1000円程度。
学習終わったら解約すればいいので、サクッと学習してしまいましょう。
Progate – HTML&CSSコース
基礎理解ができれば、サイトをコーディングできるステップまで来ています。
次はデザインからのコーディングに挑戦してみましょう。
「デザインカンプ 無料」とかで検索すれば、練習用のデザインを無料で配布してくれているサイトもあるので、利用してみると良いかもしれません。（作ってみたいサイトがあれば、そちらでOK）
おそらく最初は分からないことがたくさん出てきますが、そこで「ググる→できるようになる」の過程が重要です。 スラスラと書けないのが当たり前ですので、まずは1サイト描き切ることを目標に頑張ってみて下さい！
【STEP2】jQueryに触れてみよう
次にjQueryです。
HTML&CSSだけでもサイトの構築はできますが、実務になるとjQueryまで使用することが結構多いです。
jQueryはサイトに動きをつけるのに使います。
よくいろんなサイトで見るメニューボタンのハンバーガーやトップページのスライダー、ロード画面とかもこのjQueryで実装できます。
javaScriptという言語で書かれていて、これをWEBサイト制作に特化させたものと思ってください。
jQueryは実務でも0から書くシーンはあまりなく、既にできてるコードをググって見つけてきてカスタマイズすることができれば十分です。
なので学習の目標としては、読んで何してるかがざっくり理解できるくらいを目指しましょう。
具体的には下記の2ステップです。
①javaScriptとjQueryの基礎理解
②よく見るパーツの実装
学習の流れ
こちらも基礎知識はサラッとProgateで学習しましょう。
やっておくべきは下記の2つ。
Progate – javaScriptコース
Progate – jQueryコース
基礎理解ができたら、実際にパーツを使って動かしてみます。
以下の書籍が実務でもよく使用するパーツを多く紹介してくれているため、初心者の方にもおすすめです。
まずはこれらの書籍を用いるなどして、紹介されているパーツを自分で作ったサイトにそのまま埋め込んでみましょう。
そこから少しコードを追って内容を理解できる、カスタマイズできるところまでいけばjQueryの学習としては十分実務でも使えるレベルといえます。
【STEP3】WordPressまでできれば十分
最近はWordPressでホームページを作成している企業さんも多く、WordPressまで扱えるようになると受けられる案件の幅がかなり広がります
これからWEBサイト制作の学習を進めるという方も、ぜひWordPressまで学習してみてください。
学習の流れとしては下記の2ステップです。
①PHPの基礎理解
②WordPressの仕組みを学ぶ
学習の流れ
WordPressはPHPという言語を利用して作られている仕組みです。
そのため、PHPの基礎知識を身につけておくことで今後の理解がスムーズに進みます。
お馴染みのProgateを利用して基礎知識を身につけましょう。
Progate – PHPコース
基礎が理解できたら、実際にWordPressを利用してサイトを作成してみましょう。
下記の書籍が個人的にはWordPress初心者におすすめです。
書籍の内容に沿って進めていくことで、最終的にサイトが1つ完成するようになっているため何から手をつけて何をやれば良いのかが迷子にならず進めていくことができます。
ポチップ
運用まで理解するなら自分でWordPressサイトを運用してみるのがおすすめです。
僕は当サイトのようにブログも書いていますが、その際にはこのWordPressを利用しています。
実際自分で使ってみることで、WordPressでどんなことができるのかをより理解できています。
まとめ
記事の大事なところをまとめておきます。
- 稼ぐための最低限のスキルを知る
→HTML&CSSが書ければ仕事はあります。
- 失敗しがちな学習方法
「インプットに時間をかけて、全て完璧に覚えようとする」こと
→概要レベルで理解していればOK。とにかくどんどん進めましょう！
- WEBサイト制作学習ロードマップ
- 【STEP1】HTML&CSSを理解する
- 【STEP2】jQueryに触れてみる
- 【STEP3】WordPressまでやれば十分
今回の内容でWEBサイト制作の学習ロードマップについては、イメージできたと思います。
まずは最速で稼ぐためのスキルを身につけることを目標に、HTML&CSSの学習から進めてみてください。
