私は、ブログ、ニュースページ、またはコンテンツが重要なその他のページのような情報伝達 Web サイトではない Web アプリケーションを開発しています。ツールであるアプリケーションに取り組んでいるため、データグリッド、ボタン、入力フィールドなど、複数のインターフェイス要素があります。
デザイナーの 1 人は、'css グリッド フレームワーク' を使用して、いくつかのグリッドに基づいてデザインを作成することをお勧めします。 2 x 15px のボタンがあり、40px の「セル」内にすべてをまとめるのに苦労します...
私の考えでは、グリッドは多くのスペースを浪費しており、情報の大きなブロックには適していますが、多くの小さな要素には適していません...私は正しいですか?
グリッドを使用するのが常に良い方法なのか、実際には古き良きピクセルごとのほうが優れている場合があるのか教えてください。私が間違っている場合は、グリッドの適切な使用方法を説明している優れた Web サイトを参照してください。
あなたの質問に答えるには、「常にグリッドを使用することをお勧めしますか?」それはかなり自由回答の質問です (そして、それが SO に適していない理由の 1 つです) が、ここに私の 2 セントがあります:
A)クイック アンド ダーティー UI が適切であるだけでなく、期待され、必要とされる場合 (たとえば、あまり頻繁に実行されない内部関数の場合) は、古いスタイルに移行して、機能するものを一緒にダンプします。
B）「一般」またはかなりの量の技術者以外のユーザーが利用するアプリを開発している場合、少なくともビューごとに一貫したレイアウトを作成するように試みる必要があります。これは、960 またはTwitter Bootstrap の輝き。個人的な経験から言えば、Bootstrap を使用すると、ナビゲーション コントロール、データグリッド、入力フォームなどをページ内で正しく並べて配置することが非常に簡単になります。
UX Stack Exchangeサイトは、いつ/なぜグリッドを使用するかについてより良いアイデアを提供してくれる可能性があり、とにかくこの質問により適している可能性があります...
960 グリッドの全体的なポイントは、複数の列を可能にするために多数の均等に割り切れる要素を提供することです。簡単にするためのガイドラインにすぎません。
これらの列に何を入れるかはあなた次第です。ボタンはグリッドに合わせる必要はありません。
私の経験から言えば、グリッド システムにより、設計と開発がはるかに容易になります。デザインの観点からは、どこにどのように配置する必要があるかを簡単に把握でき、開発者にデザインを渡すときに、開発者はデザインをグリッドにプラグインするだけで、すべてが期待どおりにレイアウトされます。
アプリケーションと Web サイトの優れたグリッド フレームワークは、Twitter の Bootstrap です。scaffolding pageを見ると、固定グリッド レイアウトとレスポンシブ レイアウトの両方が提供されていることがわかります。私はレスポンシブ レイアウトを好みますが、Web アプリではなく Web サイトを作成します。本質的にグリッドに収まるボタンのスタイル、便利でアクセスしやすい機能がロードされた JS ライブラリ、および優れたサポート ネットワークが組み込まれているため、これも優れています。
あなたが見たいかもしれない他のグリッドシステムは次のとおりです。
960.gs、ブループリント、および1140 CSS Grid。独自のカスタム レイアウトを作成するグリッド ジェネレーターを Google で検索することもできます。
あなたに合ったものと一緒に働くデザイナーを選べば、あなたの生活はずっと楽になります。
http://grids.heroku.com/をご覧ください。これは、固定または柔軟なグリッドを生成するシンプルなツールです。グリッドがどのように機能するかを知りたい場合、シンプルで一般的なグリッド システムはhttp://960.gs です。