My CSS-Tricks Top 10

Just spitballing here (I’ll wash my hands later) but I’ve probably edited and written somewhere in the vicinity of 3,000 articles at CSS-Tricks. Much heavier on the editing side, of course. Combine that with the fact that I started following CSS-Tricks in its maiden year, 2007, and the overall number of articles is easily doubled.

So. Many. Articles. You wouldn’t be wrong to think my little blonde brain is incapable of remembering even a fraction of what its read, but I’m amazed each time I edit or write just how easily I can recall existing content and link it up to what I’m working on. So, it stands to reason I have a lot of great CSS garbage in my attic. I’d probably have a lot more without all the 90’s music trivia competing for space up there.

(And, yes, I can probably find legit connections between Ace of Bass and something like the Universal Selector… All that she wants, right?)

Anyway, I love making Top 5 lists. If you were to crack open my college journals, you’d inevitably land on a page littered with playlists of the best songs for eating Top Ramen on the floor of your living room a là Rob Gordon in High Fidelity.

There are way, way, way too many CSS-Tricks articles to list just five favorites. But 10? Still difficult, but good enough. So, here are ten CSS-Tricks posts that have left a large imprint on my brain over the years.

Anatomy of a malicious script: how a website can take over your browser (Pablo Mioni)

This might be my all-time favorite of all the articles I edited. The way Pablo framed the post makes it read like a mystery thriller… if you consider reverse-engineering JavaScript a thrilling thing. I’ve never known anyone to take the time to unpack a script the way Pablo does, and what he provides winds up being a great look at the thinking process of a JavaScript developer in addition to being a darn good story.

Grunt for People Who Think Things Like Grunt are Weird and Hard (Chris Coyier)

Chris penned (err, typed?) this one before I joined the team. I remember it so well because it’s the perfect example of how Chris has this incredible skill to make scary things approachable, and even fun! I remember exactly where I was sitting when I first saw this post (the common space of the condo building where I lived at the time).

I was pretty new to freelancing at the time and knew I needed a repeatable build process for my client projects. I was (and still relatively am) no JavaScript jockey and the idea of defining console commands in something called a “Gruntfile” was nothing short of intimidating. Sure, I may have spent two hours with Chris’ post, but it got me exactly where I needed to be. Gosh, the feeling I got from my first successful Sass compilation was a rush like none other.

Web History series (Jay Hoffman)

Yeah, yeah, so I’m cheating a little by choosing a series of articles. Whatever, because every article in here is part of a body of work that adds up to legit book-quality reading. Jay’s writing is masterful. I’d rejoice every time I saw his name in my inbox because I knew I’d not only get a solid draft that required very little editing, but a new part of a great story. I don’t think I’m exaggerating when I say that these collected articles — not to mention everything Jay does over at The History of the Web — is a treasure of the World Wide Web that deserves to be preserved. I’d make it required reading for all new devs if I could.

Magic Numbers in CSS (Chris Coyier)

Yep, another one from Chris that predates me joining the team. And yet again, I can recall exactly where I was when I read this: the Highland Park station along the L.A. Metro Gold Line. I had to switch trains for some reason, like a technical glitch… a pretty typical thing for L.A. Metro.

Anyway, I opened this post on my iPad mini and couldn’t put it down. I may have read it three times in a row. What stands out to me is that Chris is basically starting a conversation about what we now refer to as “Defensive CSS” and “Intrinsic Web Design” like a prophet rising from the ashes with a stone tablet of what’s to come.

Save 15% or More on Car Insurance by Switching to Plain JavaScript (Burke Holland)

No one writes to my taste like Burke. His brand of satire is everything I love in a piece of writing. And who else is able (or even willing) to get the Smashing Pumpkins involved in a diatribe on the performance implications of React?

And isn’t funny how we’re still talking about the CSS-in-JS performance six years later?

In Defense of a Fussy Website (Sarah Drasner)

What’s not to love about an article that encourages you push the boundaries of web design? Sarah is a boss at making extraordinary designs and user interactions, so anything she says I’m instantly drawn to. And if you’re in need for another way to frame creativity, she does it again in “The Empty Box”.

Front-end development is not a problem to be solved (Robin Rendle)

Good gosh, I probably could’ve filled out this entire list with nothing but Robin articles. His piece on flex properties ought to be required reading for anyone picking up flexbox. But where Robin always shines most is in deep thoughts — the things we all think but very few of us actually take the time to noodle on and articulate as well as Robin. This is a perfect example of that. If you feel as though a mirror is being held up to your face after reading the last line, then you truly get the power of his words.

I also had the pleasure of editing Robin’s weekly newsletter for CSS-Tricks. He’s got so many goodies in every issue that add so much value to anyone working on the web.

A Serene CSS Dappled Light Effect (Preethi)

Preethi has the most curious mind and uses it to dream up creative uses for CSS. Whenever I read her work, I appreciate her penchant for pushing CSS to its limits, but without resorting to esoteric code that the average dev might not get. Add to that the fact that there’s so much nature and realism in her work and it’s almost as if she’s creating tangible life-like objects. I probably stared at her dappled light demo uninterrupted for an hour, recalling the feeling of seeing a Claude Monet painting in person for the first time. This was no less impactful to me.

CSS in 3D: Learning to Think in Cubes Instead of Boxes (Jhey Thompkins)

This is one of many articles I worked on with Jhey. I think it was the sixth? Yes, that’s right. The big ol’ “a-ha!” moment of my CSS learning experience was when I realized everything is a box. Well, leave it to Jhey to notch that epiphany to Level 11 because that’s exactly what happened after I read this one. The concept of 3D CSS has always been elusive to me. I mean, conceptually, I get it. But when it comes to practical application, I might not know exactly where to start. This is the starting point, and it couldn’t be taught by a better person.

Reader Mode: The Button to Beat (Eric Bailey)

I literally think about this article every time I hit the Reader Mode button in Safari. And that happens quite a bit, with Safari being my default browser and all. The truth is that there is way too much small text on the web, like there’s worry about running out of space on a webpage or something. I have decently working eyeballs. They won’t win me any night-reading competitions, but they do the job as long as I have a cheap pair of Walgreen’s readers perched on the bridge of my nose. But still, I find myself smashing that gosh darned Reader Mode button like it’s going out of style. Thanks to Eric, I now see Reader Mode as my competition when working with text even though it is my best friend when I’m casually browsing sites.

---

There we go, my CSS-Tricks Top 10. Like any good list, I feel like there’s way too many good ones missing. But perhaps that’s merely because there’s an overwhelming abundance of great content on CSS-Tricks… not that I’m biased or anything.