Search

A useful piece of research diving into the continued fragmentation of viewport and screen sizes across the web. I was actually one of the data points, as I saw the original call to arms (a clever …

Important Caveat: YMMV on this trick. Matt himself notes that there are potential issues and there's a discussion with Šime in the comments which highlights actual problems in …

A pretty exhaustive overview of the HTML and CSS options that we now have for responsive image layouts. Here are some key …

Rather than set a max-width on his main content grid, Ethan has used what he calls a constraint column. Basically, the right-most column on his grid scales with the viewport and restricts …

An interesting thought experiment from Chris: if a client asked you to build a website that could last a minimum of 10 years, what would you do? Lots of influential people in his answers, but I'm …

Just after the 10-year anniversary of his Responsive Design article on A List Apart, Ethan has published some interesting thoughts on the nature of seams within …

A wonderfully illustrated and deeply informative article on responsive images on the web. 👏 Also, Eric's worries about "none of this being implemented in any browser yet" are no longer relevant …

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 …

A great rundown of how to build a site using Preact and Eleventy that gives you the best of SPA-lite hydration and the speed/resilience of SSGs, all with the power of progressive …

Craft CMS can be a very enjoyable mobile authoring experience, but it can be improved with some clever plugins and a few relatively new core features.

Robb has come out with some very cool ideas over the years, but wow, seeing CSS-only specular highlighting and holograms is such a neat trick 🤯 I immediately want to co-opt some of this for the …

A halfway solution to a design pattern that I see often, but have yet to find an easy way to implement: text that wraps so it is always fattest in the middle, and thinnest at either end.

A quick (and dirty) way to fetch local data from a JSON file and modify the look of a page in Astro, completely natively.

I've been saying for a couple of years that we are on the brink of a "fluid design" revolution in front-end development, similar to what happened around the late 2000s with "responsive design". …

Harry has created an absolutely phenomenal talk here that provides an immense amount of depth whilst still being completely accessible to someone like me who largely doesn't deal with the technical …

Chakra UI is a pretty solid base for a component system, but it's CSS post-processing can't always provide ideal fallbacks for modern CSS techniques.

I've been digging into tabbed interfaces ("tabs") recently. As usual, Heydon's Inclusive Components has one of the best overviews and write-ups of the techniques used. I particularly love …

A very thorough overview of how to write a modern, performant, HTML-driven image component that is as optimised to serve the most appropriate image as possible. There are some very neat tricks in …

A useful overview of the new success criteria coming in WCAG 2.2 (though the author is quick to note that changes are still at least a little …

The color-mix property enables a lot of interesting functionality when you realise that you can use it to mix transparency into colours, including design tokens.

A few careful thoughts about the utility of "web marginalia", in this case for discovery; things like blogrolls, feed lists, and webrings. John wonders if their demise is in part due to the loss of …

An interesting look at whether the current mobile-first paradigm is problematic. Ultimately, the title feels a little like click-bait; to me the solution proposed remains mobile-first, but suggests …

How well does an iPad work as full code editing device; a veritable laptop replacement? That's what I wanted to find out.

A really solid overview of the two competing models of pagination: SPA-style buttons with hot reloading of content, versus web-based links that load new pages. The conclusion here is clear: go with …