レイアウトの手法『レイアウトグリッド』

Webレイアウトを実践的に作成する際、レイアウトグリッドを利用することで部分の制作時間を短縮することができる。ここでは、 Webデザインにおけるクリッドシステムの概要と Webデザインへの適用方法を紹介します。

グリッドシステムとは
グリッドシステムは、文字と図版を二次元的な平面に配置するためのガイドラインである。タイポグラフィ(文字組)の分野に属するレイアウト手法だ。グリッドシステムが誕生した当時は紙メディアが対象であった。システムを形成する最小単位は活字1文字の大きさであり、行に含まれる文字数がユニットと見なされていた。 本文サイズ10 ポイントなら、 1行50文字のカラムは500 ポイント の幅をもつという具合である。 紙面のように文字と図版で画面を構成する Webサイトでも、グリッド、システムを活用した基本的な画面設計をするシーンが増えている。
1 文字のサイズと1行に入る文字の数を掛けた 値が幅の大きさになる。
たとえばこのように、文字の玉(最小グリッド)を利用して、ラフレイアウトをしたり、デザインを行う。ファーストビューをカラムで区切る。
グリッドシステムが採用されるようになっていった経緯には、 Webページの表示をするためのディスプレイが大型化したことがあげられる。これまでのディスプレイは、幅が800X、高さが600ピクセル程度の小型だったため、 Webページが許容できた文字カラムの数は、最大でも3カラム程度が関の山だった。それ以上区切ってしまうと1行に含まれる文字数が少なくなりすぎてしまい、情報が縦にあふれるおそれがある。 ところが現在のように幅が1024X、高さが768ピクセルの解像度が標準環境になると、 Webページのファーストビューは幅960ピクセル程度に広げられるようになった。それと相まって並列できるカラムの数は最大で4 ~5へと増えたのである。 つまり、並列できるカラムの数が増加したのだから、おのずとカラム構成 は難しくなると考えてよいだろう。 1カラムの幅の比率を決めることでさえ作業が大変になるので、作業をサポートするガイドラインのような仕組みが求められた。そこで改めて評価されはじめたのがレイアウトグリッドというわけだ。もちろん、 Webの場合は紙と違い、文字サイズが表示環境により相対的に変化するため、グリッドの最小単位は文字サイズではない。 Webの場合、最初に決めたファーストビューのサイズを任意の均一に割って設定するという手順になる。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です