グリッドシステムとは？
ぐりっどしすてむ
グリッドシステムとは、紙面や画面を格子状に分割してレイアウトを整える設計手法で、情報を整然と美しく配置するためのデザインの基盤となる仕組みです。
グリッドシステムとは、デザインの制作物（印刷物・ウェブサイト・アプリなど）において、紙面や画面を縦横の格子（グリッド）で区切り、そのラインや枠に合わせて文字・画像・余白を配置する設計手法です。
グリッドシステムが体系化されたのは20世紀中盤のスイスです。ヨゼフ・ミューラー＝ブロックマンらによって確立された「スイス・インターナショナル・スタイル（国際タイポグラフィ様式）」が世界的に広まり、現代のグラフィックデザインの基礎となりました。彼の著書「グリッドシステム・イン・グラフィックデザイン」は今日でも参照される古典的名著です。
グリッドシステムを使うことで得られるメリットは主に以下のとおりです。
- 一貫性：ページをまたいでも視覚的な統一感が保たれる
- 可読性の向上：テキストと画像のバランスが取りやすくなる
- 作業効率化：レイアウトの判断基準が明確になる
- レスポンシブ対応：ウェブでは列数を変えて画面幅に対応できる
ウェブデザインでは12列のグリッドが標準的に使われており、CSSフレームワーク「Bootstrap」はこの12列グリッドを採用しています。また、CSSのGrid LayoutやFlexboxはグリッドシステムの考え方をコードで実装するための技術です。印刷物では新聞・雑誌・書籍のレイアウトに不可欠な手法です。
使い方・例文
ウェブサイトのトップページで商品を3列・4列に均等に並べているのは、グリッドシステムに基づいたレイアウトの典型例で、整然とした見やすい画面を実現しています。
この用語をシェア
最終更新: