HTMLの書き方(1)
≪---- TOP ----  ----  ---- 先行者 ----  ----≫
prevcontentsnext
バージョン宣言
HTMLを書くときに、一番最初に書く項目です。
これの書き方で、以後の記述方法・出切る事が変わってきます。

実を言うと、HTMLというのは、
イイカゲンに書いても、ある程度ちゃんと表示されたりします。
このバージョン宣言とかが代表例で、実際書かない人も多いんですが、
厳密に書いたほうが、ブラウザごとの見栄えの違いが少なくなるのは確かです。

とりあえず、最初のうちは、丸写しするだけでいいでしょう。
内容も説明していますが、分からなくても気にしないでください。
以後紹介する三種類の中から一つ選び、
<〜〜〜〜>
の部分をコピー&ペースト(コピーして貼り付け)してください。
手書きでもいいですけど、コピーの方が楽です。

バージョン宣言と言ってもいろいろあるのですが、
ここではHTML4.01を使います(これしかわかんない(ぇ
種類は三つ。
☆HTML4.01 Strict☆

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">


このページで使っています。
この講座では、基本的に、これに基づいて説明していきます。
XHTMLなど、新しい方式に順応しやすい意味でも、
これで進めていくのが無難だと思います。
XHTMLは私も勉強中なので、いきなりそれで書きたい人は、
各自で勉強してください(^^;

厳密で、自由度が低く、フレームが使えません
……という建前ですが、実際、性能の良いブラウザだと、
結構イイカゲンに書いても、規定外の内容であっても、表示されてしまいます(^^;
フレームも使えたりするんですよねー(汗)
……やらない方が無難ですけど。
☆HTML4.01 Transitional☆

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">


Strictより自由度が高いです。ただ、フレームは使用不可
(インラインフレームは可)
これも同じく、イイカゲンでも表示されます(^^;
☆HTML4.01 Frameset☆

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">


Transitionalにフレーム機能がついた、と考えればよいでしょう。
同じく、イイカゲ(略
<html lang="ja">〜</html>
次に書くのが、
<html lang="ja">
<head>
</head>
<body>
</body>
</html>

です。
とりあえず、丸写ししてくれればいいです。
このページの最後に、此処までの必要最低限のソースが記載されています。

初心のうちは、細かい意味内容の理解より、
実践重視でノウハウを積む方が効率がいいので、
今は意味がわからなくても、とりあえず書いてさえあれば問題ありませんが、
一応、極簡単な説明をすると、

<html lang="ja">
「html」は、「ここからHTMLの内容を書いていきますよ」と言う意味。
「lang="ja"」は、「このHTMLファイルは日本語ですよ」と言う意味です。

<head>〜</head>
<head>は、「ここから文書情報を書いていきますよ」と言う意味。
</head>は、「ここで文書情報の記述が終わりますよ」と言う意味です。
文書情報とあるように、この<head>と</head>の間にも、
いろいろ書く必要がありますが、それは次のページで。

<body>〜</body>
<body>は、「ここから文書本体を書いていきますよ」と言う意味。
</body>は、「ここで文書本体の記述が終わりますよ」と言う意味です。
この<body>と</body>の間に、表示させたい内容を書き込んでいきます。

</html>
「ここでHTMLの記述が終わりますよ」と言う意味です。

これで、大体の骨組みは出来ました。
この次から自由度がだんだん高くなっていくので、
ページを移して説明します。
此処までのソース(必要最低限)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
</head>
<body>
</body>
</html>
prevcontentsnext