雛形を作成する

Next: 写真を載せるためのタグを書く Up: 実習 Previous: 復習

はじめに述べたことと矛盾しますが, HTML文書の基本を覚えるために, コピーによらずに, 雛形を一から作成します.

emacs を起動します.
作成するファイル名を指定します. ファイルは, 先程作ったフォルダ「fellows」の中に作成しますのでC-x C-f の後, この場合, ホームフォルダから見ると WWW の中の fellows の中のファイルなので,「WWW/fellows/fellows.html」としてENTERキーを押します.

1行目に文書型定義を書く.

      <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">

次に, <html>, <head>, <body>, <title> などの基本タグの開始タグと終了タグを書いて下さい. <html> には言語指定をして下さい. 終了タグ</html> の場所にも注意して下さい. HTML文書の改行はWebページには反映されないので, タグとタグの間は見やすいように改行を入れて下さい. (それぞれどの場所に書くかを忘れた人は, この講義の Web ペイジの過去のテキストか, 参考書を参照する.)
タグ<head>と</head>の間に文書の内容と文字コードを示すメタタグと, スタイルシート指定のためのリンクタグを書きます.
```
  <meta http-equiv="Content-Type" content="text/html;charset=ISO-2022-JP">
  <link rel="stylesheet" type="text/css" href="fellows.css">
```
同じくタグ<head>と</head>の間に次の文を書く.
```
  <title>Fellows</title>
```
次にタグ<body>と</body>の間に次の見出しを書く. (x には, 適当な数字を入れる.)
```
    <h1> 基礎ゼミ x組のメンバー </h1>
```
全て書き終ったら, C-x C-s で保存します(このファイルに, いろいろ書き加えますので, Emacs は終了しないで下さい).

雛形が正しく作成出来たかどうかを Firefox で確認します. 「fellows」フォルダの「fellows.html」をダブルクリックして下さい. 次を調べて下さい.

上記のように表示されない場合は, emacs でファイル「fellows.html」の内容を確認し, 必要があれば修正して, firefox の再読み込みのボタンをクリックします.

Next: 写真を載せるためのタグを書く Up: 実習 Previous: 復習

2009-06-10