Post

Haven't deployed it yet, but if you're interested you can take a look at staging.samwho.dev to see the work I've been doing on my site. The numbers are looking good (this is compared against a deployment at old.samwho.dev from just after /big-o was published.)

Not really any great secrets here, a lot of the old pages were just dumb. I was including large deps that I only needed for some small purpose. Some of them I was able to replace with DIY code, some I could use a smaller version of the dependency.

I also discovered with nginx you can precompress assets and it'll serve them from disk, so on deploy now I create gzip and brotli versions of everything at the highest possible compression settings so shave off a few percent more of the bundles.

On top of that I noticed my site was using HTTP/1 and I hadn't configured HTTP/2 or /3, derp.

A lot of the increases in accessibility score came from better contrast on text and visuals. I now have automated tests ensuring I maintain 4.5:1 contrast ratios on my smaller text, and 3:1 on larger. I've gone through and had a go at a better set of colour tokens for the site.

This is a tangent, but I appreciate your clear explanations and elegant visuals of topics other tutorials overcomplicate. I’d like to see how you are testing for contrast ratio. That seems like a great check.

Thank you Brian! I use github.com/dequelabs/ax... in Playwright. It applies WCAG AA colour contrast rules to all of my posts and fails the tests if there are violations. It’s not perfect, but it feels better than not having them.

github.comGitHub - dequelabs/axe-core: Accessibility engine for automated Web UI testingAccessibility engine for automated Web UI testing. Contribute to dequelabs/axe-core development by creating an account on GitHub.

0 reposts1 like