HTML編 06/51
| 目的別 index | タグ別 index | カラーチャート | images | SAMPLE |
とりあえずやってみよう
HTMLファイルを作る
ブラウザに表示する




HTMLファイルを作る

●<HTML>
長々と前置きばかり書いてしまいましたが、とりあえずHTMLファイルを作ってみることにしましょう。
HTMLはタグで出来ていると前に書きました。そして開始タグと閉じタグによって挟まれた部分が表示されるとも書きました。そこで、HTMLファイルを作るのに、まずやらなければいけないことは<HTML>と</HTML>というタグで全体を挟むことです。この<HTML>開始タグと</HTML>終了タグに挟まれた部分がHTMLとして表示されるのです。ここからはみ出したもの(つまり<HTML>開始タグと終了タグの外にあるもの)は基本的にブラウザに表示されない物と思ってください。また、表示されてしまう場合もありますので、不要にHTMLタグの外に何か書き込まないようにして下さい。とりあえずメモ帳、もしくはシンプルテキストを開いて、<HTML></HTML>と入力しましょう。

●<HEAD><BODY><TITLE>
この<HTML>と</HTML>の中は2つの構造で出来ています。1つは「ヘッド」部分で、もう一つは「ボディ」部分です。
ヘッドの中にはこのファイルの定義を書き込みます。ブラウザには表示されませんが、例えばタイトルや、検索エンジンに登録する際のキーワードなどをここに書きます。もちろん「開始タグと終了タグで挟み込む」ことが基本ですから、<HEAD>と</HEAD>の中に書き込みます。
とりあえず、「練習」というタイトルを入れてみましょう。タイトルのタグは<TITLE>です。

<HEAD><TITLE>練習</TITLE></HEAD>

となります。
実際にブラウザに表示したい物をボディの中に書きます。ここは、とりあえず「こんにちは」と入力してみましょう。

<BODY>こんにちは</BODY>

これでHTMLファイルが出来上がりました。まとめると以下のようになります。
View
<HTML>
<HEAD>
<TITLE>練習</TITLE>
</HEAD>
<BODY>
こんにちは
</BODY>
</HTML>
この<HTML><HEAD><TITLE><BODY>タグは、HTMLを書く上で必須のタグです(場合によっては省略できる例外もありますが)。とりあえずこれらのタグはホームページを作る儀式と思ってください(笑)。
出来上がったらテキスト形式で保存します。お使いのソフトに「HTML形式」という保存項目があるなら、それでも構いません。保存名は好きな名前を付けてもらっても良いのですが、英字か数字以外の文字は使わないでください(全角の英数字も不可です)。「.html」の拡張子も忘れずに。HTML形式で保存した場合は、自動的に拡張子が付いているかも知れません。とりあえずここでは「test.html」という名前で保存したとします。




ブラウザに表示する

次にお使いのブラウザのメニューから「開く」で、今保存した「test.html」を開きます。いかがでしょう?上の「LOOK」ボタンを押した状態の物が表示されましたでしょうか?「表示されない」という方は、もう一度スペルミスなどを確認してください。

表示されたページのブラウザの上ヘリ部分に「練習」というタイトルがキチンと出ていますね?これが<TITLE>タグで指定した部分です。またこのタイトルはブックマークやお気に入りに追加した時、また検索エンジンに登録した際に記される文字ですので、とても重要なタグです。

「こんにちは」の部分を「こんばんは」に書き換えて保存し直してください。NNをお使いの方は「再読み込み」、IEをお使いの方は「更新」ボタンを押すと、ブラウザに「こんばんは」と再表示されるはずです。他にもタイトルを変えてみたり、先ほどやったタグ、
<CENTER><I><FONT SIZE="5" COLOR="red">こんにちは</FONT></I></CENTER>
などを入れてみるなど、色々といじってみてください。

どうでしょう。まだ1言だけですが、数行のタグを書いただけで立派に(?)ホームページが1ページ出来上がりました。

backindexnext