“How do you make websites that looks like they’re designed on grids without actually being designed on grids?”
It’s simple really: just be really careful with how you write your CSS, and actually, try not to write much CSS at all.
Eventually you’ll forget to be careful and some “mess” will get out there. But if you’ve been careful otherwise, then:
And that’s it. Yes, it can be challenging. Only you can decide whether or not it’s worth it.
Practicing this behavior truly drives simplicity, but it’s not easy.1 Not at first anyway.
There’s a subtle but incredibly important distinction between ‘easy’ and ‘simple’. In writing less, one way you ‘keep it simple’ is by reducing surface area. To write as little CSS as possible without sacrificing meaning, you’ll need to develop expertise informed by CSS Specifications.
Reading specifications is a huge challenge but it’s necessary to make this work. The websites will only take you so far.
The most important trick in CSS is that almost nothing is a trick, and the tricks don’t last long.
You don’t have to read every spec that exists — not even close — but do start with CSS 2.1 (a wonderful foundation for understanding how presentation works on the web) and the fairly-recent Flexbox.
The more you learn — the more you practice what you are learning — the more you unlock your ability to write simple code that makes sense.
And the more you can do that, the better you are at building the web. And isn’t that why you’re reading this?
Rich Hickey has an excellent hour-long talk on the subtle difference between these two terms. He illuminates the difference through describing software engineering problems created by striving for ease over simplicity. The core principals apply really well to CSS, which I imagine causes huge problems for people who insist that CSS isn’t a “Real Language.”↩︎