Grid-based layouts are generally more aesthetically pleasing and balanced than those not based on grids. Using a grid provides shortcuts to decisions the designer or developer of a page needs to make when approaching a new type of page or tool.
Only a little more than the existing 960 pixels used, but with much more flexibility.
Each column has a 16 pixel gutter. Joined columns add up to 41 pixels. White space is easy to find. The whole page should be centred.
For maximum flexibility the page may be divided into many regular columns easily.
For text (but not graphical or spacial elements) readability can be further improved by having a double gutter on the right-hand side of a column. With ragged edge text this does note have a big impact on line length, but helps add space.
We will set up a media query for window sizes larger than 1230 pixels. This can accommodate a 24 column grid of 32px + 20px gutters, with all dimensions multiplied by about 1.25x in size -
For bigger screens - 24 x 32 pixel wide columns with 20 pixel gutters