HTMLとは

HTMLはウェブページの記述に使用する言語あり「Hyper Text Markup Language」の頭文字を取ってHTMLと名づけられました。

直訳すると「ハイパーテキストをマークアップする言語」で、これはHTMLの機能をそのまま表しています。ハイパーテキストとマークアップが分かればHTMLとは何かを理解できるので、順に見てみましょう。

ハイパーテキストとは

ハイパーテキストとは、複数のテキストを相互に関連付け（リンク）ができるテキストの事です。例えばウェブページのリンクを押せば、リンク先に飛ぶことができますよね。これは紙文書ではできないことで、テキストを超えたテキストということでハイパーテキストと名付けられました。

ハイパーテキストにおけるリンクをハイパーリンクといいます。 HTML文書はハイパーリンクによって、他のハイパーテキストへのリンクや画像・動画などの埋め込みなどを実現しています。例えば下のGoogleへのリンクテキストとGoogleのロゴ画像、どちらもハイパーリンクによって実現しています。

「画像もハイパーリンクなのか」と思うかもしれませんが、HTMLではアップロードした画像のURLを記述して表示しています。つまり画像はリンクによって表示しているのでハイパーリンクなのです。

今日のウェブは、ネットに繋げばクリック一つで世界中の文書を調べられます。インターネットが存在しなかった頃には想像し得なかったような、まさにハイパーなテキストと言う訳です。

マークアップとはテキストの部分がどのような役割なのか目印を付ける事です。ここは見出し、ここは段落、ここは赤文字、といった具合にテキストに目印を付ける事でテキストの役割を示します。

例えば履歴書は名前・住所・経歴といった具合に、その部分の役割が示されていますよね。丁度あんな感じでコンピュータに対してテキストの役割を示すのがマークアップです。

吾輩は猫であるの冒頭部を例に見てみましょう。

我輩は猫である
我輩は猫である。名前はまだない。

人間がこれを見れば「我輩は猫である」は題名で、以下は文章だと判断できます。しかしコンピュータにとっては文字の羅列でしかありません。

だからタグによってどこか見出しでどこが文章かを明示してやります。 HTMLでは「見出し」を<h1>～</h1>タグで、「文章」を<p>～</p>でマークアップします。

<h1>我輩は猫である</h1>
<p>我輩は猫である。名前はまだない。</p>

これがHTMLマークアップの基本的な流れです。色々な役割を示すタグがあるので、適切なタグで文章を囲えばHTML文書が完成します。

HTMLは「Hyper Text Markup Language」の略と冒頭で言いました。ここまで説明した内容で噛み砕いて言えば、「HTMLは通常のテキストをハイパーテキスト仕様に書き換えて、コンピュータに対してテキストの役割を示すための言語」という訳です。

HTMLは通常の文章をコンピュータに理解できるように「タグ」で役割を明記するのが役割です。タグは数百種類あって全て覚えるのは無理ですが、普段使うものはそう多くはないので順次覚えていきましょう。

HTMLの重要な特性として、環境を問わず利用出来る文書形式である事が挙げられます。ウェブサイトは特徴的で多様なレイアウトをしていますが、実はHTMLの構造は本質的に変わっていません。

レイアウトや表現はCSS(スタイルシート)という言語で表現し、レイアウトを変えたいときはCSSのみを変更します。 CSSを変更すれば見た目はまるで違うサイトに変わりますが、HTML文書は何も変わっていないのです。

ちなみにマークアップ言語はプログラム言語とは別物です。プログラム言語とは「順次・選択・繰返し」によってデータを処理するもので、マークアップ言語にそのような機能はありません。なのでHTMLマークアップをコーディングとは言いますが、プログラミングとは言わなかったりします。