Cool Links

Amazing step-by-step explanation on building Card components, with a special focus on accessibility. I love this kind of articles that explain the thinking behind every step and every line of code!

Card elements are everywhere and we all do them a bit differently. I’ll pay much more attention to the things mentioned here to ensure they’re as accessible as possible.

We rely too much on software companies nowadays, and most of the popular ones are USA-based. With the USA becoming increasingly less trustworthy on an almost daily basis, people have started gathering EU-based alternatives to the most popular services.

This is interesting even if you’re not based in Europe, as companies there are forced to respect your data and privacy by law.

It’s like image lazy loading, but for page elements! I’ve got to try this out sometime and measure the effectiveness of this technique. Depending on the results, this might end up as its own blog post ;)

This website simulates a TV schedule (with CRT-style filters!) with multiple channels, each featuring an interesting indie website. The programming changes often (just like shows on a tv channel), so it’s an interesting site to keep on your bookmarks and visit a few times a day.

Great article pointing out that “Views” are an useless metric and that the platforms that count it have zero incentive to not lie about them.

This is an incredibly well-articulated rant about how recommendation algorithms are changing how our brains work. Automation is good for us and it’s everywhere, but what about when thinking, the very thing that makes us human, starts being automated?

Letting recommendation algorithms (that, as we all know, prioritize revenue) decide the information we get, the tone of that information, and the context of every social interaction is pretty much giving up on our autonomy.

The entire video is worth watching, but this part about context collapse was one of the most interesting bits. It makes perfect sense, but I had never thought of it this way:

Algorithmic feeds on social media are unfortunately quite good at fostering something known as context collapse. To understand this, imagine you’re dining in a restaurant and you’re close enough to a table of people to hear snippets of their conversation. You don’t know who any of the people at that table are, but if you manage to overhear them talk about something you’re really interested in, you might feel tempted to join their conversation. But in the context of a restaurant setting, that’s considered very rude, so it rarely ever happens.

On social media, though, the same kinds of quasi-private conversations between parties who know each other are happening all the time, but since the platform is just one big space and it might decide to put that conversation in front of random people, that social boundary of etiquette which is normally respected is just not there. And lots of conflicts happen as a result.

A really common one you might accidentally step into on social media happens when you stumble across a conversation among friends making sarcastic jokes with each other, but since you don’t know who those people are, you don’t have the context you need to recognize they’re joking. And so, if you reply with a serious critique, well, that’s a social misfire which some will react poorly to.

And that’s a pretty mild form of context collapse. It can be much, much worse when people want to discuss things like politics. And unless we realize recommendation algorithms are what’s fostering these reactionary conflicts, they’re going to continue so long as we use platforms in the ways that we do. It’s for all these reasons that I believe algorithmic complacency is creating a crisis of both curiosity and human connection.

Ahmad’s blog has been featured here a few times already, and here’s another gem! A fully interactive, well-written and just a plain joy to read article explaining different strategies to handle colors in CSS, focusing on all those little color variations we need to handle when building something.

In times where software “needs” to stand out rather than be familiar, we lose our heroes. Rest in peace, square checkboxes!

pretend to be on your phone so that you pass as human, but actually do essentially nothing instead

Do you feel pressured to be on your phone all the time, so you can pass as a human? This neat web app allows you to do just that, but while doing absolutely nothing instead.

(honestly, it’s a better use of your phone than scrolling through social media…)

Really nice article that pretty much sums up the iPad situation: it is interesting hardware but that has pretty much no software that showcases what it does best.

The best iPad apps are… web apps. And the iPad’s only available browser being Safari doesn’t make things better.

Customizing <select> elements is something every web developer has had to do, probably. And the thing about that is that… you really can’t customize it. Or couldn’t, until now.

Having to implement a custom look on this field was always, to me, the perfect definition of “reinventing the wheel”. You gotta pick up this element that works reliably, is accessible, natively supported by all browsers, and users have been using for 30+ years, and then… build it from scratch, with JavaScript (which already kills the accessibility for some people).

Now, as of Chromium 135, you can finally customize them as you always expected you could! This will probably take a while to get to Safari and Firefox, but here’s the cool thing: if those browsers don’t support this new thing, the <select> will just look like a normal field and work just as well. A perfect example of progressive enhancement!

Sooo many times I’ve had to debug something in a npm package dependency of a project I’m working on, only to realize I need to change some of the code to make it work.

That’s usually a pain though, since you either have to open a pull request with a fix and wait for it to be merged, or setup your own fork of the package and host it somewhere.

This package aims to avoid that. It applies patches to other packages in your project, so you don’t have to go through the process of setting up a fork.

I’ve written about Container Queries before, but this article by Josh Comeau is great at giving even more examples of its utility. It’s always nice to see what use cases other developers find for it.

A fun exercise about making elements “pop out” of their containers with CSS without altering markup. Might not be useful if you can change the markup (as there are easier ways to do that), but learning this kind of approach is always good for expanding your repertoire.

position: sticky is incredibly useful but I’ve had issues implementing it more than once. This article goes over some of the most common issues we can face with it and how we can fix them.

I love those joke programming languages. They’re perfect examples that sometimes the only reason you need to build something is that you can.

Cool article explaining a little bit about fonts and choosing them for your website/app. I’m still overwhelmed by the options, but I found the info in there to be interesting.

What a powerful read. Not really tech-related, but as someone who’s seen loved ones go down the same route as Sam did, it’s a very relatable, sad, albeit weirdly comforting, read.

Abundance breeds boredom. When there’s no end of choices, each choice feels disappointing.

It was once assumed that digitization would liberate cultural artifacts from their physical containers. We’d be able to enjoy the wine without the bottles. What’s actually happened is different. We’ve come, as Goldsmith says, “to prefer the bottles to the wine.”

Worth a read if you use any kind of computer technology, really. It’s so weird how our ancient brain has adapted to the digital world - or maybe hasn’t adapted at all?

HTML and CSS are my favorite parts of web development, and this article gives some great examples of why. Learning HTML is one of the best things you can do for your (web development) career, as it’s the most foundational block of a website and by itself can do most of the functionality you need. From HTML, you can progressively enhance the rest.