8.1 WEBページにおける段組み

本章では、WEBページを作成するうえでのレイアウトについて詳しく学習していきたいと思います。WEBページのレイアウトには、「段組み構造」が欠かせません。

1.1.1 段組みとは

段組みとは、テキストや画像を複数の段に分けてレイアウトすることです。1段組みでレイアウトすると1行の文字数が多くなって読みづらくなる場合があります。しかし、2段組みや3段組みに分けてレイアウトすることで読みやすくすることができます。段組みによるレイアウトは、以前から新聞や雑誌などさまざまな媒体で利用されています。

1.1.2 WEBページにおける段組み

WEBページでは通常、標準でブラウザの横幅いっぱいにテキストが表示されます。そのため、ブラウザ画面の横幅が大きいと1行の文字数も多くなり、読みづらくなってしまいます。

一昔前のWEB制作に携わる人たちの中で、WEBページにおいても、新聞や雑誌などの印刷物と同じように段組みにして表示したいという動きが出ましたが、WEBページを構成するHTMLとCSSには段組みの機能は用意されていませんでした。そこで、複数の「ボックス」を横に並べて、その中にテキストや画像を入れることによって、段組みのように見えるようにするようになりました。

1.1.3 WEBページにおけるレイアウトの発展

段組みに見せるために用意したのがボックスだったことによって、ボックスの中にはテキストや画像だけでなく、メニューなどのパーツを入れるようになり、WEBページのレイアウトに多様性が生まれていくことになります。そして、近年のWEBページはボックスを敷き詰める形でさまざなレイアウトを実現しています。そのため、ページレイアウトは「ボックスを意図した形に敷き詰める」ことが基本となり、ボックスをどのようにコントロールして並べるかを考えることが必要となっています。