The Post-Developer Era & New CSS Feature Updates


View this email in your browser (or share it with a friend!)

Hello Reader,

I was going to bury this part lower down, but I think the topic of AI and it’s impact on development is very front-of-mind these days, so I’ve kept it up here at the top.

Josh Comeau recently put out an article titled The Post-Developer Era.

A listener on my second channel asked for more content where I share my thoughts on articles and news, and Josh's piece seemed like the perfect opportunity to try this approach!

video preview

And if you prefer, you can also give it a listen on Spotify or Apple podcasts.


And as for what I was originally going to open this newsletter with… I’m super lucky in that my job is essentially to play around with CSS all day long.

It's a bit of a double-edged sword, though, because I often get excited by new features, and then I can’t use them outside of silly little demos because browser support isn’t good enough.

Of course, you probably watch some of my videos or follow other “CSS people” and get excited by what we’re talking about, only to realize that the feature isn’t ready for prime time yet, and feel equally disappointed 😂.

Some features are great as a progressive enhancement, and I’ll use them as soon as possible.

Animations are a nice area where you can get away with progressive enhancements a lot of the time, so things I’m pretty happy to use these without worrying too much about browser support:

  • View transitions
  • transition-behavior: allow-discrete
  • interpolate-size: allow-keywords

However, so many new features will just break things if they aren’t supported.

In those cases, we can use @supports, and create a fallback for browsers that don’t support the feature.

This can work well, but it does mean we need two solutions.

I don’t mind doing this, but if you’ve got a deadline, that’s not always an option, so most of the time, it just means saying, “I guess I’ll wait until support improves before I start using it.”

And then, of course, two years pass and you completely forget that feature even exists.

This happened to me recently when I found out that alt text for CSS-generated content is now supported in all the browsers, when I didn’t even realize anyone supported it!

Thankfully, we have Baseline, which tracks where support is at, but the problem is we need to look up the features to know where they stand.

So, I decided to start a new series on YouTube, where I’ll look at new features coming to CSS, but also talk about when features hit Baseline Newly Available and Baseline Widely Supported.

video preview

If you haven’t heard of those terms before:

  • Newly Available are features that are supported by all three browser engines.
  • Widely Supported means that feature has 30+ months of support in all three engines.

That might not be good enough to use in production yet, that depends a lot on your audience, and how aggressive you want to be, but they are pretty nice lines in the sand.

I figure putting out a quarterly video on this is a good excuse for me to keep better tabs on where things stand, and a fun way to share it with everyone else as well 😊.

🙋‍♂️ What I’ve been up to this week

I already shared a few things I was up to this week, but I did have a few quick tips this week too.

⚡ Quick tips of the week

🔗 Other awesome stuff around from the web

🏁

Happy Easter to all those celebrating!
Kevin


Are you looking to step up your CSS? I've got both free and premium courses to help with that! They cover a range of skill levels too 👇

Beginner friendly (and free)

Conquering Responsive Layout

A free course to help you approach responsive layouts with the right mindset.

Enroll →

Intermediate

CSS Demystified

For those who've been writing CSS for a little bit now, but want to step up their game and start writing CSS with confidence!

Enroll →

Advanced

Beyond CSS

An advanced course that dives into project architecture, theming, design systems, and more.

Enroll →

If you no longer want to get any emails from me, you can unsubscribe or you can edit your preferences if you'd like pick which emails you get from me.
113 Cherry St #92768, Seattle, WA 98104-2205

Hi! I'm Kevin

Weekly newsletter, where I talk about tangentially-related front-end development topics and share what I've been up to in the last week, plus any cool/fun/interesting/useful links I come across as well.

Read more from Hi! I'm Kevin

View this email in your browser (or share it with a friend!) Hello Reader, Lots of content this week… meaning I was busier than usual and we’re skipping the general musings for this week! 🙋♂️ What I’ve been up to this week Create this trendy blurry glass effect with CSS I didn’t plan for this to coincide with Apple’s new Liquid Glass UI, but I guess the timing was good! It’s not the exact same thing as what Apple’s Liquid Glass, but with the hot mess it is in terms of accessibility, that...

View this email in your browser (or share it with a friend!) PRE-S: The latest State of CSS survey is now open! I’ll be doing a live stream this upcoming Thursday or Friday, going through it myself, but you might as well jump in first! The more people who take this, the more representative it is, and the browsers use the data from these to know what features need improving and what is missing, so it is worth the time to take! Hello Reader, I’ve been getting a lot of comments lately asking...

View this email in your browser (or share it with a friend!) Hello Reader, Ethan Marcotte first coined the term Responsive Design in an article for A List Apart back in 2010. Yup, it’s been 15 years. As the name implies, Responsive Design involves writing CSS that allows the layout to respond to how a user is consuming the content, with “Fluid grids, flexible images, and media queries [being] the three technical ingredients for responsive web design.” For a long time, media queries (@media)...