ＨＴＭＬの話

ＨＴＭＬとは、ハイパーテキストマークアップランゲージ（Hyper Text Markup Language）の略で、ホームページを作成する（ブラウザで表示されるファイルを作成する）時に使用されるテキストを編集するための言語または文書形式のことです。

早い話が、普通のテキスト文章である本文にタグと呼ばれる記号や言語を付記したもので、これでレイアウトや表示の方法をブラウザに指示し、表示させるのです。

すべてのホームページ（Webページ）は、ＨＴＭＬで作成されていて、このＨＴＭＬは、どのページでも簡単に見ることができます。

（※動きのあるページを作る目的で、ＨＴＭＬにJavaScript等、別の言語を付記する場合や、サーバー側でプログラムを動作させるＣＧＩという手法もありますが、いずれにしても、ベースはＨＴＭＬで、そこから他の言語やプログラムを呼び出して動作させる仕組みになっています。ＤＨＴＭＬやＸＭＬ等も存在しますが、これは、ＨＴＭＬの進化形です。）

このページのＨＴＭＬも、メニューバーの「表示」→「ソース」で表示することが出来ます。

「メモ帳」が開いて、そこに<head>とか<title>とか<br>などの記号みたいな文字が表示されていると思います。これがＨＴＭＬです。

なぜ「メモ帳」が開いて、そこに表示されるのか。それは、ＨＴＭＬを記述するときに、「メモ帳」を使用しているからです。これをHTMLファイルに変換して、Webページを作っています。「メモ帳」に限らず、エディタてあればＨＴＭＬを記述することができます。

ホームページ作成ソフトで作った場合も、入力された情報に基づき、ソフトが自動的にタグを書きこみ、ＨＴＭＬに変換するもので、最終的には、手入力で作ったものと同じ文書形式になります。

ＨＴＭＬを知っていると何かに役立つ？
ホームページを作っている人、作りたいと思っている人には、もちろん役立ちます。ホームページはもっぱら作成ソフトで作るという人には、必要ないかというと、そうでもありません。
例えば、プロバイダから与えられるアクセスカウンタや掲示板を自分のページに埋め込む時など、ＨＴＭＬを知っていれば、悩むことなく自在に設定できます。
それでは、ホームページは作らないし、将来作る予定もないという人は、ＨＴＭＬなんて無用かというと、そうとは限りません。
例えば、こんな時
JPEG形式で保存した写真画像ファイルを開くと普通は、ブラウザが起動して、そこへ表示されます。しかも、画面の左上端に。こんな時に、真ん中に表示されれば、カッコイイのに。ついでにコメントなんか入れられたら・・・。ＨＴＭＬを知っていれば、簡単にできます。自作の凝ったオリジナルアルバムが簡単に作れたりします。

理屈はともかくとして、さっそくＨＴＭＬを書いてみましょう。

<html>
<head>
<title>サンプルページ</title>
</head>
<body>
<h1>ＨＴＭＬサンプル</h1>
さっそくＨＴＭＬを記述してみましょう。
<br>
<font size=2>このように表示されます。</font>
</body>
</html>

１．「メモ帳」を開いて上のHTMLサンプルを書き込みます。

※面倒な時は上記の文字をドラッグして選択（反転文字）→右クリックの
「コピー」
→「メモ帳」を開いてメニューバーの「編集」→「貼り付け」

２．「名前を付けて保存」します。

３．そのファイルの拡張子.txt を .html に書き換えます。

※ファイルの拡張子を表示させる方法
※ファイルの名前を変更する方法

４．そのファイルをダブルクリック（またはクリック）で開くとブラウザが起動し、このように表示されます。↓

ＨＴＭＬサンプル
さっそくＨＴＭＬを記述してみましょう。
このように表示されます。

上記を例にＨＴＭＬの説明をします

ＨＴＭＬは、基本的に、<>で囲まれた、タグと呼ばれる部分と本文から構成されます。
タグには下記のような記述パターンがあります
<○○○>本文</○○○>
<○○○>本文
<○○○ △△=□>本文</○○○>
<○○○ △△>本文</○○○>
<○○○>

<html>
<head>
<title>サンプルページ</title>
</head>
<body>
<h1>ＨＴＭＬサンプル</h1>
さっそくＨＴＭＬを記述してみましょう。
<br>
<font size=2>このように表示されます。</font>
</body>
</html>

<html> </html>は、この文書がＨＴＭＬ文書であることを示します。
<head> </head>には、画面に表示させる情報以外で、ブラウザやサーバーなどに伝えるための情報を記述します。
<title> </title>には、そのページのタイトルを書きます。ここに書かれたタイトルは、サーチエンジンの検索に掛かったときに表示されたり、ブラウザの「お気に入り」に登録した時に、この名前が登録されます。
<body> </body>には、画面に表示される部分の本文を含めた情報を記述します。
<h1> </h1>は、ページ上に表示するタイトルの記述に使います。
<br>で、改行されます。
<font size=2> </font>は、文字の表示を制御します。このばあいは size=2 （タグの属性）で、文字の大きさを指定しています。

ＨＴＭＬの基本構造は、以上が全てです。後は、数あるタグの種類と機能を知り、それを組み合わせることで、自在にページを作ることが出来ます。

次のページ［主要タグ一覧］

ＨＴＭＬ記述時の注意事項

ＨＴＭＬ記述時に改行しても、実際の表示には、反映されません。
ＨＴＭＬは１行でも数行に分けて記述しても、原則として結果は同じです。
全角のスペースは、文字化けする可能性があるため、常識的には使用しません。（ワープロソフトのように、レイアウトを整える目的でスペースを使うことは、出来ないと思ったほうが良い）
半角スペースを連続して入力しても、半角スペースひとつ分としてブラウザは認識します。
半角カナは、文字化けする可能性があるため、常識的には使用しません。
Windows は、半角大文字と半角小文字を識別しませんが、サーバー上のＯＳの多くは、それを識別するため注意が必要です。

ＨＴＭＬを編集するには

ＨＴＭＬファイルを作成するには、「メモ帳」にＨＴＭＬを記述して、そのテキストファイルの拡張子.TXTを.htmlに変えれば良い。では、それを編集する場合はどうするのでしょう。
それは、メニューバーの「表示」→「ソース」で表示された「メモ帳」の内容を編集し、それを上書き保存すればＯＫ。ツールバーの「更新」を押すことで、編集されたページが表示されます。
上記の方法を利用すれば、新規のＨＴＭＬファイルを作成する時も、一々拡張子を書きかえる必要がなくなります。
まず、ベースとなるＨＴＭＬファイルを作成し、それの複製を「コピー」で作ります。この複製のＨＴＭＬファイルの内容を編集して、最後に、ファイル名を変更すれば、新規の新規のＨＴＭＬファイルを作ったのと同じことになります。

拡張子は .htm それとも .html ？
どちらを使っても大きな問題は生じませんが、しいて言えば・・・
Windows3.1 以前のＯＳでは、拡張子は３文字と決まっているため .html は認識されません。
トップページのファイル名は index.html が主流のようです。ホームページスペースによっては、index.htm が使えない場合があるようです。（逆もあり得ます。）
※ いずれにしても .html と.htm を同一のホームページスペースの中に混在させることは避けるべきです。○○.html と ○○.htm は別のファイルとして認識されるため、リンクを張る時に間違いの元となります。

記述する文字は、大文字それとも小文字？
どちらを使っても大きな問題は生じません。
今までは、大文字が主流だったようですが、ＨＴＭＬの将来形であるところのＸＭＬでは、小文字が標準とされています。
※ 大文字か小文字かということよりも、むしろサーバー上のＯＳの多くは、大文字と小文字を識別するということを意識してＨＴＭＬを記述することが大切です。画像処理ソフトが、勝手に画像ファイル名、特に拡張子を大文字○○.JPG としたために、表示されないといったトラブル事例を良く耳にします。（ＨＴＭＬには、○○.jpg を表示するよう記述したため。）