19 October 2021

What do I need to read to be a great at CSS?

For the first time in my life, I felt the urge to comment on Reddit.

Over on r/webdev, this here question popped up:

Do you think reading css articles like css-tricks & smashing magazine is waste of time?

This question isn’t really about the two sites mentioned but about the frustration we all feel with the endless treadmill of keeping up with what’s happening in web dev. Especially, since a lot of it feels so unproductive:

• Articles on features that haven’t shipped yet and may never ship everywhere.
• Advanced features that address specialised use cases you’re never going to encounter.
• Masturbatory “let’s do this without any JS!” articles that end up being much more complicated than adding, like, a line or two of JS.

It’s a lot. It’s frustrating. But it doesn’t have to be this way. Which is the reason why I felt the urge to reply with the following. Hopefully others will find it helpful.

---

So, I’ve been making websites since before CSS was a thing and using CSS since before absolute positioning was a thing which I guess makes me … intermediate? Maybe? 😄

You don’t have to keep running the gossip treadmill to keep up. This applies to CSS, JS, HTML and the rest. As you observe, memorising partially implemented new standards, many of which may not even end up adopted as actual standards, isn’t a productive use of anybody’s time.

Treat it like you would a gossip column covering people in your field: read it for fun, don’t over-invest, don’t feel bad about missing out on it. There’s a lot of gossip out there so there’s a lot to ignore.

What I’ve found does pay off is focusing on doing different kinds of reading:

There’s the aforementioned gossip—new news so new that it may not ever be useful. You don’t want to spend much time on web dev gossip in general (JS dev news is often even more gossipy).

Then you have the more detailed how-tos, some of which may be covering recent-ish standards, but are mostly about features you can use right away. Ahmad Shadeed’s blog has many good examples of this which I highly recommend. You read these texts to get a sense of what the platform can do. You don’t need to memorise how it is done. Just know that it can be done.

Then you have problem analysis and solutions. These posts go over specific problems and how you might solve them. Josh W Comeau’s blog is full of these kinds of posts. Sara Soueidan’s blog is also a good source. Lea Verou’s as well. Smashing Magazine and CSS-Tricks have a lot of these kinds of posts as well, so I would have another look at them if I were you. You were reading them as industry gossip (which they do provide) but it sounds like you weren’t getting the full value that these sites have to offer in terms of howtos and problem solutions.

These sites you read—scan mostly—and you bookmark individual posts that you find interesting so that you can refer to them later if you run into the problem they’ve solved yourself. (Which reminds me: I recommend using a bookmarking service so you can find your bookmarks even when you aren’t logged into your preferred browser.)

Another important type of reading is higher level or workflow level analysis. Such as the CUBE CSS site. Reading about how to organise your work is some of the most productive learning you can do. Every Layout is another example as it’s fundamentally about how you optimally structure your CSS for composition and reuse. These you read, study, and reread. You don’t have to agree with everything they say, but you should be able to answer (for yourself) why you would disagree with them.

Finally, there’s synthesis. That’s when you start to read texts that are adjacent to your work so that you become better at addressing those problems on your end. For those, you would be reading blogs on accessibility (like Adrian Roselli’s) or design (like Stephanie Walter’s) or the link blog of a web developer who is also doing cross-discipline synthesis reading (like Jeremy Keith’s, which I highly recommend.)

You don’t have to understand everything on all of the sites in this last bucket. Those are more for building a shared vocabulary and mindset with other specialities that you will be working with.

Of course, checking these sites every day is a huge pain, especially since most of them aren’t updated every day. This is why a feed reader, such as Feedly, is gold. You can’t trust that new posts to these sites will pop up on the aggregation sites you follow.

A rule of thumb is that the importance of a blog in your feed reader is inversely proportional to their posting cadence. Prioritise the blogs that post only once a month or every couple of weeks over those that post every day or multiple times a day. You don’t want to miss a new Ahmad Shadeed post but there’s no harm in skipping the CSS-Tricks firehose for a few days. Building up a large library of sporadically updated blogs is much more useful and much easier to keep up with than trying to keep up with a handful of aggregation sites every day.

The benefit to this approach is that it isn’t time-sensitive. If you look at the posting cadence of the core blogs I mentioned, you can go away for half a year and they won’t have that many new posts for you to catch up on. 99% of the rest that has piled up while you were away is just gossip that you can ‘mark as read’ without any guilt.

So, to answer your question: yes, you should still be reading these sites, but you should change how you read them and add a few others into the mix. 🙂

Do you ever wonder why a newly released open source project matters? Why it doesn't? How new or old standards or specifications affect your work? Why the web, tech, and publishing are the way they are?

This is an unapologetically political newsletter about tech, the web, and publishing—with context.

Because, to decide whether to use a piece of software, web standard, or open source project, you need to know why it‘s interesting, not just that it‘s interesting.

Your email address

I won't send you spam. Unsubscribe at any time.