CSSレイアウトの魅力 － 表示の速さ

CSSレイアウトの魅力 － 表示の速さ

「ソースの軽さ」では、HTMLファイルの容量が小さくなることで、ページを開くまでの時間を短縮できるということに触れましたが、CSSによるレイアウトで表示が速くなる理由は、ソースが軽くなるからだけではありません。

TABLEタグでレイアウトした場合、サイトが表示されるのはTABLEタグを閉じた後、つまり「</table>」が読み込まれた後になります。「</table>」が記載されるのは当然、ページの末尾になるわけですが、ボリュームの大きなページの場合、ソースを最後まで読み込むまでには少々時間がかかります。

一方、DIVタグを用いたCSSによるレイアウトの場合、ソースが読み込まれた部分から表示されるため、最後まで読み込む時間がかかりません。

この「最後までソースを読み込む時間」ですが、実際の時間にすれば1～2秒と、決して長くはありません。しかし、この1～2秒が、訪問者に大きなストレスを与えてしまいます。

また、JavascriptなどをTABLEタグ内に組み込んだサイトでは、エラーなどが発生し、ソースを最後まで読み込むことができなかった場合、ページが全く表示されないといったケースもあります。そのような場合でも、DIVタグを使ったCSSレイアウトでは、読み込んだ部分は表示されているわけですから、最悪、エラーが発生した以降の記述のみが表示されなくて済みます。（CSSから話はそれますが、このようなケースが考えられるため、ページ上部でのCGIやjavascriptの利用はあまりお勧めできません。）

ページが表示されるまでの速さ、エラーが発生したときのリスクなどを考えても、CSSによるレイアウトはより有効であると言えます。