ホームページ文書の作成
［ ★ホームページ文書 ｜ ★HTML基礎 ｜ ★HTML基礎骨格 ｜ ★文章表現タグ ｜ ★絵 ｜ ★GIF変換 ｜ ★リンクの指定 ｜ ★例 ｜ ★様々なページ ］
●ホームページ文書について
l ホームページは、幾つかのファイルから成る。
l 一番重要なのは、内容そのものを示すページ用のファイルである。絵などがある場合は、別のファイルとして用意しておく必要がある。
l
ホームページ文書は、HTML言語と呼ばれる特定の規則（文法）に従った書き方をする。
ちなみに、携帯電話でのNTT i-modeではC-HTMLといって、少しだけ違う（サブセット）。また、J-PhoneのJ-Sky Webでは、MMLと呼ばれるC-HTMLに似たものが使われる。AUなどのEZ
Webでは、HDMLと呼ばれるHTMLとは若干違う言語が使われている。
Ø 参考；工芸大学の各種ホームページ；
l NTT i-mode用； http://www.t-kougei.ac.jp/i/index.html （現在J-Phone; J-Sky Web兼用）
l AUなど EZ Web用；http://www.t-kougei.ac.jp/ez/index.hdml
l
ブラウザには様々なものがあるが、同じページでも、ブラウザが違うと、若干見え方が変わってしまう。
●HTML言語の基礎
・ ホームページ文書はHTML言語と呼ばれる文法に従ってテキスト（文字）で書く。
・ 発信したい内容の文字を書き、これらにタグと呼ばれるマークをつけると考えればよい。
・ これらタグにより、例えば文字に色をつけたりすることができる。
・ タグは何十種類もあるが、簡単なものであれば、数個を覚えるだけでよい。
・ タグには、始まりと終わりの対になっているものと、単独の指定だけのものとがある。
●HTMLの基礎骨格
・ HTMLによるホームページ文書は、次のように書く。
<HTML>
<HEAD>
<TITLE>ここにタイトルを書く </TITLE>
</HEAD>
<BODY>
ここに内容を書き、テキストファイルとして保存する。また、
ファイル名の拡張子として、html もしくは htm とする。
</BODY>
</HTML>
・ 上記例でも立派に完成されたホームページである。
・ 赤色で示した「<>」で囲んだものがタグといわれるもので、上記タグは全て、始まりと終わりのあるタグである。
・ <HTML>と</HTML>の間にページ内容の全てを書く。
・ <HEAD>と</HEAD>の間にページ概要に関するタグ及び内容を書く。
・ </HEAD>以降、</HTML>の間に<BODY></BODY>タグを書き、この間にページ内容（コンテンツ）を書く。飾りも何も必要がなければ単純にここに文字を書けばよいだけ。
●文書表現のためのHTMLタグ
・ <HR>タグ；区切り線（横罫線）を表示するためのタグ。
・ <BR>タグ；改行を指定するためのタグ。通常HTML内で書いた文が表示される時は、ウィンドウの右端で折り返される。強制的に改行を指定する際には、このタグを書く。
・ <Hn>タグ；nは数字で１〜３。見出しを書く際に大きさを指定するタグ。
・ <B></B>, <I></I>, <U></U>タグ；囲まれた文字の文字飾り（それぞれ太字、斜体、下線）を指定するタグ。
・ <FONT></FONT>タグ；間に書いた文字に対して、フォント情報（文字の飾りなど）を指定することができる。実際には、次のように使用する。
Ø <FONT SIZE=”+2”>大きな字</FONT>、<FONT SIZE=”-2”>小さな字</FONT>、
Ø <FONT COLOR="#ff0000">赤色の指定</FONT>
Ø 色は１６進数６桁で指定する。
Ø COLOR以外にも幾つか飾りなどを指定できる。
・ <CENTER></CENTER>タグ；囲まれた文字を画面中央に位置するよう指定するタグ。
・ <UL><LI></UL>タグ；リスト（箇条書き）表現の指定のためのタグ。
Ø <UL>と</UL>で囲まれた中で、<LI>が箇条書きを示す。
Ø もちろん、<LI>はいくつ書いてもよい。
●リンクの指定
● ホームページの醍醐味は、様々な所（文字や絵）にリンクが設定（「張る」と表現される）できることが大きな要因となっている。
● リンクとは、その指定された場所をマウスでクリックすると、どこか違うページなどが表示（「飛ぶ」と表現される）される。通常の文章は、上から下に順番に内容が書かれているだけであるが、このようなリンクの実現によって、ハイパーテキストと呼ばれる構造にすることができる。
● ホームページにおけるリンク先として指定できるのは、ページ内の特定の場所、同じ場所（フォルダ）の別のファイル（ページや絵など）、また全く別の場所にあるインターネット上の全てのホームページなどである。
● ネットサーフィンという言葉があるが、これは、リンクを辿っていくと、いつのまにかアメリカのサイトだったり、ヨーロッパのサイトだったりと、インターネット上をあちこちと辿っていくことをあらわしている。
● HTMLにおけるリンクの指定は、<A></A>タグで指定する。他ページへのリンク指定方法は次の通り。
l <A HREF=”http://www.t-kougei.ac.jp/”>ここから飛べます</A>
l 上記のようにすると「ここから飛べます」という文字部分にリンクが張られており、ここをクリックすると、ホームページアドレス（URL）「http://www.t-kougei.ac.jp」へ飛ぶことができる。
●HTML文書内の絵の指定
・ HTML文書そのものはテキストファイルであり、絵などの情報を直接入力することはできない。
・ ホームページで絵などを表示させたい場合は、それら絵などを別のファイルとして保存しておき、そのファイルをHTML文書の中で指定すればよい。
・ 絵のファイルは、通常GIF形式と呼ばれるもので作成しておく。
・ 絵のファイルの表示を指定する場合、<IMG>タグを使用する。
・ <IMG>タグの具体的な指定方法は次の通り。
Ø <IMG SRC=”test.gif”>
Ø このようにすると、このタグを指定した場所に、「test.gif」ファイルの絵が表示される。
●GIFファイルの作成（Bitmap形式ファイルからの変換）
● PC2演習室では、残念ながらGIFファイルを直接作成できるお絵描きソフトがない。
● そこで、まずBitmap形式で簡単な絵を書き、次にこれをGIF形式のファイルに変換する。
●
Dibas32 というツールをここでは使用する。
● Dibas32によりビットマップファイルを開き、
● 「ファイル」メニュー→「名前を付けて保存」を選択する。
● 保存形式に「GIF」を指定して、保存する。
● （インターレース、透明GIFはここでは無視して構わない）
●HTMLによるホームページ文書作成例
● 上記で解説したHTMLの基礎的なタグを用いたホームページ文書の作成例を示す。
● 作成結果はここから見ることができる。ブラウザで閲覧し、ソースを見れば、どのように書かれているかを知ることができます。同じ物は下からみることもできます。
● 作成ファイル(test.txt)は、こちらから。これを、拡張子.htmlとして保存すれば、そのまま自分のものになる。
●ホームページ作成（HTML）支援の様々なページ
・ http://www.seaple.icc.ne.jp/~hama/home/index.htm
・ http://www.geocities.co.jp/SiliconValley/6725/index.html
・ http://www.mitene.or.jp/~k-numa/html/index.html
・ http://www.urban.ne.jp/home/kibochan/html.htm
・ http://clip.yokohama-cu.ac.jp/~yamaguchi/frame/frame.html
・ などなど、とてもたくさんのページでHTMLを含むホームページの作成方法が紹介されているので、興味があれば、参考にしてみよう。また各種サーチエンジンで探してみよう。
［ ★WWWとは ｜ ★原理 ｜ ★使用方法 ｜ ★閲覧・検索 ｜ ★注意事項 ｜ ★ネットニュース ｜ ★Telnet&FTP ］
情報処理教育研究センターの授業のページ 情報処理教育研究センターのホームページ 東京工芸大学のホームページ