CSS によるレイアウトが当たり前となり、十数年前のようなバリバリのテーブルレイアウトというのはほとんど見られなくなりました。一方で、CMS の普及により、WYSIWYG エディタ上の編集エリア内で、複雑なレイアウトを実現するためにテーブルを使うという場合があると思います。

当然、編集エリアにデータテーブルを置く場合もありますので、枠線の有無やセル内余白など、レイアウトテーブルとデザインを区別する必要があります。

WYSIWYG エディタのスタイルボタンなどに予めレイアウトテーブル用の class を登録しておくという方法も考えられますが、最も単純で明快なのは、テーブルの枠線を付けるか付けないかという区別です。

HTML5 では、table 要素の border 属性の値には、1 または空文字列（border=""）のみを指定することができ、これ以外の値を指定することはできません。（ WYSIWYG エディタによっては、テーブルを挿入する際の枠線の初期値が 0 になっているものが多く、これは HTML5 では使えないので、設定ファイルで初期値を 1 か空に修正しておく必要があります。）

以前、テーブルの枠線は CSS で付けるべきで、border 属性は使うべきでないという考え方もありましたが、HTML5 では、table 要素に border="1" を追加することで、その表がレイアウト目的ではないということを示すことができます。

“データテーブルとレイアウトテーブルを区別する” の続きを読む »