Over the long, rainy weekend here in NYC, I made DollarSlice.nyc from a variety of materials: pencil & paper, Procreate’s brush tool, Figma for drawing the vector lines, static HTML, some lucky doughy font discoveries, free buoy data from NOAA, 11ty. It’s been a delight to put together, and it’s certainly not finished, but I’m happy with it so far—and with making stuff like this, just in general.…
In case you haven't already heard, my team at Squarespace has been working to standardize HTML Video & Audio element lazy-loading, and good things are happening! Update, April 2026: Since this was originally posted, this feature has become a web standard and is starting to roll out in browsers, so much of this post is now outdated. Be sure to check out Squarespace's posts on how we proposed and…
A month ago, I wrote about a defensive CSS convention I've been calling Self-Destructing CSS . As CSS patterns go these days this one is delightfully low-tech, but in my work I've seen it have an outsized impact in ensuring usable experiences for increasingly-heavy websites when network or device conditions aren't ideal. This notion of delivering "optimistically" while planning for failure is…
If you were to link to a page on my website (and many others) from another social media website, you'd likely see an image preview of the page appear. This is handled via Open Graph , a protocol defining a group of meta tags that specify the page's title, social preview image, URL, and more. For example, here's a social preview OG image for my most recent blog post about Self-Destructing CSS: The…
As a web developer, I find that good performance, accessibility, and reliability is often acheived by playing defense against the many problems folks may encounter while using the web. The more I ask myself questions like, "what could go wrong here if JavaScript fails to fully load, or has a runtime error, or merely takes a while to load?," the more I find my sites are usable when those things…
If you're loading fonts from a popular third party provider like Google Fonts or Typekit, the stylesheet link -based loading snippets they offer are not great from a performance perspective . Like any ordinary stylesheet, they block page rendering while they are loading, and for all that delay, the CSS you get merely contains font-face definitions for fonts that may be subsequently downloaded if…
Recently, a friend asked if I knew of a Web Component that generates a QR Code from meaningful HTML. She said that there seemed to be plenty of options for creating QR codes in general , but none that worked by extending already-useful HTML instead of just configuring it all with JavaScript. I couldn't find any either, but thinking through these kinds of patterns is probably what I enjoy most…
6 years back I posted the Simplest Way to Load CSS Asynchronously to document a hack we'd been using for at least 6 years prior to that. The use case for this hack is to load CSS files asynchronously, something that HTML itself still does not support, even though script elements have supported both defer and async attributes for quite some time. The hack takes advantage of browsers' built-in…
I had the great opportunity to go on the Syntax podcast and talk about web performance, web components, the Boston Globe project, JavaScript over reliance, Squarespace, my Web Components Course , and a lot more. It was fun to jump on a show I listen to regularly. That episode is live with an utterly linkbait title wherever you get your podcasts! PS: use the code SYNTAX for 30% off my Web…
Big news! My new online course, Web Components Demystified has launched and is open for enrollment! What's It About? There's a shift underway in front-end development. The largest companies in the world are transitioning away from the complicated, bloated frameworks that have dominated our practices in the last decade, and they're choosing to build on standard Web Components instead. Web…
Well, I swore myself off blogging until I get this course launched and sure enough, here I am again. But a little idea about HTML Web Components has been squatting in my brain for a little while and I needed a place to put it. There's been a lot of great writing about HTML Web Components in the past year, and as an advocate of performant, resilient, progressive enhancement patterns, I'm a big fan…
It has been a few years since I'd last tinkered with approaches for embedding SVG into webpages, but a nice post making the rounds today prompted me to take a look back at where I'd last landed. While that post cites a few perfectly good ways to include SVG into a page, here I'll demonstrate a 4th approach that I think hits the center of the venn diagram for External, Styleable, and Scalable SVG.…
Big News! I'm excited to share that I'll soon be joining Squarespace as a software engineer on the web performance team! As you may already know, Squarespace is a website design, development, management, and delivery platform that has been used to create millions of websites for online businesses, artists, bloggers, restaurants, bands, and more. In this role, I know there will be loads of…
Recently in the Web Performance Slack group , there was some discussion around Responsive Video and what else it is lacking, now that it works at a baseline level . I thought I'd write a quick post that lists a few features that are on my wishlist and include relevant links to WhatWG issues where you might lend your feedback! Responsive Poster Images: Now that we can offer multiple sources for a…
If you follow Web Performance topics closely, perhaps you've heard about Speculation Rules , a new browser API that aims to improve page-to-page navigation speed for multi-page websites ( aka normal websites ). While not yet a W3C standard, Speculation Rules are already fully supported in the stable version of Chromium-based browsers. That means you can use them today to improve the time it takes…
I have some exciting news! I just launched a crowdfunding campaign for a new online course I plan to produce. It's called Web Components Demystified , and it aims to explore web components holistically, covering not only the details of the collective standards behind web components, but also how they're being used across the web today and what's ahead as well. The time for learning web components…
I’ve been thinking about the questions folks are typically asked in front-end interviews these days, and how well those questions assess a candidate's depth of understanding of web standard technologies, and not just their ability to employ JavaScript algorithms and third-party frameworks. It made me think about the sort of questions I would like to hear or ask in an interview myself. I think this…
When I began consulting with the Begin team in late 2023, they had a "good problem" on their hands. Several years prior, the team took a calculated risk, anticipating that our industry would soon grow weary–and wary–of the fragile, complicated, and slow web delivery methods they'd been using for so long. They foresaw a shift towards resilient, simpler, and performant standards-driven patterns and…
I'll start this post by echoing what many others have been saying: Web Components are having a moment lately! After a decade dominated by fragile, complicated, and slow Single-Page Application delivery patterns, it's refreshing to see folks stepping back to look for simple, resilient, standards-based alternatives... and discovering Web Components. Meanwhile, there's an understandable "what took so…
Most of the websites I work on use some kind of templating language to generate their HTML using data. If you build websites too, you're probably familiar with these languages... for example, Mustache, Handlebars, Nunjucks, Liquid, and even JavaScript template literals (which I've come to appreciate a lot as I've been working with the elegant Enhance.dev framework). Technically, any server-side…
Yesterday, I released an HTML Web Component that makes responsive HTML video a little responsive-r . In short, the new (standard!) behavior of responsive video is great to have ( and I'm a fan ), but it falls a little short of many folks' expectations for truly responsive web design because it's only "responsive" at initial page load, and not after that. My Web Component patches that behavior, but…
Responsive HTML video is a web standard again, and with recent patches to Firefox ( oh hey! ) and Chrome that match Safari's preexisting support, it now works across all modern browsers! That means you can use media queries for delivering your videos and potentially save your users some precious bytes. As I've noted in prior articles , this is great news for web performance fans, as video is by…
In case you haven't already heard, you can use media queries for delivering HTML video again! Just a few days ago, Firefox 120 landed and it includes a patch (hey btw, I wrote it! ) to bring back support for this web standard, and Chrome 120 will be out on November 29th with renewed support as well. Safari never removed their support in the first place, so that makes things wonderfully…
Recently, I’ve heard several peers lament that Progressive Enhancement, a term describing a process of building resilient, user-first websites, isn’t working anymore–that it has been redefined, even maligned, to mean different things to different people, with some even understanding it to mean reducing our online experiences to a sad, minimally-viable bar. As an early investor in the term , I have…
Announcement! Today I am starting a new work collaboration that I’m real excited about! I’ve teamed up for a short while with the talented crew at Enhance.Dev (and Begin ) to help broaden awareness of their products and tools, which I happen to think are great . Practically speaking, that’ll mean I'll be doing some public learning and blogging, a bit of product design and strategy, and ultimately…
It's been a couple of years since I wrote HTML Video Sources Should Be Responsive , where I expressed frustration about the lack of a straightforward, declarative HTML solution for delivering different video sizes to different devices. I also pointed out that there used to be a graceful solution to this issue! That's right. We used to have standard, cross-browser responsive video. However, in…