htmlの本場ってどこだろう。


htmlの本場はどこなのだろうか、W3Cを覗いてみよう。
つまり、W3Cの書き方を学べば、きっとそこには本場の味がある。
ブログのから、ちょっと範囲が大きくなりすぎるかもしれないが、覗いてみて損はないだろう。

http://www.w3.org/ を開いてみよう。

2000年頃には、W3Cのウェブページも、テーブルタグで、レイアウトが行われていた。
現在では、ページは、3列構成だ。ブラウザのサイズに対応して、列幅が自動的に追従する。IE’7では、最小幅の為の何らかの手順は撮られていない。3カラムフロートレイアウトと呼ばれるもの。

ソースを見てみよう

<meta name="generator" content="HTML Tidy for Mac OS X (vers 1st March 2004), see www.w3.org" />
 tidyというプログラムでドキュメントが作られているようだ。

tidyをインストールしてみる。

tidyは、htmlを検証して、コマンドで、修正したhtmlを、書き出してくれるツールのようだ。

http://idena.jp/2006/09/html_tidy_1.shtml にいくと、ちゃんと用意してくれている人がいる。幸せなこと。

ダウンロードしたファイルを使ってみる。

  1. c:\tidy というホルダを作成して、その中にダウンロードしたファイルを、置いた。
  1. test用のhtmlを用意する。
    • sample.html

このファイルは、http://www.tenman.info/c_std_html/ から、html4.01transitionalをダウンロードした。
 この文書は、euc を使っている。ヘルプでは、文字コードは、Shift_Jisと、UTF-8があるだけなので、-raw というオプションを使った。
h3とliタグの終了タグの中から/を削除した。

  1. スタートメニューから、全てのメニュー アクセサリから、コマンドプロンプトを起動させる。


Microsoft Windows XP [Version 5.1.2600]
(C) Copyright 1985-2001 Microsoft Corp.

C:\Documents and Settings\hoge>cd c:\tidy
C:\tidy>tidy -output result.html -raw sample.html


result.htmlに修正されたhtmlが表示された。
result.htmlはきちんと終了タグが補完されていた。

もう少し、htmlを見ていこう。

ネットで、htmlタグについて調べてみると、htmlに良い書き方と、悪い書き方があるというのはなんとなくわかるけれど、どういう使い方が、良くて、どういう使い方が、悪いのかを知りたいと思うと、突然探しにくくなる。

 誰も、ソースを見て重箱の隅をつつくような事をしたくもないが、こういうもので、推学するしかないというのも、htmlの特徴だったりすると思った。


以下のソースが目に留まる。
1. <div id="x20061115b" class="item">

2. <h3 class="headline"><img alt="" width="17" height="11" src="/Icons/right" />XInclude 1.0 Second Edition Is a W3C

3. Recommendation</h3>

4.

5. <p><span class="date">2006-11-15:</span> Today the World Web Consortium

6. released <a href="/TR/2006/REC-xinclude-20061115/" shape="rect">XML Inclusions

7. (XInclude) Version 1.0 Second Edition</a> as a Recommendation. Produced

8. as a convenience to readers, the second edition is intended to correct

9. all known errata in the 2004 <a href="/TR/2004/REC-xinclude-20041220/" shape="rect">XInclude 1.0 Recommendation</a>.

10. XInclude is a generic mechanism for merging XML documents (information

11. sets) using existing XML constructs ? elements, attributes and URI

12. references. Visit the <a href="/XML/" shape="rect">XML home page</a>. <span class="archive">(<a rel="details" title="XInclude 1.0 Second Edition Is a W3C Recommendation" href="/News/2006#item176" shape="rect">News archive</a>)</span></p>

13. </div>


1行目、id とクラスが併記されている。
スタイルを指定するだけなら、別に、クラスを指定するだけでも書ける。
idの値は、一度しか出現できない固有の値でなくちゃいけない決まり。
クラスは何度でも書ける。クラスとid両方にスタイルを書くと、idが優先する。
 併記する理由はどこにあるのか、
このブロックは、日付に基づいたエントリーだから、固有のidが表記され、共通の、多分エントリ共通の、見栄えが指定されているから、クラスも指定されているのだろうと気づく。

8行目のspanの使い方。日付をクラスで、明示している。

私には、じゃ俺もやってみようと思うパターンですが、
ほかの人から見れば、「なんか、病気なんじゃないの?。」といいたくなったり、
「所詮htmlなんて、枯れてしまってんでないの。工夫は、所詮工夫じゃないの」などという人もいるかもしれない。

htmlは、クラス属性だけで書いても、バリデーションで100点取ることはそんなに難しくなく、上述のような書き方をしても、それ以上の評価にはならない。
 
 htmlドキュメントから、日付を取り出したいとか、rdfを書き出したいと、思い描きながら、ドキュメントを書き進める人もいれば、単に一枚のドキュメントを仕上げればいい人もいる。
 ひとりで作るブログなら、何の問題にもならないだろう。担当が替わったり、引継ぎが可能な形で運営しなければ、ならない時もあるだろう。

 60個も覚えれば、専門家?と思えるhtmlタグ、結構手ごわい。

W3Cにまつわるエントリ他にも、
amaya
勧告ってなんだ

TOP