HTMLの話

Home
Last update: 2000/05/02

古いとか、書き方がどうも(恥)、とかありますが、一応保存。(2002/08/27)


HTML超入門。この手のものは沢山ありますが、具体的な書き方の前に知っておいた方がよさそうなことをいくつか。

  1. Webpage
  2. HTML: HyperText Markup Language
  3. 論理的マークアップ
  4. 画像
  5. DOCTYPE宣言とか文字コードとか

1. Webpage

あなたが今ご覧のようなやつを何というか?"Homepage:ホームページ"じゃないの?それでもいいんですけど、"Page:ページ"または"Webpage:ウェブページ"という方が無難のような。"Homepage:ホームページ"という言葉は、本でいうと表紙のような特定のページをさすのが本来のイミらしいので、ダサーイ、って思われてる可能性も少々あり。

更に「ページ」と言うのがそもそもオカシイという意見も(すみけんたろう氏)。

さて、今あなたがこの「ページ」をどうして読むことができるのか?というと、

  1. 私が"HTML"という形式で文書を書き、
  2. 特定のコンピュータの特定の場所に記憶させた
  3. それをあなたが呼び出して"HTML"を解釈できるソフトウェア(ウェブブラウザ)で見てる
ということであります。HTML形式の文書を書くための専用ソフトもありますが、単なるエディタ(メモ帳など)でも全然問題ないです(拡張子はhtmlなどとすること)。では、具体的にHTML形式で書くとはどんなことなのか?

2. HTML: HyperText Markup Language

HTMLとはここにあげた英語の略称で、"HyperText"というのは、要するにリンクのあるテキストですね(ちょっと乱暴?)。文書の一部分(これを「アンカー」と言ったりする)をマウスでつつくと別の文書や画像が出てくるってやつです。

次に"Markup Language"。"Language:言語"はまぁ「約束」位の感じ(^^;)。問題は"Markup"ですが、一つ例をあげます。

ここは強調表示されています

ワープロなどでこういう表示をするとき、皆さんはどうしますか?「マウスで範囲を指定して、属性で太字を選ぶ」という操作をされるでしょう。ワープロの場合、この指定が結果に直接反映されます。HTMLのマークアップというのも結局同じなのですが、文書中のある範囲をタグ(=札)とよばれる記号でマークをつけて指定してやるので、文書を普通のエディタなどで見ても結果は直接見えません。文書の中にそうしたタグが一緒に見えるだけです。具体的に上の行の場合、次のように書いてあるのが見えます。

<strong>ここは強調表示されています</strong>

カギカッコでかこまれた"<strong>"と"</strong>"がタグです。 このようなタグが各種あり、それを使って書いた文書をこの約束を解釈できるソフト(ウェブブラウザ)に食べさせると相応の形式で表示される、というのが「ページ」のしくみです。

ちなみに、HTML以外にもこうしたマークアップ言語あり(例えば組版用の"TEX"など)。

ここではこれ以上各種タグの説明はしません。他のページなどを見てください(→情報源)。


3. 論理的マークアップ

ここで極めて重要なことを一つ!それは、HTML文書はどんな形で出力されるか決まっていない、ということです。ワープロで言えば、紙の大きさ、縦書きか横書きか、フォント、などは全く決まっていない、のです。

例えば前項「強調表示」ですが、このタグを使用した場合、普通のブラウザでは「太字」として表示されるわけですが、「強調=太字」という約束があるわけではありません。音声出力をするブラウザで、声のピッチや速度を変えて「強調」する、というような事も考えられます(実際どうしているのかは知りません)。

実はタグの中には直接「太字」を指定するものがあります(<b>, </b> で囲む)。しかし、こういったタグ(「物理タグ」)で見ばえを直接指定するようなことは望ましくないわけです。あるいは、原稿用紙のように段落の区切りを「字下げ」にしたいのでHTMLで段落指定をしない、というのもマズイ。

つまり、「文章の論理的構造をきちんとマークアップすることに専念せよ、見ばえはあくまでも結果だ」、というのがHTMLの精神(!?)。 とはいっても実際はいろいろあって(例えばこの文書でも下線<u>を使ってます)あまりエラそうな事は言えないのですが。

ちなみに、見ばえについてはHTMLとは別にスタイルシートを使うことで解決する方向に向かっているようなので、見栄えイノチの方はそっち方面の勉強してください ^^;


4. 画像

画像はページの重要な要素です。しかし、音声出力など画像情報を得られないユーザも存在します。また、今日でも画像のダウンロードには時間がかかるため、通常は表示させないようにしている方も多いです。ですので画像の扱いには気を使う必要があります。

やっぱり基本はテキスト!イメージマップとか、画像がなければ何がなんだかわからないページはご勘弁。ALT属性で代替テキストを表示してね。HTMLでは見ばえを厳密に指定できないので文章まで画像にする、という人が時々いますがこれはホントに困ります。


5. DOCTYPE宣言とか文字コードとか

このへんの事は、実は何も書かなくてもなんとかなることも多いですが、ほんとはこういうことも気にした方がいいです。なかなか難しい話ですけど。

まず、HTMLの規格にはいくつかのバージョンがあり、どれを使っているのか、文書の冒頭で指定するのが正式です。これがDOCTYPE宣言というやつ。HTML作成ソフトにまかせておくとインチキ書いてることが多いとかで、ご注意。

それから、その文書で使っている文字コード(例えばWinで日本語使ってるユーザなら多分シフトJIS)、これも指定して置いた方がよいです。ほかのページ見てきたら表示が化けた、とかなりがちです。

これらについては、バージョンと文字の情報(The Web KANZAKI)などを見てください。


情報源

いろいろ本が出ていますが、妙なもの and/or 内容が古いものが多いようですので、Webを調べるのが吉(これにしても玉石混淆なので注意が必要ですが)。ここではひとつだけご紹介。


Since: 2000/03/16 gen-yu@mtc.biglobe.ne.jp