基礎からわかる!パソコン入門・再入門 / 無料パソコン教室・基礎知識・Word・Excel・PowerPoint

ウェブページの仕組み(2) ~ SGMLXMLXHTMLとは ~

HTMLは、インターネットの要素であるWWWシステム、つまり、ウェブページがハイパーリンクでつながったWWWの世界をつくる基礎となる言語です。

そのため、WWWの歴史は、HTMLの歴史でもあります。

WWWシステムは、1989年にヨーロッパの原子核研究所で、論文閲覧システムとして開発されたものが始まりとされています。

当時の研究者であるバーナース・リーという人が、膨大な研究論文の山の中から目的の論文をいつでも素早く閲覧するために、どのようなプラットフォーム(異なる機種やソフトなどの環境の違い)でも閲覧可能な論文閲覧システムを開発し、それを「World Wide Web」と名付けたのです。

この時、「HTML1.0」と呼ばれるマークアップ言語が用いられ、論文ファイルは「ハイパーリンク」でそれぞれ結ばれたのです。これがHTMLの始まりです。

その後、1995年に「HTML2.0」が同じくバーナーズ・リーによって、インターネットのテキスト規格として発表されました。

ちょうどこの頃から、インターネットが爆発的に普及し始め、それにともなってHTMLの重要性も増していきます。

HTMLファイルはブラウザで読み込まれてはじめてウェブページとして表示されるため、電子メールの書式 で解説しましたが、ここでも文字コードと同じように、

マイクロソフト社などのメーカーが、独自にHTMLを拡張しはじめた

のです。これでは、どのようなプラットフォームでも閲覧可能というWWW創始の原則から離れてしまうため、

W3C(ダブリュ スリー シー)

という、WWWで利用される技術の標準化をすすめる国際団体によって、HTMLの標準化が行われるようになりました。そして、1997年にW3Cによって「HTML3.2」、「HTML4.0」が発表され、今日に至っています。

現在のHTMLは、W3Cにより「HTML4.01」が勧告されています。(現在では、後述するXHTMLの問題点等からHTML5が策定されていますが、本項では割愛します)

HTMLの歴史
バージョン 特徴
HTML1.0 1989年にバーナーズ・リーが発表。「SGML」というマークアップ言語をもとに開発。書式など文書構造の基本要素だけでなく、画像などのイメージの利用が可能。
HTML2.0 1995年にバーナーズ・リーが発表。HTML1.0のすべての要素に加え、「フォーム」というユーザによる入力要素(アンケートやフォームメールなど)などが加わる。
HTML3.2 1997年1月にW3Cが発表。フォントや背景など、ページ上のあらゆるものに色をつけるなどの装飾化可能。しかし、このようなビジュアル化は、文書構造を記述するマークアップ言語であるというHTMLの精神(もとはSGMLの精神)から離れるとW3C内でも疑問視され、このバージョンが発表されてすぐに、HTML4.0の草案が発表される。
HTML4.0
(最終は、4.01)
1997年12月にW3Cが発表。ビジュアル化のための装飾用のタグや属性を「非推奨扱い」として再定義し、それらは「スタイルシート(CSS」というひな形を使用し、HTMLと切り離すように求める。
XHTML 2000年1月にHTMLの後継仕様としてW3Cが発表。ビジュアル(見栄え)の記述はすべてスタイルシート(CSS)で行う。文書構造の記述に特化した言語。
HTML5  2008年1月にW3Cが発表。XMLXHTML)への移行がスムーズに行われない等で、従来のHTMLを改良した言語。多くのマルチメディア要素(タグ)が実装されている。

HTMLは、このように進化するごとにビジュアル化のためのタグが増えて、HTTP を利用しないサウンドや動画など(プラグインという追加機能プログラムをブラウザに追加して再生するFlashムービーや、javaアプレットなど。詳しくは後述します)も読み込めるようなりました。

その結果、HTMLは文書の構造化に特化するように現状回帰して、ビジュアル化の装飾はHTMLと切り離して、スタイルシート(CSS)というひな形に保存しておき、文書のレイアウトや装飾を行う時は、そのスタイルシートを適用する(参照する)という、文書構造とレイアウト情報の分離が主流になっています。

そして、ついにHTMLは「最終バージョン」が勧告されるに至っています。つまり、次世代のHTMLに移り変わろうとしているのです。

さて、その解説に入る前に、上表の補足を先にしておきます。HTML2.0のところで登場した、

SGML(エス ジー エム エル)

とは、「Standard Generalized Markup Language」の略で1980年代後半からアメリカ国防総省などの公文書規格として採用されている言語です。SGMLは「メタ言語」と呼ばれるもので、

言語を記述するための言語

という少しやっかいな言語です。簡単に説明すると、HTMLのようにタグや文書構造を決めているのではなく、タグや文書構造の「決め方を決めている」マークアップ言語で、あらゆるものを定義することができる、HTMLの源流となるものです。

つまり、その範囲はとても幅広く扱いにくいために、SGMLをもとに機能を限定したHTMLなどの「Web用」マークアップ言語が開発されたのです。

そして、最後に登場した、

XHTML(エックス エイチティー エム エル)

とは「Extensible HyperText Markup Language」の略で、HTMLの後継仕様にあたります。HTMLは上表のように進化し、ついには最終バージョンとしてHTML4.01が発表されたのを最後に、

次世代のXHTMLに移り変わろうとしている

のです。さてそれでは、これから未来へ向けての動向を詳しく学習するために、「SGML」「HTML」「XHTML」の関係と歴史をもう少し詳しくみていきましょう。

HTMLの進化の流れは上表のとおりですが、前述のとおり、「SGML」という文書形式がこれらの源流となるものです。つまり、どのようなプラットフォームでも閲覧可能な構造化された文書システムという、まさにWWWと同様の思想の源流となるものです。

SGMLは、1980年代に開発されました。当時は、文字コード と同様に、異なる機種間での文書のやり取りがスムーズに行えず、この問題の解決に各企業は多大なコストを費やしていました。つまり、どんな環境でも読み込みと認識が可能で、文書内容も同様に表示できるようなテキスト規格が必要だったのです。

また、情報の交換や共有化へのニーズが高まり、ドキュメント(文書)は、紙への印刷だけでなくデータベース化やコンテンツ化などのいろいろな用途で利用するための汎用性が求められてきました。

こうした背景から、SGMLは、

文書のレイアウト情報を省き、論理的な構造化によって汎用性を高める

言語として開発されました。レイアウト情報を省くというのは、レイアウト情報を含まない「プレーンテキスト」にすることによって互換性を高めるためです。例えば、フォントやレイアウト情報を含む「Word文書(.doc)」よりも、プレーンテキストである「メモ帳(.txt)」の方が環境に依存しないのと同じです。

また、印刷以外にも様々な用途で利用するための汎用性が求められたため、レイアウト情報などの特定の処理情報が付加されると情報の活用の幅が制限されてしまうという問題もあったのです。

そして、SGMLの最大の特徴は、文書を「論理的な構造」によってとらえるという点です。

論理的な構造とは、文書を物理的な構造(レイアウト)としてとらえるのではなく、ただの文字の羅列にすぎないプレーンテキストをいくつかの文書要素に分類して、

要素に意味を持たせ、各々の要素同士はどんな関係にあるのかをあらわす

ということです。下図を参照してください。下図は、通常の文書です。この文書をSGMLで表現して行きます。まず、レイアウト情報を省くとどうなるでしょうか。

レイアウト情報を持たせたドキュメントのイメージ

レイアウト情報を省いたプレーンテキストでは、下図のようになります。

レイアウト情報を省いたプレーンテキストのイメージ

このようにプレーンテキストであれば互換性は高まり、どのような機種にも依存することなく文書を取り扱うことができますが、ただの文字列としてしかコンピュータは認識できず、データベース化などの汎用的に応用できるデータではありません。

したがってSGMLでは、文書をいくつかの文書要素に分類して論理的な構造としてとらえ、コンピュータも(人間も)意味を理解できるようにしました。

文書の論理構造を加えると、下図のようになります。

論理的に構造化した文書のイメージ

このように、マーク(タグ<>)を付けて文書を分類し、このマークに意味を持たせて構造化します。こうすれば、コンピュータはデータを処理する際にマークによって意味と構造を理解することができ、文書の閲覧や表示のみならず、データベース化など汎用的に利用できるようになります。

「<>」で囲まれたマークを「要素」といい、文書はその意味などによって各要素に分類されて、<要素>文書</要素>のように文書に意味付けをされています。前項で解説したHTMLの記述とそっくりなことにお気づきだと思います。

上図の<報告書>や<内容>、<研究者>が色づけされているのは、各要素をいくつかまとめてグループ化した要素をわかりやすくするためです。上図のように、<報告書>という最も大きなグループの中に小さなグループがあり、さらにその中に各要素があります。

つまり、フォルダの階層構造のように、上の「研究報告書」は、ツリー状に構造化されています。

文書の構造化イメージ

要素の階層構造のイメージ

このように、それぞれの要素をいくつかグループ化して、「研究者」や「内容」のように「親」の要素として表せば、文書の意味や構造をより明確に表すことができます。

論理構造を付加することによって、ただのプレーンテキストの文書がどのような要素から成り立ち、それぞれの要素同士はどんな関係にあるのかを表すことができ、様々な用途に用いることのできる汎用性のあるデータとなるのです。

SGML文書は、HTMLのように「要素名」を文書中にマークとして付けることによって表されます。このマークは、前項でも解説のとおり「タグ」と呼ばれ、文書にタグを付けることを「マークアップ」と言います。

特にSGMLは、「メタ言語」と前述したように、

任意のタグ名を付けることができる

ので、実際はとても幅広く複雑な言語になります。SGMLの詳しい記述方法はここでは割愛しますが、本文を書く前に、どのような文字や機能を使うかといった「文書型」を記述しておくことで、本文のマークアップのルールを設定します。

つまり、SGMLではユーザーが自由に「マークアップのルール」を設定、変更することができるのです。一方、HTMLでは決められたマークアップのルールがあり、それに従わなければなりません。

こうしてSGMLは、アメリカ国防総省の公文書や製造業、出版社、コンピュータ企業など多くの業種の間でマニュアル等の国際的な出版企画として利用されてきました。

このようにSGMLはすばらしい言語で爆発的に普及した、と言いたいところですが、SGMLという言語をご存じの方は少ないと思います。つまり、SGMLは大きな将来性を持ちつつも、十分普及したとは言えません。

なぜなら、何より文書定義が複雑であったこと、そのために処理に時間がかかることなどがあげられます。また、SGMLに関する周辺技術やツールの開発も十分ではありませんでした。

一方、SGMLの普及が進まない横目で、WWWの爆発的な普及にともない、SGMLをもとに開発されたHTMLの方が普及しはじめたのです。つまり、

SGMLからWeb用の簡易言語として派生したHTMLが普及してしまった

のです。HTMLは、SGMLのサブセット(全体の中の一部分の意)になりますが、使用できるタグが決められていて、なおかつ初心者にも扱いやすい言語であり、WWWの普及とともにウェブページ作成のスタンダードとなったのです。

しかし、WWWの世界でHTMLが普及するにつれ、いろいろと問題が生じてきました。

まず、文書構造とレイアウト構造を分離するというSGMLWWWの基本理念から逸脱し、HTMLでレイアウト構造まで記述するウェブページが多くなったことです。つまり、

文書構造と視覚表現が分離されなくなった

のです。例えば「表」を用いて、その中に画像や文章をおさめてページをレイアウトする方法がよく用いられます。これは本来の使用方法ではありませんし、逆に記述量も多くなり、どんな環境でも利用できるテキストというWWWの概念から逸脱しています。

その他にも、フォントの装飾や背景、文字列のインデント(センタリングや右寄せなど)などもレイアウト構造であり、本来の文書構造の要素ではない余計な情報なのです。

ウェブページ作成ソフトを使用して簡単にウェブページを作成することができますが、このようなレイアウト構造をHTMLで記述してしまうので、知識なしで作成できてしまうことも多少問題なのかもしれません。

しかし、それならばレイアウトはどうするのかということですが、こうした視覚的表現はHTMLで記述するのではなく、

スタイルシート(CSS

という別の「外部ファイル」に記述して、HTMLファイル(本体の文書構造のみのファイル)がそれを参照することによって実現します。(本来、CSSとスタイルシートは別のものですが、現在ではスタイルシートといえば「CSS」をさすことがほとんどです。)CSSは「Cascading Style Sheets」の略で、「シー エス エス」と呼ぶこともあります。

この基本的ルールが忘れられ、W3C自身によってHTMLに視覚表現のタグが追加されたこともありました。現在の最新バージョン「HTML4.01」では、それらの視覚表現のタグを「非推奨扱い」として再定義しています。つまり、使用しないでねということです。

さらに、HTMLファイルは、SGMLのように汎用的に使えるファイルではなく、ウェブが社会に浸透して様々な機器やデータベース、サービスなどと連動してくるようになると、多くの障害が表面化してきました。

つまり、HTMLはタグが固定的で汎用性に乏しく、ITの進歩によるインターネットと新しいサービスの連動といった応用が効かないという問題です。

一方、それは「SGML」にも少なからず当てはまる問題でした。複雑で処理時間がかかるうえに、ウェブ上での使用には限界があったのです。

そこで、SGMLをもとに「Web上での使用」を前提にした、簡潔で応用の効く次世代のSGMLの開発が行われました。そして、SGMLの汎用性を維持しつつ、なおかつ扱いやすい言語として、

XML(エックス エム エル)

という言語が開発されました。XMLは「Extensible Markup Language」の略で、SGMLと同様、文書型定義(DTDという)を用意することで、新しい言語を規定することができる「メタ言語」です。

XMLSGMLに比べて扱いやすいため、XMLベースの言語が簡単にまた安価で開発できることから、多くの企業で採用され、関連技術の開発やサービスとの連動が行われています。すでにXML形式による組織や企業間の情報交換も活発になっています。(ただし、XMLSGMLのサブセットとされています)

そして、XMLデータの汎用性と使いやすさから、

ウェブ関連のさまざまな分野でXMLが標準の文書形式となる

流れになっています。したがって、現在ではXMLがウェブのスタンダードとなり、XMLに合わせたサービスやシステムが構築されているのです。

すなわち、HTMLからXMLに移行し、XMLが中心となる ということです。しかし、インターネットの世界では、IPv6文字コード のようにそう単純に世代交代が行われるわけではありませんし、障害もあります。

なぜなら、HTMLの記述方法は、XMLの記述方法に適合しないので、

HTMLデータとXMLデータの相互連携が困難

という問題です。このためHTMLは、ウェブ上のスタンダードとなったXMLと関連サービスから取り残され、過去のものとなってしまうかもしれません。

この問題を解決するために、HTMLXML文法で再定義した、

XHTML(エックス エイチ ティー エム エル)

という言語が開発されました。XHTMLは「Extensible HyperText Markup Language」の略になります。つまり、前述のとおりHTMLの後継仕様です。HTMLの基盤であったSGMLXMLに進化したため、HTMLXMLに従ったXHTMLに進化したというわけです。

このように、XHTMLHTMLXMLの中間の存在 であり、XHTMLで記述したデータであれば、XMLデータと相互に連携可能になります。このため、

HTMLからXHTMLへの移行が進んでいる

のが現状です。もっとも、依然としてHTMLが多数派であり、簡単な個人のウェブページや情報発信手段としてはHTMLで十分なところもあり、どれほど移行が進むかは難しい問題です。また、完全に文書構造と視覚表現を分離するのはある程度の知識やテクニックが必要になります。(現に、XHTMLへの移行はスムーズにいかず、HTML5が策定されています)

各言語の詳しい記述方法はここでは割愛しますが、何もXHTMLHTMLが大きく異なるわけではありません。HTMLでは、タグが大文字と小文字を区別しないのに対して、XHTMLでは小文字で記述しなければならないことや、XHTMLでは装飾はすべてCSSで行うといった違いはありますが、基本的な記述はほぼ同じです。

以下は、XHTMLで文書構造と視覚表現が分離された「正しい」ウェブページの一例です。下図は「現在ページ」のイメージです。

現在のページのイメージ

このページは、XHTMLによる文書構造とCSSによる視覚表現を分離していますので、視覚表現を外すと下図のように文字だけのXHTMLファイルになります。

視覚表現を取り除いた「現在のページ」イメージ

このように、視覚表現を完全に分離することで、この文書の情報は汎用的にどんなプラットフォームでも利用できる構造的なデータとなります。

視覚表現のCSSは、下図のように「メモ帳」で記述できるテキストファイルになります。

スタイルシート(CSS)のイメージ

このCSSを、XHTMLファイルが参照することでレイアウトが適用されて「現在のページ」になっています。

さて、今後ますますXMLが身近なものとなり、XMLのデータを扱う機会が少なからずやってくると思います。各企業はXMLで独自の言語を作成し、XMLの汎用的なデータを情報交換に用いています。

したがって、XMLを知り、XMLHTMLの架け橋となるXHTMLを知っておくことは、実生活でも少なからず役に立つと思います。

ページトップへ戻る


関連情報&オススメ

『ニューズウィーク』は『タイム』とともに世界的に購読されているアメリカのニュース雑誌です。日本に関する記事は少ないですが、世界的な視点で編集されており、国際社会の様々な価値観を知ることができます。

様々な意見を取り上げ、いい意味で画一的でないので、私は、毎週読んでいくうちに「自分自身の考え」を持てるようになりました。国際情勢や経済、地域紛争などについて、自分がその歴史や背景、登場人物を認識していて意見できるくらいの知識を得ることができるようになったと思います。

読み始めた当初は、ほとんどのことが理解できないくらい難しい内容に感じました。たとえば、円高や金利などの経済の仕組みや国際社会の地政学的な背景などの基礎知識がなかったからです。しかし、「毎週全部の記事を読む」「わからないことはネットで調べる」と自分に決め、一年間読み続けたらなんとか理解できるようになり、記事を読むのが本当に楽しくなりました。

また、日本のメディアにはない視点に立って書かれている記事が多いので、感心させられることや考えさせられることも多々あります。例えば、日本では「クジラ食文化」は断固として守らなければならないという視点で記事が書かれますが、「クジラを食することを文化としてる日本人はどれだけいるのか」という視点から記事が掘り下げられていきます。

そこには、画一的な報道からでは見えない「気づき」があります。多角的な視点を持つことで、ニュースの裏に透けて見える矛盾や戦略を感じとる皮膚感覚が身についてきたように思います。

さらに、各国の元閣僚や大物財界人、ビッグスターの寄稿も多く、デービット・ベッカムが札幌でPKを決めたときの気持ちをつづったコラム(その前回のワールドカップで退場になった因縁のアルゼンチン戦)で、「もう、大丈夫だと思った」という言葉は今でも印象に残っています。

先進国の世界的不況や中東の動乱、そして東日本大震災における援助や報道など、世界の中で、国際社会と複雑に絡み合う時代に生きていることを教えてくれます。ひとつ上の目線と価値観を与えてくれた雑誌です。

決して安くはありませんが、1年購読は18,520円(一冊定価460円)です。

ページトップへ戻る

更新履歴

2009年1月6日
ページを公開。
2009年6月14日
ページをXHTML1.0とCSS2.1で、Web標準化。レイアウト変更。
2010年12月29日
HTML5に関する記述を追加。
2014年5月22日
内容修正。

ページトップへ戻る

参考文献・ウェブサイト

当ページの作成にあたり、以下の文献およびウェブサイトを参考にさせていただきました。

XML SQUARE-ビギナーズコーナー
http://www.utj.co.jp/xml/beg/index.html
最短のXML入門とメタ言語
http://www.atmarkit.co.jp/fxml/rensai/xmlwomanabou01/learning-xml.html
文献
Web標準の教科書―XHTMLCSSでつくる“正しい”Webサイト参考文献
文献
図解入門 インターネットのしくみ参考文献

ページトップへ戻る