HTML文書の構造

概要

HTMLは文書の内容と構造を記述するための言語です。 HTMLの構造は重要な意味をもつため、構造について理解します。

• 文書の構造
• 構造とデザイン
• 現代のHTML
• HTMLの歴史

文書の構造

Webページに限らず文書には構造があります。 小説にも章や段落といった構造がありますし、新聞にもなんとか欄や見出しといった構造があります。

例えばWikipediaのHTMLの項は次のような見出し構造を持っています。

   1 特徴
   2 HTML文書
       2.1 HTMLタグ
   3 歴史
       3.1 HTML 1.0、HTML+
       3.2 HTML 2.0
       3.3 HTML 3.0、HTML 3.2
       3.4 HTML 4.0、HTML 4.01
       3.5 ISO/IEC 15445:2000
       3.6 HTML5、HTML 5.1
       3.7 HTML Living Standard
   4 HTML形式の電子メール
   5 脚注
   6 関連項目
   7 外部リンク

Webページ全体でみるとこれ以外にもヘッダやサイドバー、フッタといった構造があることがわかります。

現代のHTML

最近のWebページは以前とくらべてHTML文書の構造が重要視されています。 意味のある単位で仕様に沿って構造化されている必要があります。

なぜ最近になって重要視されているかというと、Webページをただ人間が閲覧するだけでなくコンピュータで自動的に処理することが多くなっているからです。 コンピュータは曖昧な文書を理解することはできないので、厳密に仕様に沿って文書が書かれている必要があります。 そのときにしっかりと構造化されていると、コンピュータはさらに詳細に文書の意味を知ることができます。

例えばGoogleの検索エンジンも文書の構造を考えてランキングしています。 そのため、HTML文書をしっかりと構造化することはSEOにもつながります。

構造とデザイン

以前はHTMLの構造がそこまで重要視されていなかったので、HTMLタグを使ってデザインするということが普通に行われていました。 例えばtable要素でページ全体のレイアウトがされていたりです。 これは本来のtable要素の使い方ではありません。 コンピュータはtableと理解しますが、それは間違って理解しているということになります。

このような背景から新しい規格のHTML5では、HTMLでは文書の内容と構造だけを記述することになっています。 デザインはHTMLではなくCSSで定義していくことになります。