Designing for the Web ~ Layout
Designing the Grid
The constants define the columns. De Standaard uses standard advertising units as defined by Interactive Advertising Bureau. For the new site, it was proposed the following ad units would be incorporated:
A lot of grids on the web are based on even numbers of grids: 12, 16, 24. On researching this project — especially by reading a huge variety of newspapers from around Europe — it became clear that actually in physical newspapers, an odd number of columns is the norm: either 5, 7, or rarely 9 columns. I believe this creates an imbalance, and therefore an opportunity to create tension in a layout. Let me explain a little. An even number of columns is a little like using a square for composition. It’s stable, balanced, and even. Using a square as a compositional base can result in a balanced layout, but the danger is the resulting design will have no movement. It’s more difficult to lead the eye around a layout that has a strong symmetrical base. Think back to earlier in this part where I discussed the advantages of using a triangle as a primary compositional device. For this reason, I opted for a five—column master for the new De Standaard grid. These columns would each be separated by a generous gutter.
ßƹ 300 x 250 IMU — (Medium Rectangle) ß 728 x 90 IMU — (Leaderboard) Leaderboard banner
Medium Rectangle advert
These ad units are relatively common for commercial sites, but particularly common for the newspapers. The New York Times, Guardian, and Times Online, (the three sites indicated as a benchmark for the redesign of De Standaard), all carried the Medium Rectangle, and all but the New York Times uses a Leaderboard. In addition to these standard ad sizes, we also had to contend with existing image sizes employed by De Standaard for several years. All of this legacy content had to be included in the new design without breaking the layout. These elements are constants. The size of these elements are fixed, and will not change over time so they are a safe starting point for us to design the grid around.
licensed to Denis (1 user license)
Designing for the web