HTMLはマークアップ言語が必須なので記述方法を教えます

contents

1.HTMLなどのマークアップ言語、PHPなどのプログラミング言語が必須
2.マークアップ言語 vs プログラミング言語、最初に勉強するならどっち！？
3.sgml, xml, html, xhtml について

１． HTMLなどのマークアップ言語、PHPなどのプログラミング言語が必須

印刷のデザイン指定を意味する英単語です。

マークアップ言語とは、文書中に、マークアップ（指定）を入れることで、文書のデザインを行う規則を意味します。

例えば、HTMLというマークアップ言語では、「<>」と文字の組み合わせによる「タグ」という記号を挿入することで、
文字を装飾したりデザインを指定することが可能です。
例えば文字を小さくしたい場合には、<small>小さくしたい文字</small>の様に記述します。

※「言語」とは、「規則」とか「体系」と言った意味で、ここでは「言葉」という意味ではありません。
また、マークアップ言語はプログラミング言語ではありません。

マークアップ言語はHTMLだけじゃありません。
XHTML、XML等もホームページ制作には使われます。

マークアップ言語で、基本構成とマークアップを行ないます。
スタイルシート（CSS）で、マークアップしたものに見栄えを与えます。

２．マークアップ言語 vs プログラミング言語、最初に勉強するならどっち！？

HTMLなどのマークアップ言語、PHPなどのプログラミング言語が必須ですが、どちらから勉強し始めた方が宜しいのでしょうか？

PHPを動かす時に、何かしらのHTML記述が要るので、HTMLを先に覚えた方がいいと思います。

基本的に、PHPは、HTMLに埋め込んでHTMLを出力する物なので、HTMLが先です。

ウェブサービスの提供なら、サーバが無いと話にならないので、クライアント側でプラットフォーム依存の高い、FlashとJavaScriptは、後回しで良いでしょう。

プログラマがデザインすると、自分が出来る範囲内でしかデザインしないので、自由度が低く、外見も不細工になりがちです。
デザインを勉強すると、必然的に、それを実現する為の新規のプログラム技術の勉強をすることになります。

デザイン主体だと、外見重視で実現が困難だったり、そもそも必須のデータが無かったりするので、見た目は良いけど中身の無い薄っぺらい物になりがちです。

プログラムを勉強すれば、何が出来るかが分かるので現実味が増え、又、新規に出来ることを知れば、それが新たなデザインに繋がるかも知れません。

が、基本的には外見だけで、実際に使うと機能的に不十分な事が多いです。

機能性も含めた、「人間工学的デザイン」が重要なのですが、デザインは、基本的に主観で決まるので、皆が納得する物を作るのは非常に困難です。

３．sgml, xml, html, xhtml について

上記 4 種類のマークアップ言語について違いがわかりません。

それらは全て、タグを使って文書（データ）構造を表現するものですね。ところで、「タグ」とは何でしょうか？

・<a>...</a>
・=a=...=?a=
・{a}...{_}

これらは全て「タグ」になりえます。「タグ」に用いる文字を決めるのが、SGML 宣言です。タグに用いる文字を決めたら、次に、タグで表される要素を定義します。

<!ELEMENT a (この要素内に何が置けるか)>

これを要素型宣言と言います。要素型宣言の集合が DTD です。これらも SGML の機能です。

タグに使う文字を SGML 宣言で決め、タグで表される要素を要素型宣言で定義する。そうやって作られた言語のひとつが HTML です。HTML 文書を作るには、最初に文書型宣言を置いて DTD をセットします。

しかしながら。タグで使う文字なんて、そうコロコロ変えたりしません。

そこで、タグで使う文字を <a>...</a> に固定してしまい、SGML 宣言を不要にしたのが XML です。XML 宣言 < ?xml ...?> は「SGML 宣言を省略したぞ」という目印です。

だから、XML 文書は要素の定義から始めれられます。それどころか、XML 文書は要素の定義がなくとも、いきなり文書内で要素を使って良い。定義の手間をできるだけ減らし、文書作成に集中できるように。

まあ、文書内でいきなりオレオレ要素を使えると言っても、既存の要素を使えた方が便利なこともあります。要素を使い回すための仕組みが名前空間です。例えば、ブラウザは XHTML の名前空間 "http://www.w3.org/1999/xhtml" に属する要素を判別し、処理してくれるでしょう。知らない名前空間の要素は無視すれば良いのですし。

ここまでで、サクッと文書を作り、かつブラウザでも処理されるようになりました。もう十分なのですが、でもやっぱり、文書にミスがないか検証したいときもあります。そのときは SGML と同じように「この要素の中に置けるのはこの要素」と定義する必要があります。

文書を検証するために定義されたのが XHTML 1.0、1.1 です。これらで使う要素の名前空間は同じですが、要素の置き方・並べ方が違います。

・SGML は、タグに使う文字と、タグで表される要素を定義する仕組み。HTML はその応用。
・XML は、タグに使う文字を固定し、定義なしでも文書を作れる仕組み。XHTML はその応用。

現状で SGML を覚える必要はほとんどありません。HTML5 は SGML とも XML とも違う、第三の枠組みです。

XHTML は名前空間をベースにすることで、拡張性と相互運用性の両立を目指しました。

しかしながら、ブラウザ開発者としては「知らない名前空間の要素は無視して良いよ」と言われても困るでしょう。何だかんだで、開発者は目の前にあるもの全部を実装する必要に迫られます。しかも XHTML 2.0 策定時のゴタゴタで、開発者は XHTML に見切りをつけてしまいました。

そこで、開発者の主導で策定されているのが HTML5 です。これは、ブラウザがサポートすべきものを全て定義し、ブラウザの相互運用性を確保しようとしたものです。

HTML5 には拡張性も名前空間もありません。なぜなら、拡張が必要なら開発者同士で話し合って、HTML5 およびブラウザに取り込んでしまうからです。このように「常に進化していく」という意味を込めて、現在はバージョンをつけずに「HTML」と呼びます（便宜上"5" もつけることが多いですが）。

と言うわけで、ウェブブラウザを使う用途では HTML5 がベースになります。XHTML は、ブラウザに直接関与しないバックエンドで使われるかもしれません。

このページを見た人は、下記のページも読んでいます！