さて、ホームページ製作講座、今日で三回目です。
いつもどおり復習から入りましょう。
まず、HTMLとは文章の要素に印をつけるための言語でした。その印には<></>（タグ）と呼ばれるもので文章を囲めばよかったですね。前回の宿題では5つの要素をサンプルに出しました。
こんな感じになりましたら正解です。
これを見ればまたもや賢明な読者の皆さんにはお分かりでしょうが、要素のマークをつけられた文章はブラウザに読み込まれると自動的にその要素にふさわしい表示になります。それがまさにホームページなわけです。（ホームページという呼称は不適切な気もしますが、ウェブページと呼ぶとちょっと賢くなった気分かもしれません。慎重な人はHTML文章と読んでくださいｗ
ところで、上のサンプルを見ると、タグで囲んでも一見するとなにも起きていないかのように見えるタグもありますね。それも踏まえて一番最初に見せたサンプルについて解説しましょう。
忘れた人のために。こんなファイルでした。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=Shift-JIS">
<TITLE>HTMLを使ってみよう</TITLE>
</HEAD>
<BODY>
<!-- ここから本文部分 -->
<H1>連載HTML作成講座</H1>
<P>HTMLはマークアップ記述言語の一種で、
ドキュメントの構造を記述するための言語であるSGMLより派生した。
HTMLはSGMLの特徴である「文章の意味を構造から記述できること」に加え、
文章以外の画像を埋め込んだり、また<STRONG>外部文章への参照を直接指示</STRONG>することができます。</P>
</BODY>
</HTML>
順番に見て行きましょう。まずは1行目
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
普通の初心者向けHTML講座には出てこないかもしれませんが、ここでは今後（スタイルシートとか）のためにあえて説明することにしました。
最初にも言いましたがHTMLとは全世界共通の言語でなくてはなりません。つまり、それにはれっきとしたルールが必要なわけです。またHTMLは自然言語（普通にしゃべる言葉）と違って人間が作り出したものですので、何回も必要に応じてその文法というべき仕様が幾度か変わっています。ブラウザソフトはこの仕様に沿ってHTMLを解釈するわけです。
この仕様はW3Cと呼ばれる機構が制定していて、上のタグではその仕様のバージョン4.01を指定しているわけです。また多くの初心者サイトで指定してないこともありますが、指定しないでおくとブラウザが都合のよいように定義してくれます。（大雑把ですね
またちょっと混乱するかもしれませんが、実は同じバージョン4でもいくつかの定義があるのです。いきなりバージョン4を適用しても多くのホームページでまだバージョン3に従っていたらせっかく新しいバージョンを制定してもなかなか広まってくれないません。その期間にはどちらのバージョンでもきちんと表示されるように同じバージョン４内にもいくつかバージョンがあります。つまり転換期用なわけですね。興味のある方は文章型定義で調べてみてください。思うように情報が出てこない場合にはw3cなどとキーワードを増やしてみるといいかもしれません。
さて、ちょっと長くなりましたがここのところは完璧に理解する必要はありません。分からなければ、サンプルをそのままコピーすればいいのです。
<HTML></HTML>
HTML要素です。要するにこのタグにはさまれた文章がHTML文章であると指定しているのです。
<HEAD></HEAD>
HEAD要素。現実世界の文章にたとえるとちょっと難しいのですが、文章についての説明をするところです。このタグに囲まれたところはブラウザには表示されません。タグを閉じ忘れると文章全体が表示されなくなり、困ったことになります。
<META http-equiv="Content-Type" content="text/html; charset=Shift-JIS">
メタ要素と呼ばれるものです。いろんなことをブラウザに教えるためにあるタグです。例えばここでは二つの事柄を示しています。
content="text/html
一般的にブラウザはHTML文章以外にもいろんなファイルが読み込めたりします。例えば、拡張子.txtとついたテキストファイルをブラウザで開いても内容はしっかり表示されますし（改行はしっかりされませんが）、Flashムービーと呼ばれる拡張子.swfファイルをブラウザで開けば再生することもできます。
そこでこのプロパティではこのファイルがHTML文章であることをブラウザに教えてくれているわけです。
また、何度も言っているようにHTMLは世界共通ですので、タグ以外の実際に表示する文章もいろんな国の言語に対応しておかなければなりません。しかし実際日本に住む私たちがバリバリ中国語で出来たページやドイツ語で書かれたページを頻繁に読むことはあんまり多くはありません。そこで、いろんな言語の文字を文字セットとして切り分け、必要なところでブラウザに読み込ませるようになっているのです。
charset=Shift-JIS"
とはJISが定めた日本語の文字コードのことをさしているわけです。
ところで、またまた混乱させる事実を言いますが、同じ日本語でもさまざまな文字コードがあります。日本語には漢字のようにたくさんの文字があります。これをいかにして効率的にまとめるかという歴史的経緯があるのです。興味のある方はインターネット上で文字コードについて調べてみてください。
一般的なWindowsユーザーの方ならShift-JISで間違いはないでしょう。
<TITLE></TITLE>
これは簡単ですね。タイトル要素です。つまり文章のタイトルです。ブラウザにもよりますが、IEの場合このタグに囲まれた文字列がウィンドウのタイトルになっています。ここでは「HTMLを使ってみよう」となっていますので、ブラウザで開くと、「HTMLを使ってみよう Microsoft Internet Explorer」と表示されたわけです。
<BODY></BODY>
ここからいよいよ本文になります。BODY要素です。ここの間に書かれた文章が実際に表示されます。
<!-- -->
ちょっと要素とは違うのですが、コメントを書くために使うタグです。つまり注釈です。長い文章を書いてるとあとで自分でも何を書いたか分からなくなるときがありますよね。そんなときには予め注釈をつけておくと便利です。もちろんブラウザで見ても表示されません。
<H1></H1>
第一段階見出し要素です。本の章の見出しのように見出しを指定することができます。また第一段階からも分かるように第二段階、第三段階・・・と全部で第六段階まであります。第二段階とはタイトルのあとにあるサブタイトルのようなイメージです。そしてそこからも分かるように段階が下がるごとに文字の大きさも小さくなるわけです。サブタイトルとタイトルが同じ大きさだったら分かりにくいですもんね。
といってもほとんどの場合第二段階<H2>までで事足りますが。
<P></P>
段落要素です。このタグの間に挟まれてる内容がひと段落として認識されます。通常段落というと、一行目に字下げしてるものですが、HTMLでは字下げはしていません。そのように文章を書かない国・文化があるからです。ただし改行はきちっとやってくれます。
さて、実はこれだけ覚えておいてもHTMLできちんとした文章が書けますが、それ以外にもこんなタグがあります。
<EM></EM>,<STRONG></STRONG>
EM要素とSTRONG要素は文章の中で強調したいところにつけるタグです。強調された文章はブラウザで大きく太字になります。EMとSTRONGの違いはと聞かれると、ほとんどの場合EMが強調、STRONGがもっと強調という答えが返ってきます。特に使い分けを考えなくてもいいでしょう。
<BR>
BR要素は強制改行に使われるタグです。文章は基本的にブラウザが適時に改行をいれて表示させますが、体裁を整えるためなどどうしても強制的に改行を入れてほしいときに使います。珍しい</>終了タグのないタグです。<BR />とも書かれているようです。
ちょっと長くなってしまいましたね。きりがいいところで今回はここまでにしておきましょう。ちょっと腕が疲れました。疲れたときにはちょっと指を伸ばして、ついでに腕も伸ばしてストレッチなんかしてみましょう。
予告していた<B><I>については解説することができませんでした。次回に回します。こんなことを言うとどんどんスケジュールがずれてくるのでしょう。
では今日の宿題は今日出てきた要素を全て使って文章を作成してみてください。なんどもタグを打って体で覚えることが重要なのです。
