I’ve just spent a long time improving the little view transition of tags on my bookmarks page. Before my fixes the text was being stretched and the transition looked out of place. So I took the time to dive into how to make view transitions look like they are supposed to and I learned quite a few things.

By far the best resource for learning about this topic is Jake Archibald’s post about handling aspect ratio changes. He also has a great video on how to debug view transitions with dev tools.

To add view transitions to specific elements on my website, I’ve copied the code I found on David Bushell’s website:

@media not (prefers-reduced-motion: reduce) {
  view-transition-name: attr(data-id type(<custom-ident>), none);
  view-transition-class: heading;
}

With this CSS you just need to add a unique data-id="id-{some_identifier}" attribute to your elements (replace {some_identifier} with a unique id) and they’ll each transition as a single object.

I’ve now added view transitions to my blog headlines, my notes and the little tag cloud on my bookmarks page.

I’ve just stumbled upon the UA+ reset with lots of interesting additions.

This lead me to finally separate my own reset.css into a second base.css, which does more than just resetting default browser styles.

The goal is that reset.css can be copied into any project to act as a baseline across projects. base.css is then setting the basic styles for the given project on top of the reset, like colors, fonts etc.

TIL: You can only add this single twitter meta tag for enabling large meta images in link previews. At least when I tested it on Discord this single tag was enough to show a bigger image. I didn’t add any other twitter meta tags.

It’s sad that websites need to add proprietary meta tags to improve link previews in other apps.

<meta name="twitter:card" content="summary_large_image" />

Apparently the web now has a JavaScript vibration API? Totally missed that.

https://vibrator.dev/ios-18 🫨

There is no free speech on plattforms owned by billionaires.

Increasing shareholder value is not a problem. It’s a desire—possibly a fetish.

📺 Youtube video

AI “Co-Pilots” successfully automated creating technical debt. Code is the easy part. Humans deeply understanding computer systems, is the hard part.

I prefer connecting with people, who grow their humane intelligence rather than artificial intelligence.

Well, I’m rebuilding my website for a third time. First I built it with Svelte, then with Astro and now I’m rebuilding it again in Kirby.

Despite having way more experience in JS than PHP, I landed on Kirby, because I finally realized that I need and want a proper CMS. And Kirby is the most enjoyable CMS for me.

My goal is to publish more on my own website, so writing and publishing there should be as easy and as enjoyable as possible. As Germans use to say: „Aller guten Dinge sind drei“