Writing CSS

March 23rd 2016

My ability to write "good" CSS has a direct negative correlation to how close I am to finishing a particular task. When a project first kicks off and I have a blank slate it's a chance to do things The Right Way™. Re-usable code, crisp lego blocks for building a complete UI...It always starts off so easy, right?

But when I'm nearing the finish line, getting ready for the deploy, something in my process breaks down; I get lazy, I start to over-specify and over-nest and mix content semantics with visual semantics. Ugh.

I suppose this says something about myself and my process. But at the same time I think it says something about how big of a pain in the ass it is to write "good" CSS.

Adam Morse wrote a really well-articulated view on this issue, which I've attached as a source to this post. I highly recommend that anyone who writes front-end code give it a read.

When I write bad code, it isn’t because I’m not trying to write good code. There are always other forces at work.

The scary thing for me is that I've actually only ever written CSS with a handful of people or as a solo designer. So it haunts me to think about how frustratingly difficult it would be to scale this thing to teams and organizations. So I'm especially thankful for folks like Adam and Dan Eden and Brent Jackson who are fighting the good fight to help everyone in the community learn a better way...

So what does DRY even mean? Because you do have to repeat yourself somewhere! You either repeat yourself in html or in css.

One of the key takeaways from Adam's post is the above quote. If you have to write HTML no matter what, in order to build a new component/page/widget, wouldn't it be nice if you didn't have to write any extra CSS? Tachyons and Bass.css are two tools off the top of my head that encourage this behavior.

And of course the obvious counter-argument is that you're just moving bloat from CSS files to your markup. But I'm starting to think that's okay, despite having grown up learning otherwise. It can be good not only from a performance point of view, but also simply because it's nice to read your markup and have a pretty good guess at how the thing will render on a screen.

The real way to scale css, is to stop writing css.

Lots of great thoughts in Adam's post - give it a read.

More Posts

Copyright © 2016