究極とも云えるテーブルレイアウト（2004-06-11）

以前から、どうにも見づらい、重たいと思っていた、職場内のある部門のページを久しぶりに開いて、驚いた。

以前はワードのウェブ形式保存で作ったことがありありで、やたら長い上に全く目次が無し、と云う困難なページだった。レイアウトがすっきりして、分かりやすくなった。目次がついて、ページを分割している。少なくとも見かけが従来比500%改善された。リンクがブランクウインドウで開くが、そうなることが分かっていれば、実用上はそれほど問題にはならない。

試しに、メニューをクリックし、「注意書き」のページを開いた。テキストのみのページであるにもかかわらず、なかなか読み込みが終わらない。一応、職場ＬＡＮはブロードバンドであるが、異常な重さである。

ソースを見てみる。HTML 4.01 Transitionalと、doctypeも入っている。例によってテーブルレイアウトだが、それ自体は何ら珍しいものではない。いきなり、<td></td>がずらりと並ぶところが新鮮だ。新鮮だが、いくらスクロールしても、<td></td>ばかり。なんだこれは？

しばらくして、理解した。１行に141個の<td></td>を並べ、それぞれに幅をピクセルで指定してある。141個目の<td></td>に、spacer.gifが縦横サイズ指定で入れてある。つまり、巨大な仮想方眼紙をテーブル内に作り、部分的にセルを結合し、そこにテキストを並べている。何故か、１行ごとに、空セルだけの余白行が入る。数えると、２万７千行余りのHTMLファイルである。重たいはずだ。逆算すると、141列Ｘ200行のテーブルと云うことになる。１行置きに空っぽの行が出てくるから、実際のテキストは100行ほどである。

こういったテーブルレイアウトを見たのは初めてだ。この方眼テーブルテクニックが、解説本やホームページ解説サイトに、革新的な裏技として紹介されているのだろうか。まさかと思う。テーブルレイアウト自体が裏技なのだ。裏の裏までやる必要はないだろう。

それとも、ホームページビルダーには、方眼紙テーブルモードがサポートされているのだろうか。或いは、作成者のオリジナルテクニックか。何しろ、よほどパワーのあるCPUを使っているのだろう。

この程度で驚いていてはいけない。ということを、最近知った。いま。テーブルレイアウトは新たなステージに突入したのかもしれない。

WEB相談室：タイトル：ポインタを合わせた時に、矢印がおかしくなる

相談室の質問の趣旨とは、若干外れるが、テーブルの行と列を1px間隔で指定して、罫線を非表示とすると仮想方眼紙が出来る。セルの背景色を任意に指定しピクセル画を作るというテクニックである。こうすると、角の丸い模擬背景画像の枠を作ることが出来る。テーブルを使わずに、スタイルシートの背景の指定では４隅を丸くすることは難しいのかもしれない。そうまでして、枠を丸めたい人の気持ちは、分からないでもないが、ソースを見ると気分が萎える。