めんどくさいカラム計算が簡単にできるGridulator

めんどくさいカラム計算が簡単にできるGridulator

Webデザインをする時にかかせないツールを紹介するコーナー。今回はカラム計算を自動でしてくれるWebサービス「Gridulator」を紹介します。

ボックスの横幅と分けたいカラム数を入力するだけで、割り切れるサイズをリストアップしてくれます。

A quick and easy grid calculator for pixel pros (and novices).

Gridulatorの使い方

Gridulatorの使い方

使い方と言ってもやることは2つしかありません。

「Overall Widthにボックスの横幅」を、
「# of Columnsに分けたいカラム数」を、

それぞれ入力するだけです。

参考例

Gridulatorの参考例

例えば上のような3つに分かれたカラムを作りたい場合、 ボックスの横幅「960px」と分けたいカラム数「3」は決まっていると思うのでまずは入力してみます。

あとは、
写真のサイズをどれくらいにするか?
各カラムの空きはどのくらいにするか?
を考えていきます。

もちろん、カラム数を増やしたり減らしたりの調整も、自動で計算してくれるので簡単です。

まとめ

カラムを計算してくれるWebサービスはこのほかにも、「Gridpx」や「Grid.Guide」などいろいろとあるのですが、私はGridulatorを長年愛用しています。

ひとつできないこととしては、両サイドにマージンを置くことができない点でしょうか。 その際はボックスサイズから両マージン分をマイナスして計算したら大丈夫だと思います。

よかったら使って見てください。

A quick and easy grid calculator for pixel pros (and novices).