IT用語集 2024/12/06

HTML、XML、XHTMLとは？ 10分でわかりやすく解説

コラム

UnsplashのGrowtikaが撮影した写真

HTML・XML・XHTMLは、いずれも「タグで情報を表す」点は共通していますが、目的がまったく異なります。HTMLはWebページを表示するための言語、XMLはデータの構造を厳密に表すための言語、XHTMLは「HTMLをXMLの厳格な書き方で運用する」ための規格です。この記事では、それぞれの役割と差分、そして実務で迷わない使い分けの判断軸を整理します。

HTMLの基礎知識

HTMLとは何か

HTMLは、HyperText Markup Language（ハイパーテキスト・マークアップ・ランゲージ）の略称で、Webページを作成しブラウザに表示するための標準的なマークアップ言語です。HTMLで「見出し」「段落」「画像」「リンク」などの構造（文書構造）を定義し、CSSで見た目を整え、JavaScriptで動きを加える、というのが一般的な役割分担です。

HTMLの基本構造

HTMLドキュメントは、基本的に以下の要素で構成されます（HTML5の場合は <!DOCTYPE html> が一般的です）。

DOCTYPE宣言：HTMLとして解釈してもらうための宣言（代表例：<!DOCTYPE html>）
html要素：文書全体の開始と終了を表す要素
head要素：メタデータ（タイトル、文字コード、検索/共有向け情報など）
body要素：ユーザーが閲覧する本文（見出し、段落、画像、表など）

実務では「まず構造をHTMLで正しく組み、見た目はCSSへ、挙動はJavaScriptへ」寄せるほど、保守性が上がりやすくなります。

HTMLの主要タグ

HTMLには多くの要素がありますが、頻出のものをいくつか紹介します。

タグ	説明
<p>	段落を表します。
<h1>～<h6>	見出しを表します。一般に数が小さいほど上位の見出しです。
<img>	画像を挿入します（代替テキストの `alt` が重要です）。
<a>	リンクを表します。
<ul>, <ol>, <li>	リストを表します。`<ul>`は箇条書き、`<ol>`は番号付き、`<li>`は項目です。

HTMLの属性について

HTML要素には属性を付与できます。属性は要素の追加情報を与えたり、挙動や意味付けを補ったりするために使用されます。

class：CSSやJavaScriptで要素をまとめて扱うための分類名
id：文書内で一意の識別子（同一ページ内に重複させないのが原則）
src：<img>などで参照先URLを指定
href：<a>などでリンク先URLを指定
alt：画像が表示できない場合の代替テキスト（アクセシビリティや意味理解に重要）

HTMLのポイントは「見た目」よりも「構造」です。人にも検索エンジンにも誤解されにくい構造を作ることが、最終的な品質に直結します。

XMLの概要と特徴

XMLとは何か

XMLは、eXtensible Markup Language（拡張可能なマークアップ言語）の略称で、データの構造と意味を表すためのマークアップ言語です。HTMLと同様にタグを使いますが、XMLは「表示」ではなく「データ表現」が主目的であり、タグ名を用途に合わせて自由に設計できる点が特徴です。

XMLの文書構造

XMLは「整形式（well-formed）」であることが基本要件です。つまり、タグの閉じ忘れや入れ子の崩れが許されません。代表的な構成要素は次の通りです。

XML宣言：XMLのバージョンと文字エンコーディング（省略される場合もあります）
ルート要素：最上位の要素（必ず1つ）
要素：開始タグと終了タグで囲まれるデータ単位
属性：要素の追加情報（使いすぎると可読性が落ちるため設計が重要）

さらに厳密さが必要な場合は、DTDやXML Schema（XSD）などで「許される構造」を定義し、バリデーション（検証）する運用もあります。

XMLの利点と活用例

XMLの利点は、データを階層構造として表現でき、ツールで処理しやすい点にあります。

データの構造化：階層構造でデータの意味を表しやすい
相互運用性：テキストベースで、多様な環境で扱える
変換・抽出が可能：XPath/XSLTなどの仕組みで抽出や変換がしやすい

活用例としては、次のような領域が挙げられます。

ドキュメントフォーマット：Office Open XML（例：.docx/.xlsx）など、内部でXMLを用いる形式
Webサービス（特にSOAP）：XMLを前提としたメッセージ交換
設定ファイル・定義ファイル：製品やフレームワークによってはXML形式が採用される
関連技術：SVG（ベクター画像）、MathML（数式表現）など、XML系の言語

なお、近年のWeb APIではJSONが主流ですが、「業務要件や既存資産、規格（例：SOAP）によってXMLが必要」なケースも依然としてあります。“どちらが上”ではなく、要件で選ぶのが現実的です。

XMLとHTMLの違い

XMLとHTMLは同じ“マークアップ”でも思想が異なります。

XML	HTML
データの構造・意味に重点を置く	Webページの構造と表示に重点を置く
タグ名を用途に合わせて設計できる	定義済みの要素を使い、ブラウザ表示を前提にする
整形式が必須（厳密な構文）	ある程度の崩れをブラウザが補正することがある

XMLは“データの器”、HTMLは“表示の器”と捉えると混同しにくくなります。

XHTMLについて理解する

XHTMLとは何か

XHTMLは、HTMLをXMLの文法規則（整形式）で記述できるようにしたマークアップ言語です。見た目の目的はHTMLと同じくWebページですが、書き方はXML準拠となり、タグの閉じ忘れや入れ子の誤りが許されません。

XHTMLの登場背景

XHTMLは、過去に「HTMLの解釈がブラウザによって揺れる」「文法が緩く、崩れたHTMLが量産されやすい」といった課題感から登場しました。また、XML系ツール（変換・検証・統合処理）と親和性が高く、厳密な文書処理を行いたい場面で注目された経緯があります。

ただし現代のWeb開発では、HTML5を中心にエコシステムが成熟しており、XHTMLは“主流”というより「必要がある場面で採用する選択肢」に位置づけられることが多いのが実情です。

XHTMLの文法ルール

XHTMLの代表的なルールは次の通りです。

タグ名は小文字で書く（規約として採用されることが多い）
要素の入れ子（ネスト）を正しく保つ
属性値は引用符（ダブルクォートなど）で囲む
空要素もXMLとして閉じる（例：<br />、<img ... />）
id属性は文書内で一意にする

この厳密さは品質管理に効きますが、少しの記述ミスがパースエラーにつながるため、運用では「生成・検証の仕組み（テンプレート、リンター、CI）」が重要になります。

XHTMLの利用メリットと注意点

XHTMLのメリットは、文書が整形式になり、機械処理しやすい点にあります。

構造が厳密になり、ルール違反が検出しやすい
XMLツール（XPath/XSLT等）による処理と相性がよい
テンプレートや自動生成と組み合わせると品質を担保しやすい

一方で注意点もあります。XHTMLは配信方式（MIMEタイプ）によってブラウザの扱いが変わることがあり、運用難度が上がる場合があります。また、現代のフロントエンドはHTML5を前提に設計されていることが多いため、「XHTMLが必須の要件があるか」を先に確認するのが安全です。

HTML・XML・XHTMLの使い分け

用途に応じた使い分け

使い分けは、目的を「表示」か「データ」かで切り分けると判断しやすくなります。

HTML：Webページとして表示する（UI、記事、管理画面など）
XML：データの構造化・交換・保存（規格や既存資産に合わせる必要がある場合に強い）
XHTML：HTML相当のコンテンツを“XMLとして厳密に扱いたい”場合（文書処理や検証を厳密に回したい等）

「WebページならまずHTML（現実的にはHTML5）」が基本で、XML/XHTMLは要件があるときに選ぶという整理が、実務では失敗しにくい結論になります。

ウェブ標準としての役割

HTML、XML、XHTMLはいずれもWebに関わる仕様として標準化され、相互運用性を高めてきました。重要なのは「標準に寄せるほど、特定環境への依存が減り、保守性が上がりやすい」という点です。

特にHTMLでは、意味のある要素（見出し、段落、表、リストなど）で構造を作ることが、アクセシビリティや可読性、運用（修正・拡張）の観点で効きます。

マークアップ言語の選択基準

迷ったら、次の観点で判断すると整理できます。

目的：表示が主か（HTML）、データ交換・構造化が主か（XML）
周辺要件：既存システムや規格がXMLを要求しているか
運用設計：検証（バリデーション）を厳密に回す必要があるか（XHTMLが候補になる場合がある）
開発体制：リンター、テンプレート、CIなど品質担保の仕組みを用意できるか
将来性：採用言語が周辺ツールや人材と整合するか

「将来の保守」を含めて選ぶことが、結果的にコストを抑える近道になります。

これからのマークアップ言語の捉え方

現在のWeb開発はHTML5を中心に、CSS・JavaScriptと組み合わせてアプリケーションを作る形が主流です。一方で、XMLは“Webページのため”というより、データや規格、ドキュメント、業務連携の世界で今も役割を持ちます。

また、HTMLの中でSVGやMathMLといった“XML系の表現”を扱う場面もあります。つまり、現場では「HTML vs XML」の二択ではなく、目的に応じて複数の表現を組み合わせるのが実態に近いでしょう。

まとめ

HTMLはWebページを表示するための標準言語、XMLはデータの構造と意味を厳密に表現するための言語、XHTMLはHTMLをXMLの文法で厳密に記述するための規格です。Webページを作るなら基本はHTML（現実的にはHTML5）が中心になり、XMLはデータ交換や規格・既存資産の要件がある場合に選ばれます。XHTMLは「XMLとして厳密に扱う必要がある」場面で検討する言語であり、目的と運用体制を踏まえて選ぶことが重要です。