If you’re designing a layout for your website, somewhere along the line you’ll have to decide how many columns you’re going to have. What do I mean by Columns? Take a look at the diagram below:
Those are the most common overall design schemes. Take a look at Reddit, Tutorialized, Macworld, and Smashing Magazine. Notice anything similar? They’re all two-column designs. They may look a lot different, but they share the same low-level design. Now take a look at Digg, NTugo, and Adbrite. They’re all one-column layouts. Notice where I’m going? Virtually any design on the web follows a low-level general design like the ones illustrated above.
Which is best for your site, though? Let’s take a closer look at each of them.
One-Column
One-column layouts have, well, one column. They’re great for websites that use a lot of images in their content. For navigation, they generally have a horizontal bar near the top of the page, with links/buttons along it.
Two-Column
Popular among blogs, the two-column layout has plenty of advantages. If you take a look at this site’s design (as of June 20, 2007), you’ll see that it’s a two-column design. Notice how it’s set up? There is a horizontal navigation, though it’s just major top-level links. The sidebar has the majority of the navigational links, allowing you to go anywhere on the site. The sidebar has more than navigation, as happens with designs with sidebars. There’s a search box (which sort of is navigation), and RSS subscription links…a mainly navigation-focused sidebar. Other sites have a lot off odd stuff on their sidebars, not in any way navigation.
Three-Column
Well, it has three columns. What did you expect? It’s like a two-column design, but with an extra column. Often, the left-hand sidebar contains navigation, while the right-hand one has assorted non-navigation stuff on it. Three column designs are currently seeing less use, as their content columns are narrower, leaving less room for large images.
Three-Column Variation
Sometimes you’ll come across a site with two sidebar columns right next to each other. If done right, it works pretty well. Personally, I’m no that huge of a fan of them. For an example, take a look at EnGadget.
Four Columns?
Yes, there are websites with four columns. For a couple great examples, see The Site of Requirement, and The Leaky Cauldron. Few websites use designs like this, and often they use three columns for more content-heavy pages (as SR and TLC do).
When you’re designing a web layout, it’s important to decide on the number of columns fairly early. Often, you’ll make a decision without even knowing it.
