A blog about CSS, front-end development, the web, and beyond.
Find out moreAnchor positioning in CSS enables us to position an element relative to an anchor element anywhere on the page. Prior to this we could only position an element relative to its closest positioned ancestor, which sometimes meant doing some HTML and CSS gymnastics or, more often than not, resorting to Javascript for positioning elements like tooltips or nested submenus.
Read more
My son gets a weekly magazine delivered to our home. It’s full of his favourite comic strips by fantastic authors and artists, he gets the pleasure of receiving something in the post just for him, and (even better) it doesn’t come with a load of plastic tat like you get with magazines in the supermarket. It’s not packed full of ads either, apart from a few for the comic book company’s workshops and merchandise, which I consider a small trade-off. Wouldn’t it be awesome to get a magazine full of articles by your favourite bloggers every week? Anyway, that’s kind of what RSS is like.
Read more
I’m sure I’m not alone in noticing the recent proliferation of articles lamenting the impending (or, indeed, already happening) destruction of the web as we know it, due in large part to the influx of AI-generated content. For the most part, I share their pessimism. It’s hard not to see the devaluation of human content as anything but a negative.
Read more
Greys. Who doesn’t love ’em? When it comes to building websites, it can be handy having a few shades of grey at your disposal, no matter your colour palette. We use them for borders and subtle dividers, shadows, and to indicate state changes without overwhelming the user with colour. Some designers feel that a website needs quite a few shades of grey in order to convey subtleties. I once worked on a project that literally had 50 shades of grey.
Read more
There’s something special about starting a new web or software project. Like a blank canvas, it has so much potential. Surely this is where we’re about to do our best work...
Read it on Branch
This article on privacy-focussed web design by Paul Jardine and Becky Thorn of sustainably-minded web design agency Root raises some great points about the link between invasive tracking scripts and the carbon footprint of a website. I’ve often been frustrated by the negative performance impact of adding Google Analytics or Google Tag Manager to a site. Sites that were previously reasonably fast would subsequently perform poorly with regard to Google’s own Core Web Vitals. It seems that many of the products Google actively encourage web authors to add to their sites are paradoxically the ones that have the worst impact on performance. (Don’t get me started on YouTube videos.)
Read more
When you get an invite from Chris and Dave to appear on ShopTalk Show it’s hard to say no! Despite my longstanding fear of sounding like an idiot on the airwaves, I swallowed my nerves and joined them for an episode on web sustaibaility — althought we managed to delve into a few other topics too. Naturally, right afterwards I thought of a whole bunch of things I forgot to mention (hopefully I’ll get around to writing one or two follow-up blog posts!), but I was pleased to get the chance to talk about this important subject on such an esteemed podcast. I hope listeners will take away one or two things, and be inspired to do their own research.
Read more
Colors can sometimes get out of hand in a project. We often start with a few well-chosen brand colors, but over time, we may find ourselves adding variations as our project grows. Perhaps we realize that we need to adjust the lightness of a button color for accessibility reasons, or that we need a slightly different variant of a component. How do we ensure that the colors we choose fit within the design system for our project?
Read it on MDN
I was just collating all the articles I’ve read over the past month in order to post them here when, coincidentally, Matthias Ott’s latest Own Your Web newsletter lands in my inbox! This month it’s all about bookmarks: how you collate them, where you keep them, and how you share them. I definitely need a better way to organise mine, which is why I’m sharing them here.
Read more
A post from Remy on Mastodon recently got me thinking:
Read more
Since I redesigned this website last year, an issue with the heading font has been bugging me. I’d noticed that, unlike in other browsers, in Safari on iOS the headings rendered poorly, slightly blurry, as if they’d been faux-bolded. Googling the problem was coming up with nothing, but I’m using a variable font, so I figured perhaps that had something to do with it not being a super-common issue.
Read more
The Green Web Foundation has recently redesigned their green web hosting directory. Previously the directory was a useful resource for finding hosting platforms that at least claim some sustainable credentials but, as I’ve noted before the information provided by each web host was somewhat limited. From the directory alone it was impossible to discern which providers could claim to be running on renewable energy rather than buying carbon offsets, for instance, or which providers were doing the bare minimum of box-ticking, as opposed to making sustainability a key part of their offering. Finding a truly green web host is hard!
Read more