In theory, you should be able to get the base favicon of any domain by calling /favicon.ico - but the reality is somewhat more complex than that. Plenty of sites use a wide variety of semi-standardised images which are usually only discoverable from the site's HTML. There are several services which allow you to get favicons based on a domain. But they all have their problems. Google Exposes…
Continue reading →
There's (yet another) new piece of CSS to learn! Hurrah! Way back in 2011, jQuery mobile introduced the web to page-change animations. Clicking on a link would make your high-tech Nokia display a cool page-flip as you navigated from one page of a website to another. Just like an app!!!! A decade-and-a-half later, and CSS has caught up (mostly). No more JavaScript, just spec-compliant CSS. Well, …
Continue reading →
"If it's stupid but it works, it's not stupid." I want to draw some vertical bar charts. I don't want to use a 3rd party library, or bundle someone else's CSS, or learn how to build SVGs. HTML contains a <meter> element. It is used like this: <meter min="0" max="4000" value="1234">1234</meter> Which looks like this: 1234 There isn't much you can do to style it. Browser manufacturers seem to …
Continue reading →
A decade ago, I was writing about how you should test your user interface on drunk people. It was a semi-serious idea. Some of your users will be drunk when using your app or website. If it is easy for them to use, then it should be easy for sober people to use. Of course, necking a few shots every time you update your website isn't great for your health - so is there another way? Click the "🥴 …
Continue reading →
You can't. There is no way to use CSS to apply a style to every letter "E". It simply can't be done. At least, that's what they want you to think… What if I told you there was a secret and forbidden way to target specific characters in text and apply some styles to them? As part of my experiments in creating a "drunk" CSS theme, I thought it would be useful to change the presentation of s…
Continue reading →
I recently read a brilliantly provocative blog post called "This website has no class". In it, Adam Stoddard makes the case that you might not need CSS classes on a modern website: I think constraints lead to interesting, creative solutions […]. Instead of relying on built in elements a bit more, I decided to banish classes from my website completely. Long time readers will know that I'm a big f…
Continue reading →
I am vain. I like to know which of my blog posts have "done numbers". I get a little thrill knowing that an old post I wrote has been read by someone in a land I've never visited. I'm curious and want to know if a newsletter has linked to me. At the same time, I don't want to know too much about people. I don't want to stalk them around the web. I refuse to care how long they spend with me. I…
Continue reading →
Let's say that you've visited a website and want to share it with your friends. At the bottom of the article is a list of popular sharing destinations - Facebook, BlueSky, LinkedIn, Telegram, Reddit, HackerNews etc. You click the relevant icon and get taken to the site with the sharing details pre-filled. The problem is, every different site has a different intent for sharing links and…
Continue reading →
Code Golf is the art/science of creating wonderful little demos in an artificially constrained environment. This year the js1024 competition was looking for entries with the theme of "Creepy". I am not a serious bit-twiddler. I can't create JS shaders which produce intricate 3D worlds in a scrap of code. But I can use slightly obscure JavaScript APIs! There's something deliciously creepy about…
Continue reading →
Back in 2020, Andy Bell introduced me to the idea of grouping attribute values. You've probably seen something like this before: <article class="card-section-background1-colorRed" ></article> A single class over-encumbered by all sorts of things. The more modular way to write this would be: <article class="card section box bg-base color-primary" ></article> That's pretty good! Each…
Continue reading →
It is a truth universally acknowledged that a programmer in possession of some HTML will eventually try to parse it with a regular expression. This makes many people very angry and is widely regarded as a bad move. In the bad old days, it was somewhat understandable for a PHP coder to run a quick-and-dirty preg_replace() on a scrap of code. They probably could control the input and there wasn't …
Continue reading →
Consider these two HTML elements: <div class="a b">…</div> <div class="a b">…</div> Is there any semantic difference between them? Is there any way to target one but not the other? In other words, are they logically different? I think the answer is no. On every browser I've tested, both are the same. Whether using JS or CSS, there's no difference between them. You could replace every \n wit…
Continue reading →
