HTMLとは？を知る（意外と知らなかったHTMLが必要な理由）

｜ 10236 PV ｜ 2019.01.22

favorite_border

こんにちは。スキルハブの吉田です。
さて、今日は基本中の基本「HTMLとは？」について書きたいと思います。なんでHTMLなんていう言語で書かなければいけないのだろう？というところを懇切丁寧に解説します。それでは始めましょう！

今日の内容

HTMLとは何か？
基本的なツールの紹介
Demoを見ながら概要をつかむ
実際に書いてみる　
まずは無料の14講座から受講してみましょう。わかりやすくて目からウロコですよ。
» 今すぐ無料講座をチェックする

HTMLとは何か

HTMLとは、文章に意味付けをするための言語です。
THE BEATLESを紹介するページがあったとすると、人間は見た目で文章の構造を理解します。例えば「色が赤だから強調されているんだな」「文字が大きいから重要なんだな」などという感じです。

例えば以下のような図は人間にはわかりますよね。「あ、これはビートルズに関するページなんだな、デビューまでの道のりなんかも書いてありそうだ」とその見た目から理解することができます。

しかしロボットの場合は色や大きさなどで表現しても、どこが重要なのかや、どこを目立たせたい部分なのかを理解できません。人間とは違って見た目では判断できないのですね。

インターネットの世界では、ロボットが適切に情報を判断して、それを正確に処理させる必要があります。例えばGoogleなどはロボットを使って情報を収集して、機会的にその情報を処理します。Googleで自分の作ったページが表示されるようにするには、Googleロボットがわかりやすい言葉で書く必要があります。

ようするにロボットの分かりやすい様な言葉で書かなければいけないというわけですね。そこでどうするかというと…HTMLという言語でマークアップするのです。

上の図でもわかるように大見出しの部分には<h1></h1>というマークアップ（タグ付け）をすることで「ここは大見出しだよ」ということを表しています。
このような書き方をすると、ロボットでも理解できるというわけです。<h2></h2>は中見出し、<h3></h3>は小見出しという意味になっています。この様に文章をHTMLタグで囲んであげると、ロボットも理解して自動的に処理できるようになります。

###HTMLとは機械でも判断できるように文書をマークアップするためのもの # 機械が自動処理できるようにするためにHTMLはある # Googleのような検索エンジンは内容をタグで理解する # タグに気をつけてかかないと適切な検索結果として反映されない # HTMLは見た目を整えるための言語ではなく「意味付け」のための言語

基本的なツールの紹介

HTMLを書く為には文字を書くツールが必要になってきます。
文字が書けるテキストエディタなら何でもいいです、Windowsであればメモ帳でもかまいませんが、HTMLを書いた時に色分けがされなかったりしてあまり適していません。
なので、Windowsならサクラエディタ・MacならMiというソフトが無料であるのでそちらをダウンロードするのもいいかとおもいます。
おすすめはSublime Text 2というエディタで、こちらは英語になってしまうのですがフリーで高機能になっていて、HTMLだけでなくプログラミングでも使えます。高機能なのに動作が軽いというところもおすすめです。
※この講座でもSublime Text 2をつかっていきます。