HTMLファイルを作る。
HTMLとはハイパーテキスト形式のファイルを、専用のプラウザで表示させるための言語です。そしてそれを書くにはエディタが必要です。最悪標準装備のメモ帳でも良いのですが、フリーソフトのエディタもありますしシェアウエアの秀丸なら最高です。取りあえずメモ帳と言う場合は編集の右端で折り返すをクリックしてください。
基本の型から色々な場面を想定して書いてみました。rei . rei1. rei2. rei3 rei4 と進んでいきますが、この画面ではちょっとした説明とタグの説明にとどめます。私が作ったファイルをダウンできるようにしましたのでそれをエディタで見てください。最初からリンクを張っていきますから例えばフロッピーに取っていけばプラウザで順に見る事ができますし、画面の表示→ソースで書いてある事を見る事もできます。
ここにファイル(html.lzh)を入れておきます。ダウンしたらフロッピーにでも入れて解凍してください。中のファイルがでてきます。この説明自体も入れてあります。
基本の型
<html>
<title>基本の型</title>
<body>
本文、画面上の文字や絵、写真などがここに入ります。
</body>
</html>
ここまでです。気づかれましたか<***> </***>ここからここまでと言う記号です。これからもどんどんでてきますが、ほとんどこうなっています。
例題1、本文に文字を入れて、リンクを張る。
<p></p>段落記号です。
<font size="5"></font>この間の文字の大きさを決めます。これで囲まなければ普通サイズの文字になります。
<br>これは単独で使います。強制改行です。
<p align="center"></p>間の文字を中央に表示します。その中に<br>で改行しているでしょう。
文章の何行かまとめて中央にしたい時はその文章の頭と最後に<center></center>
<p align="right"></p>間の文字を右表示ですね。段落記号と右表示の合わせ
<font color="#0000ff"></font>文字の色の指定です。
<font size="5"color="#0000ff"></font>上のタグに文字サイズを追加したとこ
#000000 黒 #ffffff白 #ff0000赤 #00ff00 緑 #0000ff青 #ffff00黄と言うように光の三原色で０(ゼロ)からｆまでを使って指定していきます。またfont sizeは１から７までを指定できます。
<a href="rei2.html></a>リンクです。間の文字をクリックするとこれだとrei2.htmlを呼び出します。
表示を右にしたり左にしたり大きくしたり小さくしたり色を変えたりしてみてください。感じがわかってもらえると思います。
例題２ 壁紙、画像のサイズ変更、文字との関係
<body bgcolor="#FFFF00"background="korotyan.jpg">こうすると最初に黄色の壁紙が出てそのあとすぐにkorotyan.jpgの壁紙になります。それ以外にもテキスト文字の指定、リンク色の指定、リンクをクリックした時の色の指定などできます。
<img src="*****.jpg">この指定でここに****.jpgの画像が張り付きます。
２番目の絵は中央に表示し(文字の中央と同じ）しています。
整理のためにphotoと言うフォルダを作った場合DOSの場合だとphoto\korotyan.jpgとなるところですが、このファイルを送る先はUNIXですから￥の変わりに／を使用します。photo/korotyan.jpgになります。
3番目の絵はサイズを指定して枠を付けてみました。widht="155"height="120"と言うところがサイズの指定です。外枠は<table border="10"></table>枠の幅、<tr></tr>行の定義<th></th>見出し、あと<td></td>データがあります。
4番目の絵は文字の周り込みです。<img src=**** **** **** align="left">で絵の右側に文字がつきだします。"right"左側に文字が付く。それを解除するのが、<br clear=all>
例題3 音楽を入れて、壁紙を張ってみました。
</title>と</head>の間に<bgsound src="jazz_d.mid" loop="1">大体分かりますね。midフォルダ内のjazz_d.midを呼び出しています。loop="1"一回、2にすれば2回になります。
<body link="#888888"vlink="#ff00ff"alink="ffff00"background="bak.jpg">
link リンク表示の文字の色を指定しています。
vlink 行ったことのあるリンクの色の指定
alink リンクをクリックした時の色の指定
bak.jpgを呼び出しています。これが壁紙
例題4 いままでやってきたことを使って文字を入れて書いてみました。
ここでは特別はないです。インデントを使ったのと他の人のホームページへのリンクくらいです。
<blockquote></blockquote>インデント、囲まれた部分はすべて影響されます。
他のホームページリンク<a href="http://www.japan-net.ne.jp/~masuda/">GO</a>ちょうどGOと書いたところが画面上ではマウスが手の形になる位置ですね。
大事なこと
いままで色々なタグを使ってきましたが、まだまだいっくらでもあります。これをすべて覚えるのは時間の無駄とは言わないけど大変。
私の場合だと最近はイクスプローラ４に付いているFrontPageExpressを使っています。ほとんどこれだけでタグはできてしまいます。そして細かい修正を覚えたタグを入れています。わからない時は他の人のホームページを見てその中の表示→ソースを見てということもあります。HTMLと言う本がパソコンコーナーには必ずあります。
先ずは御自分のを作って見てください。でないとワカランところがワカランでは前に進めませんからね。フロッピー上で作っても一応体験はできますから。
ファイル名には充分注意してください。サーバーのコンピューターは大文字小文字識別します。よくあるんですよ。index.html と index.HTML これファイル名が別のものです。***.gif ***.GIF
最後になってしまいましたが、一番メインになるファイルは index.html としてください。あなたのホームページにアクセスした時にまずここに入ります。その後はお好きなファイル名でいいですよ。