ホームページの作り方（初級編２）

１，表
２，動く文字
３，上／下付き文字
４，ＭＥＴＡ

１，表
MSIE3.0 ○
NN3.0 ○

<TABLE BORDER=1 CELLPADDING=6 CELLSPACING=6>
<TR>
<TD>最初<／TD><TD>ｆｉｒｓｔ<／TD>
<／TR><TR>
<TD>次<／TD><TD>ｎｅｘｔ<／TD>
<<／TR>
<／TABLE>
と書くと

最初 ｆｉｒｓｔ
次 ｎｅｘｔ

BORDERを０にすると線が消えます。CELLPADDINGは文字と表の間隔、
CELLSPACINGは線の太さと、なります

他に、一部分だけ枠を無くしたい場合があります。
そのときCOLSPANやROWSPANを使います。

COLSPANは、横に何列分確保するかというのを指定します。
<TD COLSPAN=2>次</TD>

先ほどのものをこのようなものに変更すると、

最初 ｆｉｒｓｔ
次

また、ROWSPANは、縦に何行分確保するかというのを指定します。
<TD ROWSPAN=2>最初</TD>
先ほどのものをこのようなものに変更すると、

最初 ｆｉｒｓｔ
次

ただし、確保した分だけ<TD>？？？</TD>をなくす必要があります。

色

MSIE3.0 ○
NN3.0 △セルはＯＫだが、枠は不可

まずデフォルトの色ですが、MSIEは基本的に白です。
ただし、背景が白っぽいときは灰色になります。
Netscapeは背景の色を暗くした色になります。
ただし、かなり暗くしたとき(#000004以下)は白になります。

各セルの背景を指定することができます。

<TD BGCOLOR=#132456>

と指定することによって

ＴＤに設定したとき ＴＤに設定したとき
ＴＲに設定したとき ＴＲに設定したとき

BGCOLORをＴＤに設定するとセルごとに色を付けられたのですが
ＴＲに設定すると行全体が、最初のＴＡＢＬＥで設定すると表全体になります。

また、外枠にも色が設定できます。(MSIEのみ)
ＴＡＢＬＥのところに BORDERCOLOR=#00aa88というのを加えると

ＴＤに設定したとき ＴＤに設定したとき
ＴＲに設定したとき ＴＲに設定したとき

しかし、これだと立体感がありません。
そこで、枠の明るい部分をBORDERCOLORLIGHTDで色を指定するか
暗い部分をBORDERCOLORDARKで指定します。
(これらのどちらかと先ほどのBORDERCOLORを組み合わせます。)

ＴＤに設定したとき ＴＤに設定したとき
ＴＲに設定したとき ＴＲに設定したとき

ＣＧの背景

MSIE3.0 ○
NN3.0 ×

MSIEは背景にGIFやJPGファイルの絵を

background="line.jpg"

加えることによって表示できます。
TABLEに加えると全体、TDに加えるとそのセルのみといった具合です。

全体に 上の「Line.jpg」が
表示されます。 　

上上へ

２，動く文字

点滅

MSIE3.0 ×
NN3.0 ○

<BLINK>点滅</BLINK>

とすると

点滅

このように点滅します。
但し、この機能はNetscape独自の機能です。

MARQUEE

MSIE3.0 ○
NN3.0 ×

<MARQUEE>流れる</MARQUEE>

とすると

流れる

このように流れます。
但し、この機能はInternet Explore独自の機能です

細かな機能では、BGCOLORで背景の色、WIDTHでスクロールする幅を指定します。例えば、

<MARQUEE BGCOLOR="#00ffaa" WIDTH="100">流れる</MARQUEE>

流れる

このようになります。

上上へ

３，上／下付き文字
MSIE3.0 ○
NN3.0 ○

数学では、指数というものを多用します。
そのときは次のようにしてください。

ｘ<sup>２<／sup>

すると、

ｘ2

になります。但し、「上付き」に対応しているブラウザはＨＴＭＬ３．０という
規格に対応している必要があります。以下のブラウザであればＯＫです。 

Ｎｅｔｓｃａｐｅ　３．０　以上
Microsoft Internet Explore　３．０以上

また、数列を使うことがあると思うのですが、次のようにしてください。

ａ<sub>ｎ<／sub>

すると、

ａn

これに対応しているブラウザも同じです。
これらを駆使すれば積分もできます。

∫<sub>０<／sub><sup>１<／sup>ｘｄｘ

∫01ｘｄｘ

もう少しはなしたいときは重ねます。

∫<sub><sub>０<／sub><／sub><sup><sup>１<／sup><／sup>ｘｄｘ

∫01ｘｄｘ

以上のようになります。

上上へ

４，メタ

メタ（ＭＥＴＡ）には、「情報を付け加える」という目的があります。
ＭＥＴＡタグはＨＥＡＤのタグ内に記述します。

文字セット

MSIE3.0 ○
NN3.0 ○

「文字化け」という言葉を聞いたことがあるでしょうか？
現在、日本語文字コードは「S-JIS」「JIS」「EUC」があります。
EUCで書かれた文章をSJISで見ようとすると訳の分からない記号が表示されます。
インターネットの世界ではEUCとSJISが混在しているのですが、EUCで見るか
SJISで見るかというのはブラウザが自動判定しています。
しかし、完璧ではありません。(特にMSIEが悪評高かった)
そこで、「この文章は××で書かれています。」と明記するのが次のタグです。

××がS-JISの場合

<meta http-equiv="Content-Type" content="text/html; charset=x-sjis">

××がEUCの場合

<meta http-equiv="Content-Type" content="text/html; charset=x-euc-jp">

××がJISの場合

<meta http-equiv="Content-Type" content="text/html; charset=iso-2022-jp">

これらは、「文字コードが××で、HTML文章です。」と明記しています。
なお、このように文字コードを変更すると、ブラウザ側で文字コードの変更ができません。 そのため、文字コードは間違えないようにしてください。

ファイルに対する返事

MSIE3.0 ×
NN3.0 ×

このHTMLファイルに対する返事を明記したいときは次のようにします。

<meta http-equiv="Reply-to" content="ael@super.win.or.jp">

content以下にはみなさんのメールアドレスを書きます。
なお、この機能に対応したブラウザは現在のところありません。

ロボット対策

MSIE3.0 −
NN3.0 −

ＭＥＴＡには「name」という属性があります。
これが指定されると、ブラウザはその内容を無視します。

「ロボット対策」ですが、サーチエンジンのInfoseek,Goo,Infonaviなどは
ロボットが自動的にホームページを見てその内容をからKeywordを探します。
そこで、効率的にKeywordを見つけてもらうため次のようにします。 


<meta name="description" content="ホームページの内容 "> 
<meta name="keywords" content="キーワード">

たとえば次のようにします。 

<meta name="description" content="ＨＴＭＬファイルの作り方を説明します。 "> 
<meta name="keywords" content="HTML,タグ,meta,table,表">

ロボット対策２

MSIE3.0 −
NN3.0 −

ロボットは自動的にホームページを見て、そのデータをデータベースに
加えていきます。しかし、データベースに登録されると不特定多数の人に
そのページを見られることになります。

もし、データベースに登録されたくない場合は次のタグを加えてください。 


<meta name="ROBOTS" CONTENT="NOINDEX, NOFOLLOW">

このタグの「NOINDEX」は「データベースに加えない」という意味があります。
「NOFOLLOW」は「リンク先を追跡しない」という意味があります。

戻るNoteに戻る