< siteCTS / Top / ゆきこのおへや / FunnyHTML >

ヘッダ編

決してHTML講座なのではなくって

このページは siteCTS の旧版です。
URI確保のために保存してあるだけで、二度と更新されません。
JavaScript が有効の時は以下に移動先URIが表示されます。

< あぶない！[B] | ◇ 入口[E] | その他編[N] >

サイトマップ[M] | 通常版トップ[H] | プレーン版トップ[P] | ▲ ゆきこのおへや[C]

ヘッダ編の目次

下へ飛びます

<!DOCTYPE>[1]
<HTML>[2]
<HEAD>[3]
<META>[4]
<TITLE>[5]
<LINK>[6]
<STYLE>[7]
<SCRIPT>[8]

<!DOCTYPE>

HTMLでは、必ずこれを一番最初に宣言しなきゃいけない。なくても表示に代わりがないけど、それはブラウザが適当に補ってるだけで、絶対に書かなきゃいけない。
だから、ビルダーの環境設定で「DOCTYPEを出力する」なんてチェックボックスは、あっちゃいけない。

書式もちゃんと決まってて、俺が目指すところのTransitionalは


	<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

と書く。
そして、こう書いたからには、その仕様に従わなければならない。せめて文法上の誤りだけは完全撤廃を目指そうではないか。（野心はでかいほどよろしい）

このDOCTYPE、一体何者なのだろう。書式から見ても、そしてなにより<HTML>より前に書く以上、「タグ」でないのは明らかだ。
結果から言うと、これはSGMLというものである。意味は「この文書はHTML4.01Transitionalの仕様で書かれています」という宣言で、後ろのURLはその定義ファイルがある場所を示す。拡張子である「.dtd」は、Document Type Difinition （文書タイプ定義）の意。実際に行ってみるとわかる。[W]

HTMLがSGMLを応用した言語なのは聞きかじっていたが、実は別物でもなんでもなく、「SGMLアプリケーション」、つまりそのものだった。ゆえに、HTMLの深遠に迫るには、SGMLも勉強する必要がありそうである。とほほ。（ちなみにXMLもそのひとつ）

邦訳仕様書

教訓
DOCTYPEの宣言は必ず書かないといけない。

▲ PageTop

<HTML>

1行めに<!DOCTYPE>の宣言を書いたら、2行めに<HTML>を書く。


	<HTML lang="ja">

タグ自体を省略できることになってるけど、そんなことをやっちゃいかん。
lang="ja"は、「このHTML文書は日本語だよ」という意味で、省略すると謎言語として扱われるらしい。せっかくだから、これも書いておこうか。

邦訳仕様書

▲ PageTop

<HEAD>

<HTML>の次にくるのは、当然<HEAD>。
これも省略できることになってるけど、もちろん書くべきである。
このタグ自体にムヅカシイ仕組みはなにもない。
中身が難しいのである。

邦訳仕様書

▲ PageTop

<META>

<META>は、「なんだかよくわかんないタグ」の雄であろう。どこも適当に解説してて、ちっとも参考にならない。とりあえず、「通信で使われる情報」と解釈しておくのが無難っぽい。必須なものは書式が決まっているので、そのままコピーすればいいだけだ。

<META>には、主にhttp-equiv,name,contentの、3つの属性がある。このうち、nameは検索ロボット用のキーワードを書いたりするが、自分で適当にでっちあげても良い。つまり、あってもなくてもよろしい。


	<META http-equiv="Content-Type" content="text/html; charset=Shift_JIS">

nameとは逆に、http-equivは非常に重要である。
上の1行を書くことで、そのHTML文書がどの文字コードで書いてあるか、ブラウザに教えることができる。結果として、文字化けしなくなる。
当然ながら、Shift_JISのとこを間違えると要らぬ文字化けを招くので気をつけよう。Windowsのメモ帳で普通に開けるなら、これで構わぬ。（メモ帳はShift_JISにしか対応してない）

この文字コード指定は、可能な限り上に書くのが推奨されている。「可能な限り」というのは、つまり<HEAD>タグのすぐ後と解釈しておけばいいに違いない。


	<META http-equiv="Content-Script-Type" content="text/JavaScript">

	<META http-equiv="Content-Style-Type" content="text/css">

次にくるのは、この2行。JavaScriptを使う時や、style=""を使ってタグの中にスタイルシートを書く時は、これを必ず書かないといけない。つまり、使わないなら書く必要はないが、siteCTSにはそんなページなど皆無である。

書かなくても大体は動くようだが、それは決して「動けば書かなくてもよい」ことにはならない。あくまでもIEやネスケが優しいだけである。

邦訳仕様書

教訓
検索ロボット用のキーワードに悩んでる場合じゃない。

▲ PageTop

<TITLE>

続いて<TITLE>がくる。これに挟まれたテキストが文字通り「ページのタイトル」となって、ブックマーク名やウィンドウのタイトルバーに使われたりする。
ところで、今まで「このタグを書かないとページのURLが代わりに使われる」ものだと思っていたのだが、実は甚だしい勘違いであった。
困った輩である。

邦訳仕様書

教訓
<TITLE>は今も昔も今日も明日も必須である。

▲ PageTop

<LINK>

こいつもまた用途のよくわからない困ったタグだった。とりあえず外部スタイルシートを呼び出すくらいにしか使っていなかった。


	<LINK rel="contents" href="index.html" title="親ページの指定">

	<LINK rel="prev" href="back.html" title="前のページ">

	<LINK rel="next" href="next.html" title="次のページ">

	<LINK rev="made" href="mailto:cts@creasus.net" title="作者は俺">

こんな感じで用いるのは知っていたのだが、指定してもなにも起こらないし、全然意味ないじゃないか。いいや、書かなくて。
まったく、初めて買ったパソコンにIE5.5なんか入ってるから、こんな喜劇を招く。IEとネスケがたまたま対応してないだけの話なのだ。Lynxが対応しているとのことなので、久しぶりに起動してみた。おぉ、ちゃんと出ている。[L]

なお、外部のスタイルシートを呼び出す時は、以下のように書く。


	<LINK rel="StyleSheet" href="virus.css" type="text/css">

多くの自称先生は「拡張子は.cssでなければならない」とおっしゃるが、嘘らしい。（よくわかんないけど）
もっとも、「そうした方が安全」であることに間違いはないし、面倒もない。

邦訳仕様書

▲ PageTop

<STYLE>

スタイルシートと言えば、なにはなくともカスケーディングスタイルシート（CSS）だが、他にもいくつかの種類があったりする。ネスケ4に搭載されて消えたJSSS（JavaScript-StyleSheet）は、結局なんだったのだろうか。
そのため、これを使う時は必ずtype="text/css"と書いて、種類を宣言しないといけない。<LINK>で呼び出す時も必ず入れるし、本当はタグの中に style="" で直接書く時だって必要だ。
でもタグの中にはtype属性を入れられないので、<META>で


	<META http-equiv="Content-Style-Type" content="text/css">

と宣言しておく必要がある。

また、空白を含むフォント名などの「文字列」は、


	DIV { font-family:"Century Gothic";}

のように引用符で囲まないといけない。対して、centerやnormal、あるいは色指定のredなど、「キーワード」は囲んじゃいけない。
俺は今まで、ＭＳＰゴシック等の2バイト文字のみ囲っていたが、Century GothicやMS UI Gothicとかは囲んでなかった。問題なく表示されてたから。
…困った輩である。（ちなみに空白さえ入らなければ2バイト文字でも引用符は不要）

ついでに言うと、font-familyで該当フォントがない時に（そのクラス内の）その後の指定を全部無視したり、閉じられていない<P>や一番最初に定義されたクラスを綺麗に無視してくれる困ったバグをもったブラウザがあるようだ。</P>を閉じるのは当然として、念のために一番最初にダミーのクラスを置いたり、font-familyは一番最後に書くなどの対策を取っておくと完璧だ。
旧いIEやネスケにはスタイルシートの実装にかなり難があるので、バグ報告のページ[Y]を見つけたら積極的に目を通して情報収集を心がけよう。

邦訳仕様書

▲ PageTop

<SCRIPT>

JavaScriptをHTMLに直接書く時は、


	<SCRIPT language="JavaScript">

で挟まなきゃならない。しかし、HTML4.01ではlanguage属性は非推奨となっている。
代わりに


	<SCRIPT type="text/JavaScript">

が推奨されているものの、language="JavaScript1.4"などのスクリプトバージョン限定ができない気配。うぅむ。

また、スクリプトでHTMLのタグを書き出すことは非常に多くあるが、終タグ</xxx>を書いちゃいけない。
HTMLの解釈では、<SCRIPT>の終わりは</SCRIPT>ではなく、「次に</が出てきた時」である。出てきた時点で<SCRIPT>は閉じられてしまい、つまり、そこから後ろはひどい文法違反となる。
それでも問題なく動くのは、あくまでもブラウザがうまい具合に調整してくれるからであり、知ってしまった以上は抱っこされているわけにもいかぬ。面倒くさいなぁ。
対処としては、とにかく</を出さなきゃいいので、


	document.write("<CODE>閉じる時はこうやってエスケープすればいい。<\/CODE>");

閉じる時はこうやってエスケープしてやればいい。面倒くさいなぁ。（外部ファイルでは必要ないと思われるが、未確認）
話はそれだけに終わらない。JavaScriptをHTMLへ直書きする時は、非対応ブラウザを考慮して、


<SCRIPT type="text/JavaScript">

<!--



//-->

</SCRIPT>

という書き方をするが、コメントを「次に>が出てきた時点」で終わらせてしまうブラウザでは


if (a > 100) {

でコメントが終わってしまい、そこから後ろが丸出しという大惨事もあるという。これの対策には


if (100 < a) {

にするなどがあるものの、こんな仕様違反にまでつきあうつもりはないので、無視することにする。
加えて、このコメントアウト法は古くから用いられているポピュラーなものだけど、次世代（？）形式であるXHTMLでは使えない。スクリプト対応ブラウザでも本当にコメントとして扱われるそうだ。つまり、旧式ブラウザを切り捨てるか、すべて外部ファイルにするかの二択、ということである。
データベースのような大きいプロジェクトとか考えてる時は、将来を見越した設計が必要かも知れぬ。（素直にPerlを使えという説もある）

邦訳仕様書

教訓
HTML内のスクリプトからタグを書くのは面倒くさい。

< あぶない！[B] | ▲ PageTop | その他編[N] >