ホームページ作成上のポイント
タグは半角・小文字で書く
タグは、半角で記述しないといけません。
また、将来を見据えると、大文字より小文字で書いておいた方が良いです。(今後、そのようになる模様。)
構造と表現の分離
現在の標準では、HTML文書の構造要素と表現要素は分離するものとされています。
<font>タグや、<center>タグなどは、非推奨要素です。
なるべくこれらは使わずにスタイルシートで代替しましょう。
例えば、
<font color="red">赤い文字</font> ならば、
<span style="color:red;">赤い文字</span>としましょう。
CSS(スタイルシート)の薦め
CSS(Cascading Style Sheet)(以下スタイルシート) とは、
HTML文書の構造要素と表現要素を分離する場合に指定して使われます。
スタイルシートを使うことにより、様々な表現が実現でき、またHTMLソースも軽くなり、
さらに外部スタイルシートを使えばホームページを模様替えする時に非常に楽になります。
例えば、スタイルシートを使うと、このようなテーブル風レイアウトや、
半ば強引に、こんな絵も描けます。
外部スタイルシート
外部スタールシートとは、HTMLファイルとは別に「〜.css」というファイルを作成し、
HTMLファイルからこの「〜.css」ファイルを読み込むことでスタイルシートを適用させるものです。
これを利用すれば、一度に、適用させた全ページの壁紙を替えたり、テキストの色を変更したり出来るのでとても便利です。
なので、これからホームページを作るなら外部スタイルシートの利用を強くオススメします。
1.外部CSSファイルの作り方
メモ帳などのエディターを開き、body{color:#666;}
などのようにスタイルシートの部分だけを記述します。
例えば、body全体の文字色を[#666]で、背景色を[#ffc]とするなら
body {
color:#666;
background-color:#ffc;
}
と記述します。 そして、「任意のファイル名.css」として保存します。 「任意のファイル名」のところは、半角英数でつけてください。 この保存したCSSファイルはHTMLファイルと一緒にサーバーへアップロードします。
2.外部CSSファイルの読み込ませ方
これは、適用させたいHTMLファイルの<head>〜</head>タグ内に、これをを記述するだけです。
<link rel="stylesheet" href="任意のファイル名.css" type="text/css">
この他に、外部スタイルシートに記述すると便利なものとしては壁紙があります。これは、body全体に適用する場合なら、 下のように記述します。
body {
background-image: url("壁紙ファイルのURL");
}
色を工夫する
Red #ff0000 |
Yellow #ffff00 |
Lime #00ff00 |
Aqua #00ffff |
Blue #0000ff |
Fuchsia #ff00ff |
Maroon #800000 |
Olive #808000 |
Green #008000 |
Teal #008080 |
Navy #000080 |
Purple #800080 |
Black #000000 |
Glay #808080 |
Silver #c0c0c0 |
White #ffffff |