初心者必見!web制作に必要なスキルについて

「プログラミングは稼げるっていうけど何を勉強していいかわからない」

「HTMLとCSSは少し触れたけど次に何を勉強したほうがいいのかな…」

「早く案件を獲得したい!!」

 

そんな方々に向けての記事になります。

昨今の副業ブームでよく聞くプログラミングですが、特に、「web制作が稼げる」といったお話をよく聞くと思います。

この記事を読んでいる皆さんの中にはこの情報をもとに本記事にたどり着いた方もいるのではないでしょうか?

「web制作は稼げる」

この言葉は本当なのか?と疑っている方もいると思いますが、結論から言うとしっかりとしたスキルを持てば結構稼げます

 

でも「稼げる稼げるっていうけど具体的に何をすればいいの?」と悩んでいる方も多いのではないでしょうか。

この記事を読まれている方はweb制作を志している方や独学でスキルを身につけたい!と思われている方が多いと思います。

ですので本記事ではweb制作を独学で1年間で勉強してきた僕が案件までに必要なスキルを4つ紹介します。

web制作で案件をとるのに必要なスキル、それは以下の4つになります。

  1. HTML
  2. CSS
  3. Javascript(JQuery)
  4. PHP

急に文字の羅列を4つ聞いてもよくわからないですよね(笑)。

なので、以下ではそれぞれのスキルの説明と習得までの時間・難易度を紹介します。

 

HTML

(説明)

htmlはマークアップ言語といい、正確にはプログラミング言語ではなく、ほかの言語と比べるととっつきやすいと思います。ほかの言語であたりまえのように使う「</>」やフォームなどについて1から説明してくれる教材が多いので、この言語を先に習得することでほかの言語に進む際の障壁が下がると思います。

この言語はwebサイトのレイアウトを考える際のひな型となります(人体でいうところに骨組みに当たります)。

 

難易度 2.0
かかる時間 2.0

 

 

CSS

(説明)

CSSも厳密にはプログラミング言語ではありませんがhtmlとほぼ同時に学ぶ教材が多いです。イメージとしては、骨に肉付けをする役割になります。主にhtmlで作成したwebサイトに色彩を与える役割を果たしています。

文字の色や位置、大きさなどの設定や背景画像の設定、カラムの変更などがこの言語によって決められます。css自体の基本操作の難易度は決して高くありませんが、センスによるデザインの差が出やすく、自由度も高いのでここでは難易度が高いものとしました(ちなみに僕自身はセンスがなく、とても苦労しています💦)。

 

難易度 4.0
かかる時間 2.0

Javascript

(特徴)

Javascriptは上記の二つと違い、れっきとしたプログラミング言語となります。この言語は「○○と10回表示しろ!!」という命令を出せば、自動的に命令に沿った表示をします。また、「動的なwebサイト」をつくるうえでも必要不可欠な言語です。

html/cssの2つでもwebサイトの作成は可能ですが、現在使用されているwebサイトのほとんどはJavascrptが使用されているので、この言語の習得は必須となります。

※実際に必要なのはJavascriptをもとにつくられたJQueryであり、JQueryが使えれば差し支えないです。しかし、ルーツはJavascriptなので、両方の習得をするのがベストだと思います。

 

難易度 3.0
かかる時間 2.5

 

 

PHP

(特徴)

Javascriptと同じく「動的なwebサイト」の構築に欠かせない言語です。この言語は、ほかの3つのようにがっつり学ぶのではなく、基本文法を理解するだけでオッケーです。理由としてはWeb制作ではwordPressの案件が多いですが、このwordPressはPHPで書かれているためです。

また、PHPにて記述する内容がそこまで多くないため、ルールを理解するだけで大体の案件は十分だからです。このがっつりというのは、「Progate」の初級編レベルが分かれば十分だと思います。

難易度 1.0
かかる時間 1.0

 

 

まとめ

以上の4つがWeb制作に必要なスキルです。いかがでしたか?

もう一度まとめると

Web制作では、HTML,CSS,Javascript,PHPの4つのスキルを身につけよう!!

ということになります。

こんなにやること多いのかよ、と思った方が多いと思いますが、大切なのは理解しこんなことができるんだ、と引き出しを増やすことです。コピペもカンニングもオッケーなので暗記しなきゃ…といった焦りは不要です。

ぜひ楽しんでいきましょう!!

まずは、progateの無料バージョンで、「こういうことができるのか…」といったイメージをつかむことが大切です。

ただし、各言語は最高でも3周まででとどめておいてください。

プログラミングは見ているだけではできるようにならないので、なんとなくわかった程度で次のステップへ進みましょう!!

具体的には、テキストエディターのインストールをしましょう。「テキストエディター インストール」・「テキストエディター おすすめ」などで検索すれば必要な情報は手に入ります(ちなみに僕はvscodeを使ってます)。