僕がウェブに関わり始めた時期は、レスポンシブ(以下、RWD)という概念が普及し始めた頃でした。

この頃ウェブページというものは container とか frame(frame要素ではない) とかいった名前がつけられたブロック要素をページ中央に中央揃えし、その中にページ内のすべての要素を入れ込むのが一般的だと学びました。

この方法でページを組むと、大元になるコンテナとなる要素の横幅を決めてしまいさえすれば、そのコンテナの中で縦方向にパーツ(ヘッダー、フッター、サイドバー + メインコンテンツ など)を横幅100%で展開すれば良い、効率的なウェブデザインだと考えていました。

しかし、その後のウェブデザインの流行として、ページ全幅を利用して展開する「全画面」ウェブデザインをよく見かけます。パソコンで見たとき、ヘッダー、スライダー、一部のメインコンテンツ、フッターなど、局所的にページ全幅を利用するデザインで、従来のようにコンテナを利用すると、都度コンテナの横幅をキャンセルさせて全幅を利用しなければならないため、なんとなく気持ち悪さを感じていました。

ふと最近気づいたのですが(気づくの遅いw)、昨今の全画面ウェブデザインにおいては、ページを縦に分割してセクション毎に横幅を指定する方が良いように思ってきました。

この方法では、ページ内のセクション毎に横幅を指定しなければならない為、従来の方法よりも横幅を指定する必要のある要素が増える一方、全画面表示を都度最適な方法でレイアウトすることができるようになります。

まぁ、気づくの遅すぎなんですが、昨今のウェブデザインのレイアウト方法についての発見でした。

カテゴリー: ブログ