Journal
Responsive Type and Zoom (by Adrian Roselli)
When people zoom a page, it is typically because they want the text to be bigger. When we anchor the text to the viewport size, even with a (fractional) multiplier, we can take away their ability to do that. It can be as much a barrier as disabling zoom. If a user cannot get the text to 200% of the original size, you may also be looking at a WCAG 1.4.4 Resize text (AA) problem.
The Man in the High Castle by Philip K. Dick
The second Phillp K Dick I’ve read this year is his alternative-history sci-fi classic.
Design Better Forms (UX Collective)
As Andrew Coyle says, “Life is short. No one wants to fill out a form.”. Here, he presents a number of form design tips to make the user experience more bearable and increase completion rates.
Layered, Smooth box-shadow generator (on brumm.af)
Inspired by Tobias Bjerrome’s blog post Smoother & sharper shadows with layered box-shadows
Making a Better Custom Select Element (24 ways)
We want a way for someone to choose an item from a list of options, but it’s more complicated than just that. We want autocomplete options. We want to put images in there, not just text. The
optgroupelement is ugly, hard to style, and not announced by screen readers. I had high hopes for thedatalistelement, but it’s no good for people with low vision who zoom or use high contrast themes.selectinputs are limited in a lot of ways. Let’s work out how to make our own while keeping all the accessibility features of the original.
When should you add the defer attribute to the script element? (on Go Make Things)
For many years I’ve placed script elements just before the closing body tag rather than in the <head>. Since a standard <script> element is render-blocking, the theory is that by putting it at the end of the document – after the main content of the page has loaded – it’s no longer blocking anything, and there’s no need to wrap it in a DOMContentLoaded event listener.
It turns out that my time-honoured default is OK, but there is a better approach.
Carbon
Create and share beautiful images of your source code. Start typing or drop a file into the text area to get started.
Async and Await
My notes and reminders for handling promises with async and await In Real Life.
Modest JS Works
Pascal Laliberté has written a short, free, web-based book which advocates a modest and layered approach to using JavaScript.
I make the case for The JS Gradient, a principle whereby your app can have multiple coexisting modern JS approaches, starting from the global sprinkles to spot view-models to, yes, an SPA if that’s really necessary. At each point in the gradient, you’ll see when it’s a good idea to go a step further toward heavier JavaScript, or not.
My first Christmas working at FreeAgent. Strong Christmas Jumper game!
