HTMLは木構造(入子構造)のマークアップ言語であり、形式言語である。「プレーンテキストの文書を要素で括って意味付け」という一般的な説明[3]は間違いである。「『タグ』と『タグ』で括られたもの全体」が「要素」(element)であり、タグすなわち要素ではない。マークアップ言語としての特徴は、先祖であるSGMLや、兄弟のXMLと共通しているため、以下ではWWWというシステムにおける「ハイパーテキスト記述言語」としての側面についてのみ記述する。
HTMLの要素には、文書を表現するものとしてごく一般的なものである見出し(ヘッドライン、h1〜)、段落(パラグラフ、p)、ハイパーテキストとして特徴的な「アンカー」(a)に関係するもの、画像など(imgなど)の電子メディア的なもの、などがある。また文字色の指定などといった、意味ではなく直接見た目のみを指定するようなものは、近年ではスタイルシートなどに分離するべきとされているが、歴史的事情、及び、スタイルシートよりもこの、HTMLでの記述が簡便になる場合が度々あること[注釈 1]から現在でもしばしば使われている。その他主要な要素は、HTMLの要素の記事で解説している。
形式言語として見た場合「構文規則」(あるいは文法)に相当する「スキーマ」は、HTML4まではDTDとして公開され要素ごとに記載することの出来る属性、内容に含むことの出来る要素などが定められていた。HTML 4.01では厳密なもの[注釈 2]、HTML 3.2からの移行過渡期のためのもの[注釈 3]、フレームを用いた文書のためのもの[注釈 4]といった3つのDTDが定義されていた。
HTML 3.2では見た目を左右する要素や属性が追加されたがHTMLは本来文書構造を示すためだけにその存在意義があり、それらの要素は目的に反するものとされた。そのため視覚的・感覚的効果を定義する手段としてスタイルシート(一般にはその中のCSS)が考案された。見た目を左右する要素や属性の一部はHTML4以降では非推奨とされており、HTML 4.01 Strictでは定義されていないので使用できない。ただしHTML 4.01 Strictで定義され、非推奨とされない要素や属性の一部にも見た目を左右するものがある。装飾的な視覚表現のためにそれらの要素や属性を用いているのであればその内容に適する要素を用いた上で、スタイルシートで表現を指定するのが望ましい。
HTMLで書かれた文書をHTML文書と言い、HTMLでは、まず文書型宣言を書く。文書型宣言が無いものは、HTMLの規格に従っているとはいえない。HTML5以降の規格における文書型宣言は以下のようなものである。
次にHTML文書の例を挙げる。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<link rel="author" href="mailto:mail@example.com">
<title lang="en">HyperText Markup Language - Wikipedia</title>
</head>
<body>
<article>
<h1 lang="en">HyperText Markup Language</h1>
<p>HTMLは、<a href="http://ja.wikipedia.org/wiki/SGML">SGML</a>
アプリケーションの一つで、ハイパーテキストを利用してワールド
ワイドウェブ上で情報を発信するために作られ、
ワールドワイドウェブの<strong>基幹的役割</strong>をなしている。
情報を発信するための文書構造を定義するために使われ、
ある程度機械が理解可能な言語で、
写真の埋め込みや、フォームの作成、
ハイパーテキストによるHTML間の連携が可能である。</p>
</article>
</body>
</html>
このHTML文書は次のような構造を示している。
<!DOCTYPE html>
:文書型宣言
このテキストが最新のHTMLであることを示す。
<html lang="ja">
:html要素。また、lang="ja"
で、言語コードjaの言語が使われていることの明示。
<head>
:head要素(この文書のヘッダ情報の明示)
<meta ... />
:meta要素(文書のメタ情報)。ここでは、charset="UTF-8"
で、文字コードが、「UTF-8」であることを示す。
<link ... />
要素(他のリソースとの関連を明示。この場合、作者の明示)
<title lang="en">
:title要素(この文書のタイトル)の明示。また、この部分はenの言語が使われていることの明示。
<body>
:body要素(この文書の内容の明示)
<article>
:article要素(この要素が、記事であることを明示)
<h1 lang="en">
:h1要素(第一レベル)の見出しを明示。また、lang="en">
で、この部分の見出しは enの言語が使われていることを明示。
<p>
:p(段落)要素の明示。
<a href="http://ja.wikipedia.org/wiki/SGML/">SGML</a>
:a(アンカー)要素(他のリソースへのアンカー)であることの明示。href
で、「""
」内にリンク先のURLを記述する