Published at
Updated at
Reading time
8min
The Web Weekly newsletter keeps you up to date, teaches you web development tricks and covers all things working in tech.

Guten Tag! Guten Tag! πŸ‘‹

Can we build good-looking carousels only with CSS? What's unsafe flexbox alignment? And when would you use document.currentScript?

Turn on the Web Weekly tune and find all the answers below. Enjoy!

Danny listens to β€œNilΓΌfer Yanya - Like I Sayβ€œ

Great tune I picked up last year with a hypnotic chorus.

Do you want to share your favorite song with the Web Weekly community? Hit reply; there are three more songs left in the queue.

If you enjoy Web Weekly, help me grow this newsletter and let your friends know...

A quick "repost" really helps this indie newsletter out. Thank you! ❀️

Something that made me smile this week

Two tweets. One is sharing that an entire application was built with Cursor follow by one asking for help because the app is under attack.

On the recent trend topic (I won't link to the sources), it turns out you need more than prompting skills to do computery things. 🫣

Open tabs

Will AI take our jobs?

I would like to advance a third option, which is that AI will create many, many more programmers, and new programming jobs will look different.

Laurie (ex npm, ex Netlify, and now doing AI things) shared his take on AI and if it will replace us all. It's a rational and logical take that I can get behind.

Be realistic

When aria-label doesn't work...

One common mistake with "aria-label" (that I have absolutely done myself) is to add the attribute directly to the SVG instead of the "button" or "a" or other element.

As always, before using ARIA, make sure to know what you're doing. Chris highlights one of the things that is often done wrong. Slapping useless aria-label attributes on elements that can't handle it.

Use ARIA correctly

Greetings from the future: CSS-only carousels

A curved carousel with controls below.

Disclaimer: The following will only work in Chrome 135, which should ship... today? 😱

Chromium will ship ::scroll-marker and ::scroll-marker-group and ::scroll-button() to enable us to build CSS-only carousels. Exciting!

If you want to see it all in action, open this Carousel Galery in Chrome Canary. It's a lot of eye candy and many different use cases that you probably wouldn't categorize as a carousel.

Adam explains the core concepts if you want to learn more. πŸ‘‡

Check the new and shiny

But as good as this looks, there is big but; I couldn't find a positive sentiment from Apple at WebKit/standards-positions or Mozilla at mozilla/standards-positions for the new CSS features. Am I missing something?

How do LLMs actually work?

Andrej Karpathy standing next to the words "ChatGPT"

I don't cover many technical AI things here in Web Weekly, but I've been watching Andrej Karpathy (ex-OpenAI) explaining how ChatGPT works on and off for weeks. It's a very long (over three hours) but solid and well-explained technical deep dive.

Understand LLMs

You're halfway through!

Wowza! Would you enjoy getting Web Weekly straight to your inbox?

The wonderful weird web – wikitok

Wikitok preview showing three random wikipedia entries.

If you feel like swiping social media but think you would instead learn something, wikitok is for you. The app shows you random Wikipedia articles in a TikTok fashion.

Gain Knowledge

TIL β€” UrlPattern is a thing

const pattern = new URLPattern({   pathname: "/blog/:year/:slug", });  const { pathname } = pattern.exec(   "https://example.com/blog/2025/whatever" ); console.log(pathname.groups.year); // "2025" console.log(pathname.groups.slug); // "whatever"

I didn't know about UrlPattern. It's been shipping in Chromium since 95 (that's a looooong time); Deno has it, too, and the constructor is now coming to Node.js 23.8.

If you pair UrlPattern with UrlSearchParams you'll have everything you need to parse URLs.

Learn more on MDN

Mastodon bots (uhm... RSS feeds) to follow

"Wai A Day" and "randomMDN" bot

Eric created a new Mastodon bot that posts one W3C / WAI resource daily. If you know me, it's no surprise that I love this.

The beauty about Mastodon is that every account also becomes an RSS feed if you append .rss. The bot at yatil.social/@WAI_A_Day has an accessible feed at yatil.social/@WAI_A_Day.rss.

I'm following:

But that can't be it? Can it? Are there more valuable webdev bots out there? If you know one, let me know!

:where() vs :is()

Quick Reminder That :is() and :where() Are Basically the Same With One Key Difference

Short'n'sweet: Geoff explains the difference between the :where() and :is() selector.

Learn the difference

document.currentScript

Example script using "document.currentScript" for templating.

I have "feelings" about using inline JavaScript for templating, but Lean's examples are pretty smart.

Render inline

Random MDN – fit-content

width: fit-content; block-size: fit-content;

From the unlimited MDN knowledge archive...

I use width: fix-content quite often, and if you don't know about it, you're missing out...

Fit your content

TIL recap – safe flexbox alignment

Demo visualizing how flexbox can lead to data loss.

Do you know that there are situations in which your flexbox layout makes content inaccessible? Yes, you've read that right. Flex layouts come with safe and unsafe alignments, and if that's all news to you, you can find some answers on the blog.

Be safe!

Find more short web development learnings in my "Today I learned" section.

New on the baseline - contenteditable=plaintext-only

<div contenteditable="plaintext-only"></div>

With Firefox 136, the last engine now supports the contenteditable variant plaintext-only. When would you use it?

Thomas describes that contenteditable elements automatically grow with their content, which unfortunately isn't the case for the textarea element. Elements with the contenteditable attribute also allow text formatting.

But sometimes you just want to have plaintext in a growing box, right?

This situation is when contenteditable=plaintext-only comes it. MDN describes attributes very well and offers a demo highlighting the differences.

Edit some content

And if you want to inspect what content sits in your clipboard, I recently learned about the Clipboard Inspector, and it's pretty nice.

Three valuable projects to have a look at

A new Tiny Helper

Two color controls showing the oklch color format.

Many color contrast checkers are out there, but most fail to support the new color formats like oklch. OddContrast allows you to check for accessible contrast in all the new and shiny colors.

Check the contrast

Find more single-purpose online tools on tiny-helpers.dev.

Thought of the week

Armin published a "dependency churn" rant, and I feel you, Armin, I really do. πŸ₯²

The goal of code in many ways should be to be written in a way that it does not need updates.

Did you learn something from this issue?

πŸ’™ If so, join 21 other Web Weekly supporters and give back with a small monthly donation on Patreon or GitHub Sponsors.

This is all, friends!

Loved this email? Hated this email? I want to hear about it!

If you think something needs improvement or something sparked some joy, reply to this email because I want to know more!

And with that, take care of yourself - mentally, physically, and emotionally.

I'll see you next week! πŸ‘‹

If you enjoyed this article...

Join 5.8k readers and learn something new every week with Web Weekly.

Web Weekly β€” Your friendly Web Dev newsletter
Reply to this post and share your thoughts via good old email.
Stefan standing in the park in front of a green background

About Stefan Judis

Frontend nerd with over ten years of experience, freelance dev, "Today I Learned" blogger, conference speaker, and Open Source maintainer.

Related Topics

Related Articles