「本家/.のCSSリニューアル」記事へのコメント

ところでCSSって非力すぎませんか

[tockri (27596)]

divタグとCSSでごにょごにょやってレイアウトすると、上下方向の真ん中寄せとかできないですよね。あと大きさがまちまちに変化するブロック要素同士をうまいこと幅を兼ね合いしてウィンドウ幅いっぱい使って横に並べることもできないですよね。float:rightとかだと幅を固定にしないとうまくいかないし。

table使えば簡単にできるのに何でこんな苦労しなくちゃならんのだ、とか思ってしまいます。

テーブルレイアウトを否定される方が多いですが、現時点でCSS使って思った通りのレイアウトができない以上、そんなに無碍にしなくても、と思うのです。CSSでもっと自由で便利にレイアウトできるようになってくれると良いのですが。たとえば

#menu {layout-left-of:content;}
#content {layout-right-of:menu;}

<div id="menu"> ...
<div id="content">...
みたいな。

ところで、table断固反対派の皆さんのうち何割がちゃんと読んだか謎ですが、総本山とされているW3Cアクセシビリティガイドライン（日本語訳へのリンク [zspc.com]）には、tableを使わない理由として主に読み上げソフトが困る、というのを挙げています。で、ちゃんと読むと、

1. colspanとかrowspanとか駆使した複雑なレイアウトのtableはHTMLソースのタグを飛ばして読んでいくタイプのソフトに優しくない
2. 文章が左右段組になっていると、画面に表示されたテキストをとにかく上から読んでいく古いタイプのソフトに優しくない

とあって、1の理由では、線形化可能なtableタグならいいんじゃないの、と思えますし、実際そう書いてあります [zspc.com]。

テーブルを線形化して意味が通る場合を除いて、テーブルをレイアウトのために使用しない。

2の理由は、そもそも左右段組自体を否定しています。CSS使ってとかそういうの関係ないですよね。

あと、よく言われる、表示を制御する目的で構造を表すためのタグを使用しない。 [zspc.com]というとこの前後一文ずつには、こう書いてあるのです。

レイアウトのためにテーブルを使用する場合、表示を制御する目的で構造を表すためのタグを使用しない。[優先度2]
たとえばHTMLの場合、テーブルのヘッダでもないのに、センタリングしたり太字で表示したいからといってTH要素を使ってはいけません。

W3Cのガイドラインは、レイアウトのためにテーブルを使用することを完全に否定しているのではなく、アクセシビリティを損なうようなトリッキーなテーブルや、タグの意味を無視した使用をやめてくれと言っているのです。

だいたい、<div class="title">とか<div class="mainmenu">とか、そんなのだって、どうせclassの文字列は完全な「俺ルール」なのでタグ自体には意味が全くなくて機械が扱えないことには変わりないですね。そんなわけで、HTMLの保守性を高めるために見栄えをCSSにまとめてしまうことには賛成ですが、どうあってもtableを排斥せねばならぬ、とまでは思えないのです。

Re:ところでCSSって非力すぎませんか

[Stealth (5277)]

WCAG 1.0 的には、1 のような事は書いてないと思いますが。セルが縦横に貫通していようと、リニアに並べて問題なければ ok です。

ただ、/.-J の出力は明らかに視覚的表現を制御するためのテーブルレイアウトですので、使用しない方がアクセシビリティは向上するじゃない、となりますけどね。テーブルの影響でガタガタに崩れたりしますし。

で、CSS3 についてですが、ビューポートの高さや幅を基準とした単位に関しては、足りないと思われているから CSS3 では既に盛り込まれ済みです。当然段組もあります。

ちなみに、現状の W3C は方針として実装が 2 つ以上出ないと勧告にはしない、とのことなので、Gecko、WebCore、Opera 辺りに切磋琢磨して頑張ってもらうのが、一番勧告が出るのが早くなるでしょうね。もっとも、IE が載せるとは思えないんですが。いいとこ IE8 か 9?

# そもそも table で「画面の中央に揃える」なんてできましたっけ? セル内中央とかいう世界なら vertical-align がありますけど。

で、段組みに関しては、最初はテーブルで段組みしてたけど CSS に変更した例 [w3.org]も実在する訳ですし、単純な段組み程度のものであれば、敢えてテーブル使う必要はないんじゃないですか?

Re:ところでCSSって非力すぎませんか

[Anonymous Coward]

どうせclassの文字列は完全な「俺ルール」なのでタグ自体には意味が全くなくて機械が扱えないことには変わりないですね。

テーブルにはテーブルの意味がある、ということを忘れていませんか？CSSに意味がないことは保証されているので、読まなくてかまいません。しかし、表には、表としての役割が期待されているのに、実は見栄えのため*だけ*に導入されていることがある、というのが問題なのです。普通、表は、データを列挙する時にのみ使います。

たとえば、こういう報告書があったとしましょう。

我々の調査よると、駅前の本屋を訪れるメガネっ娘の割合は以下のようになっていた。

朝：１２．５％
昼：１５．５％
夕：２５．５％

つまり、メガネっ娘に会いたいなら、夕方に本屋を巡回すべきである。

ここで、重要なポイントは、前段の文脈により、「細かい数字が必要でない」と感じた人は、表を読み飛ばしていきなり結論を読む、ということです。これは、報告書、論文などに限らず、晴眼者が活字データをみる際には普遍的な行為でしょう。雑誌でベンチマーク記事なんかを読むときも、細かい数字を精読する場合というのは限られています。列挙データというのは、論証の面で重要だとしても、論旨に影響を与えない場合がほとんどだからです。そして、これを機械的に読み取り可能にするのが、論理マークアップの力です。

しかし、この文章全体が巨大なテーブルタグの中に収まっている場合はどうでしょう？すべてがぶち壊しです。つまり、アクセシビリティがきわめて低いのです。

表のタグは表が要る時だけにしてください、という当たり前の事を主張するのに、なぜ、これほどの労力を費やさなくてはならないのでしょうか。まったく、あきれたアクセシビリティの低さです。

Re:ところでCSSって非力すぎませんか

[harupunte (10435)]

つまるところ、
tableと同機能を持つ名前違いの layout-tableみたいな
タグを新設すれば良いって話？

皆、別に table を使いたいわけじゃなくて、現行で
tableが提供してくれる便利なレイアウト機能を使いたいだけのよーですし。

Re:ところでCSSって非力すぎませんか

[Y.. (7829)]

それはダメ
タグを新設するにしてもレイアウト情報を含むってのは好ましくない
tableと同様なタグを使っちゃうと
最初２段組になってるサイトを、３段組にするときに
HTMLの方も修正しなくちゃならなくなる
理想としては見た目の都合で、文書構造を記録しているはずのHTMLに手が入ってはならない

んじゃどうすればいいのかというと.....
CSS側でテーブルっぽい指定ができればいい？？？
セレクタで判別して見た目を定義する現状の仕様に
枠組みの定義をする仕組みと、どこの枠に配置するか指定するようなやつ？（当然、枠内の相対指定も追加だろうなぁ）
さらにつっこんだことまで考えるとそれによって、ページ内リンクくらいは自動で作れるとよさそうだし、
別のHTMLからも情報を引っ張ってきてリンクを作るとかできてもよさそうではある

Re:ところでCSSって非力すぎませんか

[ruto (17678)]

XSLがそれに近いのでは。

Re:ところでCSSって非力すぎませんか

[Sithgunner (6190)]

というか、HTMLからデータを構造的に読むのはテーブルだけがんばって、排除しても無理でしょ。って、サーチエンジンがやってない時点で、立証されてるけど。

テーブルだから、データ的に扱うとか、そんな次元は現存のHTMLでは無理だから、現実的には、別にテーブルでレイアウトでも、もうすでにいいと思うけど。

もはや現存のHTMLは生の文字かマークアップの区別しかないように思えます。

後、実際にCSSだけじゃほんとうまくレイアウト書けないし。ブラウザーの大きさ変えたり、センタリングするのだって、大変だし。

Re:ところでCSSって非力すぎませんか

[Anonymous Coward]

そういうのはtableじゃなくてulを使うもんじゃないんですか？

Re:ところでCSSって非力すぎませんか

[Anonymous Coward]

>あと大きさがまちまちに変化するブロック要素同士をうまいこと幅を兼ね合いしてウィンドウ幅いっぱい使って横に並べることもできないですよね。

ブロック個々のwidth属性を%指定すればいいじゃない