【HTML/CSSとは】HTMLとCSSの資格や単価相場、将来性などが分かるHTML/CSS入門書

初心者

今回はWebサービスやWebサイトなどの開発には欠かせないHTMLとCSSについて、それぞれの特徴やおすすめの資格、勉強方法、HTML/CSS案件の単価相場や将来性などを初心者向けに解説していきます。

  • HTML/CSSとは何か?
  • HTML/CSSのおすすめの資格は?
  • HTML/CSS案件はどれくらい稼げるのか?
  • HTML/CSSの将来性は?

などの疑問に応えられるようデータを交えて解説していきますので、ぜひ参考にしてください。

HTMLとは

HTMLとは、Hyper Text Markup Languageの略でWebサイトを作成するためのマークアップ言語です。

HTML以外にもマークアップ言語としてXMLなどがありますが、HTMLが最も一般的でほとんどのWebサイトに使用されている言語です。

要はWebサイトの見出しや段落などの文書の構造を形成するための言語です。

実際どのように使われているかと言うとWebサイトを開いた状態で「Ctrlキー+U」で確認することが出来ます。このソースコード(英語等で並んでいる文字列)がHTMLの正体です。

このソースコードを読み込ませてよく見るようなWebサイトへと変換しています。

頻繁に出てくる<>で記載されているタグによって、見出しや段落、リンクなどを設定しています。HTMLは非常に身近に存在しており確認しやすいので、ソースコードと実際のWebサイトを見比べて勉強することも出来ます。

またファンクションキーの「F12」を押して「デベロッパーツール」を活用すれば実際にHTMLのコード編集をすることも出来ますので、練習もしやすい環境があります。

タグ例

  • <p>:段落
  • <a>:リンクの作成
  • <img>:画像の表示
  • <h1>:見出し(h2,h3…)
  • <ul>/<li>:リスト

などがあります。

その他にもたくさんありますので、気になる方は実際に学んでみてください。

CSSとは

CSSとは、Cascading Style Sheetsの略でスタイルシート呼ばれ、Webサイトの文字のスタイルを指定するための言語です。

基本的にはHTMLと一緒に使用され、HTMLが文章構造を形成するのに対し、CSSでは配置や配色などを指定し、見栄えの良いWebサイトへとすることが出来ます。

たまにページの読み込みが遅い時、文字列のみが表示されることを経験したことがある方もいるかもしれません。その後ページがきちんと読み込まれると見栄えの整ったWebサイトが表示されることがあります。
この後者がCSSが反映されたWebサイトであるということです。つまりWebサイト作成においてCSSも欠かせない言語なのです。

CSSでは具体的に下記のようなことが出来ます。

  • フォントのサイズや色の変更
  • 枠の作成
  • 下線の設置や種類等の変更
  • ボタンの設置

その他にもCSSで様々なことが出来ます。またJavaScriptと組み合わせることで、動きのあるWebサイトを作成することが出来るようになります。

HTML同様、ファンクションキーの「F12」を押して「デベロッパーツール」を活用すれば、実際にフォントの色やサイズの変更などを試してみることが出来ます。

必ずHTMLと一緒に使われるスキルですので、HTMLとCSSをセットで学んでいくようにしましょう。

HTMLとCSSエンジニアにおすすめの資格

HTML/CSSを扱うエンジニアは、Webサイトの作成に関わる開発がメインになりますので、資格で言うとWebクリエイターやWebデザイナーに関わる資格を取得するのが望ましいでしょう。

HTML/CSSを扱うエンジニアにおすすめの資格はこの3つです。

  • HTML5プロフェッショナル認定試験
  • Webデザイン試験(資格名:Webデザイナー)
  • ウェブデザイン技能検定

HTML5プロフェッショナル認定試験

HTML5プロフェッショナル認定試験は、HTMLはもちろんCSSやJavaScriptなどのマークアップに関する知識やスキルが必要な試験です。

階級は2つに分かれています。

  • レベル1:HTML5プロフェッショナル認定試験 レベル1
  • レベル2:HTML5プロフェッショナル認定試験 レベル2

レベル1では、HTMLとCSSを使ってのWebサイトのデザインや制作が出来るレベルの方向けの試験で、レベル2は、それに加えJavaScriptや最新のマークアップ技術を必要とする試験です。

どちらも受験資格自体は特にありませんが、レベル2の認定を得るためには、レベル1とレベル2の両方に合格する必要があります。

HTMLとCSSを主に扱うのであればまずレベル1の試験を受けて資格を取得することをおすすめします。ただいづれ活躍の場を広げていくのであればJavaScriptなどのスキルは必要になってきますので、ゆくゆくはJavaScriptの習得及びレベル2の資格取得に向けて動いていくのが良いかもしれません。

それぞれの受験料は15,000円(税別)と人によっては高く感じるかもしれませんが、Webデザイン側の開発をしていきたい方にはかなりおすすめの資格であり、勉強をサポートしてくれるためのイベントやセミナーなどもありモチベーション高く取り組みことが出来ます。


Webデザイン試験(資格名:Webデザイナー)

Webデザイン試験は、その名の通りWebサイトのデザインに関わる試験で、HTMLやCSSなどの基本的な知識や実装技術を計るための試験です。

この試験に合格すればWebデザイナーという資格をもらうことが出来ます。

今後Webサイトの構築やWebデザイナーを目指す人にはおすすめの資格でしょう。

Webデザイン試験の合格率は公表されており、累計で66.1%、2019年度は88.2%と非常に高いです。

受験資格は特になく、誰でも受けることが出来、受験料は10,000円(税抜)となっています。


ウェブデザイン技能検定

ウェブデザイン技能検定は、Webデザイン関連の資格の中で唯一の国家資格となります。

WebデザインやHTML/CSSのコーティング技術はもちろん、Web全体に関わる幅広い知識が必要となる試験です。

階級は大きく3つに分かれており、それぞれに学科試験と実技試験があります。

  • 3級:学科/実技
  • 2級:学科/実技
  • 1級:学科/実技

3級の試験に関しては、特に受験資格は必要なく誰でも受けることが出来ます。※原則としてWeb関連の作成や運営の業務に従事もしくは従事しようとしている方

2級に関しては、3級に合格している必要があり、その他にも2年以上の実務経験など様々な受験資格が必要となります。

さらに1級になると学科試験の受験資格は、2級に合格かつその後2年以上の実務経験や7年以上の実務経験などが多くの条件が必要になります。また1級の実技試験を受験するためには、1級の学科試験の合格が条件となっています。

2級と3級に関しては、同日内に学科と実技の両方の試験が開催されており、同時に受けることが出来ますが、1級に関しては、受験資格からも分かるように別々の日程で組まれています。

料金体系は年齢によって変動があり、下記のようになっています。(非課税)

  • 3級・・・学科:5,000円 / 実技:5,000円 (35歳以上)または3,000円(35歳未満)
  • 2級・・・学科:6,000円 /実技:12,500円(35歳以上)または7,000円(35歳未満)
  • 1級・・・学科:7,000円 / 実技:25,000円 (実技はペーパー実技含む)

合格率は累計(2019年度時点)で、約53%程となっております。
唯一の国家資格ですので、興味のある方はぜひチャレンジしてみてください。


HTMLとCSSの勉強方法

HTMLとCSSはWebサイトの作成・コーティングに関わる案件が殆どです。

まずはこれらの技術を確立させ、その後デザインスキルを加えてWebデザイナー側に携わるのかそれともJavaScriptを習得してフロントエンドエンジニアを目指すのか決めていくのが良いでしょう。

HTMLとCSSの勉強方法としては大きく2つです。

  • 書籍
  • プログラミングスクール

書籍でHTMLとCSSを学ぶ

まずHTMLとCSSを学ぶのであれば、初心者向けの書籍を見ていくことから始まるでしょう。そして資格の取得も目指すのであれば、それぞれの資格の参考書も一緒に購入し勉強していくのがおすすめです。

またHTMLやCSSの場合、実際にWebサイト上からソースコードなどを見ることが出来ますので、あらかじめどういったものなのか見ておく方が良いかもしれません。

さらにHTMLとCSSだけでは単価を上げていくためには難しいため、今後どのポジションに携わりたいかを明確にし、それに向けたスキルの習得も頭に入れておく必要があります。ですので、それらも含めた書籍の購入や勉強を検討しておくことをおすすめします。

おすすめの参考書



プログラミングスクールでHTMLとCSSを学ぶ

書籍での勉強に抵抗があるのであれば、プログラミングスクールでHTMLとCSSを学ぶのが良いでしょう。

Webデザインスクールを見つけられればHTMLやCSSを教えてくれるでしょう。また折角であれば将来的なことも考えて、デザイン側のスキルもしくはJavaScriptなどのスキルが学べるのかどうかも把握しておくことをおすすめします。

おすすめのプログラミングスクール

HTML案件の単価相場

HTML案件の単価相場は60万円台で、次いで70万円台となっています。

一見このグラフでは、HTMLの単価相場は高そうに見えますが、正直HTMLのみを扱う案件というものは無いと思ってください。

あるとするのであれば、クラウドソーシング系のサイトに掲載されているような単発の案件でしょう。

今回の相場は基本的には週5で働くような案件の単価相場ですので、HTMLとプラスのスキルセットがある場合の単価相場グラフになります。

ただHTMLを習得しそれ以外にもスキルを習得すれば、60万円以上の単価を目指せるというのは事実ですので参考程度に見てもらえればと思います

CSS案件の単価相場

CSS案件の単価相場は60万円台で、次いで70万円台となっています。

こちらもHTML同様、CSSのみを扱うような案件はほとんど無く、このグラフの単価相場を目指すには、週5でCSSとプラスのスキルセットがある場合に限ります。

CSS単体では単価相場である60万円台を目指すのは、難しいですがCSSを含めて別のスキルがあれば目指せるということになります。

HTMLとCSS案件の単価相場を見ての考察

2つのグラフを見て分かるのは、どちらも似た形のグラフをしているという点です。

またHTMLとCSSを必要とする案件には、JavaScriptも必要となるケースが一般的で、JavaScript案件の単価相場のグラフも一緒に見てみると3つとも似たような形になっています。

つまりHTMLとCSS、JavaScriptの3つのスキルを持って、それぞれの単価相場である60~70万円台を目指せるということになります。

もう少し3つのグラフを詳しく見てみると、40万円台と80万円台のグラフで2つに分けることが出来ます。

HTMLとCSSの場合は、80万円台より40万円台の方が案件数が多いです。反対にJavaScriptになると40万円台と80万円台の差は殆どありません。

つまりJavaScriptを必要としない、HTMLとCSSの案件であれば40万円台が相場になるのではないかと予測することが出来ます。

HTMLとCSSを習得して実績を積んでいきたいエンジニアは、まずは40万円台という単価相場を目安に探してみるのが良いでしょう。

そしてより単価を高めていきたい場合は、JavaScriptの習得をおすすめします。

JavaScript案件の単価相場と平均単価
https://freelance-attack.work/column/javascript-marketprice/

HTML/CSSエンジニアが単価を上げるためには?

前述で説明した通りHTML/CSSエンジニアが、単価を上げていくためにはJavaScriptの習得が一つ挙げられます。

実際に上記のグラフからも分かりますし、多くのサイトで掲載されている案件を見れば明確です。

ただその他にもHTML/CSSエンジニアが単価を上げる方法はあります。

Webデザイン側の知見

一つは、Webデザイン側の知見やスキルを身に着けることです。

HTMLとCSSはWebサイトの構築をするための言語ですが、Webサイトを立ち上げる上で写真や画像などといったパーツも必要になってきます。

そのためそれらを一貫して行う事が出来れば、より需要は高まるでしょう。

またUI/UXデザインは、Webサイトやサービスを運営していく上では非常に重要な点です。これらの知見があればより良いでしょう。

SEOに関する知見

もう一つは、SEOの知見です。

SEOには様々な施策がありますが、HTMLやCSSに関わるような施策も多くあります。

そのためSEOの知見があり、それを提案し自ら実行・構築することが出来ればHTML/CSSエンジニアとしての価値は高まります。

多くの案件を受注

LPの作成依頼であったり、簡単なHPの作成であったりと、HTMLとCSSのみを扱うような単発の案件はあります。

一つ一つの単価だけを見ると高額とは言えませんが、数万単位~の案件は多くあります。
それらを数多く受注することで、相場である40万円以上を目指す事は可能ではあります。

ただ数多く受注する場合、自身の開発スピードに左右されますし、納期が重なりスケジュールがパンパンになったりとリスクも伴います。

実績を積むという点では良いかもしれませんが、いつまでも数をこなすだけではモチベーションが下がってくる可能性がありますので、スキルを広げていく方がおすすめではあります。

最後に

HTMLとCSSはWebサイトの作成には欠かせない言語です。

そのため仮に別のポジションを目指す事になったとしても損はしないスキルと言えるでしょう。

さらにこれらのスキルに加え+αで習得していくことで、活躍できる場や自身の価値を一気に高めていく事が出来ます。

HTMLとCSS案件の単価相場は共に60万円台ではありましたが、JavaScriptなどと言った別のスキルが必要になることは頭に入れておきましょう。

ただそれらを必要とする案件は豊富にあり、Webサイトの構築には必須のスキルですので、着実に実績とスキルを積み上げていけば需要の高いエンジニアを目指せるでしょう。

また単発で出来る案件も多いので、メインがエンジニアやデザイナーではなくとも副業としても活かせる言語ではあります。

自身がどのポジションを目指したいかを定めておき、スキルの拡張に繋げていく事をおすすめします。

興味のある方はぜひ学んでみてはいかがでしょうか。

HTMLとCSS案件の単価相場
https://freelance-attack.work/column/html-css-marketprice/