Posts Tagged with “rule of thirds”

1322px Grid


Now that 1366 is quickly becom­ing the most pop­u­lar screen width, a 1322px grid with 22px gut­ters is ideal because you can divide the space into 24, 20, 12, 10, 8, 6, 4 and 3 columns. This eas­ily allows for the rule of thirds, and also leaves you with 22px mar­gins on each side of the grid.

Seems like we’ve finally hit the point where we can work in a nice big can­vas. Would be great to have a respon­sive CSS frame­work built around this con­fig­u­ra­tion. Any­one up for the challenge?

Here’s a quick PSD I cre­ated with the columns.

Divine Proportion


I’m a big advo­cate of using divine pro­por­tions and the rule of thirds in any type of design work. I think any well con­structed grid sys­tem should start from one of these pro­por­tions. They make a design more bal­anced, struc­tured, com­pelling and far more communicative.

Here’s a great arti­cle on Smash­ing Mag­a­zine on both subjects.