A single column is natural, easy, and flexible

Here’s why I care about single column web design in the first place:

  1. Constraints are good. They encourage creativity. The more you limit yourself on purpose, as a designer, the more creative you will have to be. If you can only use black and white, you’ll come up with more creative solutions when you need your design to look interesting.
  2. An important goal in visual design is coherence, or harmony. The more complicated your design, the harder that coherence is. Single column design means coherence is easier.
  3. You get mobile-first design for free. Mobile internet access is often the default. If you design for a single column from the start, it’s less effort all around.
  4. A single column is how the web works. HTML puts everything in a stacked column by default. It’s more effort to fight this natural grain of the web.
  5. If you write your own HTML and CSS, a single column website makes your job easier. Even if you don’t, developers will thank you for the simpler task.

In Everything Easy is Hard Again, Frank Chimero points out that tables, floats, flexbox, and CSS grid are repeated attempts to solve the same problem.

It was 1997, I was learning HTML, and there was one problem with the design that was confusing me: how do I put two things next to each other? Twenty years later, we’re still working out the answer to that very basic question.

The latest layout technology in CSS is powerful, no doubt about it. I use it myself. But if you ever want to avoid the complexity and take it easy, there’s a solution: don’t put things side by side.

Next chapter →

← Previous chapter

Back to the table of contents