When to use <meter>
A solid example of where HTML semantics can be a little problematic: the <meter> element. Also a good overview of where/when this element is […]
Archives
Scrobbling stats
A great (and niche) website that lets you look up the history of any given Last.fm account. For example, here's my stats page: theAdhocracy's Last.fm stats. There are lots of great data […]
GSAP video export
A handy little tool for exporting GreenSock animations as videos, with a wealth of customisation options. Perfect for sharing animation work on social media or dropping examples into case studies […]
Alternatives to absolute positioning
Ahmad has put together some really interesting examples of where modern CSS techniques can replace traditional use-case for absolute positioning. I'd be really interested to know how some of them […]
Time to update your theme-color meta tag
I have mixed feelings about the inclusion of Safari's new editable browser chrome, but love it or hate it, more and more iOS and OSX users will end up seeing it. Andy hasn't touched on any of the […]
Container queries in web components
Max has put together one of the best examples of how container queries will fundamentally change the way front-end development works. Better still, they provide extremely clear explanations of […]
The component gallery
Building a tooltip? A carousel? A password input? I can strongly recommend checking if the Component Gallery has a page on whatever UI pattern you're working […]
Git push to new repository
Super useful walkthrough on taking a branch from one repository and publishing it to another repository entirely (great for creating test repos or stripped-down example repos for bug […]
Dispatching webmentions with a Netlify build plugin
I've been trying to get this working since the Beta of Netlify plugins, and along comes Mark with a fully working example 😂 Definitely want to look into the source code (GitHub) and see if I can […]
Ectogenesis and generative art
I stumbled onto Tyler's site while trying to find some examples of SVG manipulation and all I can say is wow 🤯 I've been a fan (and proponent) of generative art for many years, but Tyler's work […]
Creating textures with SVG filters
A fantastic overview of the feTurbulence SVG filter, including interactive examples of all the relevant attributes, how they can be combined, and some of the cool things you can (glitch buttons, […]
Fluid typography with CSS clamp
A simple and informative example of how the new CSS clamp property can be used to create fluid layouts (in this case, specifically a fluid type […]
Saving forms
A very clever (and well explained) method for helping users complete forms. Particularly with modern pop-up forms, I'd say at least once a month I'm part way through typing something and […]
React Testing Library: custom hooks
Another great overview of how to use the `react-hooks` extension for the Testing Library suite, with some more complex examples than many other […]
How to test custom React hooks
I've been doing a fair amount of testing React hooks recently. Part of that has been learning the `react-hooks` extension for the Testing Library suite, which took a while to wrap my head around. […]
CSS @property superpowers
Looks like the new CSS @property extension has landed in Chrome. Una has put together some interesting examples and explanations on the fallback mechanism in particular. Usage appears to be the same […]
Microformat examples
I've been battling microformats a lot recently, wish I'd found this page of best practice markup examples earlier, it's a great […]
Digital garden seedlings
Whilst falling down the rabbit-hole of digital gardening I found some of Maggie's tweets incredibly insightful and useful, yet somehow totally missed her own digital garden (and her entire related […]