When to use Grid and when to use flexbox
With flexbox and grid supported in all major browsers, I see variations of these questions asked a lot: what should I use, flexbox or grid? or which one is better flexbox or grid? The question is...
Configuring Typescript for new projects
I've finally given in to working with TypeScript despite some of my misgivings about the technology. My misgivings include: The need to set up a transpiler toolchain You can't run the code directly...
HTML landmarks and accessibility
Landmarks, or what I call structural elements, help define the structure of a document and help accessibility tools like screen readers describe the content to users. The following table shows the...
Thoughts on certifications
This post outlines my early thoughts on certifications as they relate to WordPress. I'm coming into the conversation as an instructional designer and curriculum developer and someone who has worked...
Subresource integrity: what it means and how it works
When you use libraries like jQuery from CDN, you will see code like when you get the CDN link: <script src="https://code.jquery.com/jquery-3.6.2.min.js" ...
Locale-aware string splitting
In Javascript, the intl object provides several locale-aware tools to work with in Javascript. One of those tools is the segmenter object. The segmenter object enables locale-aware segmentation from a...
Measuring Performance Tasks with Playwright
As I was writing my previous post about Playwright and writing tests I came across an article that explained how to run performance measurements inside Playwright tests. Core Web Vitals # The example...
Inspecting a font with fontkit.js
Several times I've found myself working with fonts where I want to know what's available in the font without using tools like Wakmaifondue. Recently, I discovered fontkit.js, a tool that will read and...
Interesting things you can do with the console
Most of the work I've seen done in the console is limited to console.log. There is a lot more that you can do with the console. There's even a living standard hosted at WHATWG. Most of the time we...
Better color contrast on the web
A little bit of background. The W3C chartered the Web Accessibility Initiative as the central place to gather information, research, best practices, and standards (recommendations in W3C talk) for...