Of ChaichanPapa-World !

Home/Menu

ストリクトなHTMLの基礎講座

正しいHTMLについて

◆ はじめに

私はつい最近、今までのHTML認識に間違いがあることに気づきました。 きっかけは、とほほさんのラウンジでのスタイルシート論争です。

まず、はじめに、皆さんのHTML認識度は、どのぐらいかクイズいたしましょう。 以下で、正しいと思った項目にチェックをして、最後に評価ボタンを押してください。(100点満点)

◆ 正しい HTML についてのクイズ

  1. HTML文書(ソース)は<HTML>タグで始まる。
  2. <TITLE>タグは別になくてもかまわない。
  3. <H1>〜<H6>タグは文字の大きさで使用する。
  4. 見出しは<FONT>タグで カッコよく見せよう。
  5. <blockquote>タグはインデントにして見やすくする。
  6. テーブルタグは表よりレイアウトに使うとカッコイイ。
  7. 文書の改行は<P>タグと<BR>タグである。
  8. 「リンクはここです」のここに当然張るものだ。
  9. フレームを使ってカッコよく見せよう。
  10. <IMG>タグのALTはソースサイズが大きくなるので省略。

◆ 結果

さて、あなた何点でしょう。

実は、上記はすべてNGです。(チェックがあればあるほどHTML認識が悪い)

つまり、すべて間違った HTML の使い方です。 しかし、今現在の本サイトですべて採用しています。こだわりが有りませんでした。反省しています。 なんたって、ホームページ(実はこれもウェブページという)作成の手ほどきサイトですから...。 そこで、以下のサイトでHTMLの勉強をし直しています。私は...。 100点採れなかった人は、私と一緒に再勉強を致しましょう。

本サイトも徐々に「正しい HTML」に修正していきます。

将来的には、皆さんの手本になれるようなサイトにしていきたいと思っています。 また、全部の修正が終わったら、本サイトの全HTML文書を一括ダウンロードできるようにしたいです。

◆ 正しいHTMLについての私の認識

はじめに、あくまでも私の認識であって、間違っているかも知れません。それを考慮してお読み下さい。

まず、ホームページ作成において3者がいます。

まず、はじめから W3C を意識してホームページを作成している人はいないでしょう。 でも、ブラウザへの表示は意識しますよね。 つまり、HTMLの仕様なんて関係ないんです。ブラウザへの表示がすべてなのです。(初めの内は...)

でも、HTMLだけで見栄えのよいホームページを作成しているとおかしなコトに気づき始めます。 見栄えをよくする為に、blockquoteタグやtableタグを多用しHTML文書がどんどん複雑化していきます。 また、これらのタグは日本語訳だと「引用タグ」「表タグ」です。 なんか、おかしいな...。って。

そこで、HTMLの仕様を勉強しはじめるわけです。そうするといろいろわかってきます。 いちばん大きいのは、HTMLがSGMLのサブセットだということです。

SGMLは文書の要素を「構造」、「内容」、「見栄え」に分離して文書をデータ化する仕様です。 当然、サブセットあるHTMLはそれを受け継ぎます。

つまり、1番目の作成者本人は、HTMLでコンテンツを表現している以上この仕様に従わなくてはいけません。 (知ると知らざるに関わらず)
そして、

  1. 文書の「構造」は HTMLでマークアップし、
  2. 文書の「内容」は わかりやすい表現で記述し、
  3. 文書の「見栄え」は CSS(スタイルシート)で指定する。

これが、正しいホームページの作成方法であり、ホームページ(文書)の構造をマークアップするのが 正しいHTML と云うことです。

しかし、現状では、ブラウザのCSS不完全対応などで、なかなかそうはいきません。 そこで、私は割り切りました。「構造」はしっかりと「見栄え」は適当にです。

具体的には、「構造」はHTML(タグ)で、「見栄え」はCSS(スタイルシート)で記述し、 IEで「見栄え」をチェックし、かつ ネスケでスタイルシートオフでおかしくなければOKとします。 皆さんは、真似しなくても結構ですが、将来を見据えた時に、今からこのクセを付けておくことお勧めします。

◆ おわりに

最後にクイズの簡単な回答をしときます。

  1. DOCTYPE宣言からHTMLは始まります。(<!DOCTYPE HTML〜〜)
  2. HAEDタグを記述した場合はSGML的に必須です。(でも、ブラウザはチェックなし)
  3. <H1>〜<H6>タグは階層的なレベルの見出しで使用します。
  4. HTMLで見栄えを整えてはいけません。<FONT>タグはHTML4.0のStrictでは破棄されました。
  5. <blockquote>タグはあくまでも引用でインデントではありません。(自分の文章が他人のになっちゃう)
  6. (4)と同様。だたし、本来の表で使用すればOK。
  7. <P>は段落の意味で改行ではありません。(スタイルシートが勘違いしちゃう)
  8. これは「here症候群」というそうです。リンクは名詞や代名詞にしましょう。
  9. 本当に必要な場合以外、やめましょう。メリットはありません。(サイトが複雑になるだけ)
  10. <IMG>タグのALTは必要ですね。必ず的を射た説明文にしましょう。

Home/Menu/HTML概説リファレンス