In the early days of web development (circa 1997), web design was limited to fonts that were available with the operating system, be that Windows, MacOS, or Linux. Couple that with limited crossover o
Introduction In web development, we frequently need to style elements to visually indicate some state they're in. We give form fields red outlines to indicate invalid values. We show disabled or inact
Part of my role at Nordhealth is to design, develop and expand upon our ever increasing roster of Web Components within the Nord Design System . One of my most recent contributions is arguably one com
A few months ago, I shared some tips and tricks for working with static site generators (or SSGs). It was primarily focused on creating and publishing content, and the mechanics of day-to-day use. One
Layout Breakouts with CSS Grid Extending elements beyond the content area with CSS Grid & named grid lines Posted on Oct 7, 2022 Takes about 5 minutes to read A post about the layout you're looking at
Dave has a piece about the patchability of the open web that resonates with my experience: I under-appreciate the ability to patch or coerce websites to meet my needs. He outlines the ways he commonly
The alt attribute is used with img elements to provide descriptive text that can be read aloud by screen readers and other assistive technology. Today, I wanted to talk about what good alt text looks
Here are the lists I keep up with: Stress list (updated daily) – holds what I’m stressed about day to day so I can make sure I’m working on the most stressful thing that day. Gratitude list (updated d
A couple of weeks ago Jeremy Keith had a post on refactoring an existing site to use logical properties. Not entirely sure about logical properties? web.dev has a nice summation … Logical, flow relati
Fast websites are good, right? Nobody likes to wait, and with Core Web Vitals being a ranking factor, optimizing performance is more critical than ever. Rightfully, one of the main Core Web Vitals is
Earlier today, Wisen Tanasa shared a great thread on how he breaks his coding tasks into smaller parts , and pushes a bunch of small commits with iterative changes instead of one big commit with a bun
Slow Social A few weeks backthere was another round of social-media panic(which is reasonable),and the ever-present remindersto Use A Personal Site. Personal sites are great!But I have some issues wit
I was using the Crunchyroll app on my iPad this weekend and noticed my level of frustration rising because the most annoying feature of the Crunchyroll iPad app is that while using it, I can do nothin
After listening to Episode 18 of the Word Wrap Podcast , I was inspired to come up with a set of conventions for our internal merge request reviewing. Each comment within a review will be prefixed wit
Custom properties and CSS parsing are always good for surprises like !important behaving slightly differently or properties being "invalid at computed value time" . Today I discovered yet another surp
There’s an oft repeated quote in programming… There are only two hard things in Computer Science: cache invalidation and naming things. - Phil Karlton Sometimes naming things is hard, but it doesn’t h
This month I finished Michael E. Mann’s The New Climate War , a treatise on where we’re at with climate change. After my post on climate change a handful of people mentioned it and the book does a fan
September 16, 2022 ; Thanks to a conversation on the A11y Slack, I ran desktop browsers and screen readers through a test to see how they announce content marked up as superscript and subscript. I spu
I was refactoring some CSS on The Session over the weekend. I thought it would be good to switch over to using logical properties exclusively. I did this partly to make the site more easily translatab
Updated March 19, 2021 , originally posted December 10, 2019 ; Links to files can be a surprise for users, especially those who cannot use, do not notice, or do not have the status bar to show a link
Web designers are a passionate lot. I’m willing to bet that, if you’re reading this, you likely love what you do and enjoy sharing it with others. It seems to go hand-in-hand with such a creative prof
An emerging trend in user interface design, Dark Mode’s USP seems to be its sustainability and easing the visual strain on our eyes. But how true are these notions — and how does it fare in terms of a
The API called Web Storage provides two basic mechanisms for storing information in the user’s browser: sessionStorage and localStorage . The sessionStorage (which we won’t get into in this article),
If you want to see how accessible your website really is, visit it using a screen reader, advised JavaScript and React developer and independent contractor Cory House . House presented “Building Acces
I have an incredibly strong dislike of Tailwind, the CSS framework. Today, I wanted to talk about why. Let’s dig in! What is Tailwind? Tailwind is a utility-class library for creating UIs. Let’s say y
A vegan stereotype is any preconceived notion about vegans or veganism that is not based on fact. All vegans are hippies. Or vegans are all thin and healthy (or unhealthy) are examples of stereotyping
Contents I lied — it’s not been a whole month. Close enough, though. OK, anway, first, let’s get some setup and numbers out of the way. Setup. I set up NextDNS on my laptop and my phone. I left the ta
It’s been two years since I created this site! Things have slowed down a bit around here, mostly because some of the goals I created last year turned out to warrant a new site (with another on the way
I started my first full-time web developer job back in September of 2013 (not counting the period where I built random sites for random people). So it’s kind of like my 9 year anniversary of being abl
The CSS text-overflow property can be used to show a visual indication for text that’s been clipped by its container. I’m not a fan, and take every suitable opportunity to discourage people from using
Aug 25, 2022 Designing Better Error Messages UX About The Author Vitaly Friedman loves beautiful content and doesn’t like to give in easily. When he is not writing, he’s most probably running front-en
I can’t contain my excitement while writing the first few words for this article. Ladies and gentlemen, CSS container queries are finally here! Yes, you read that right. They’re currently supported in
Via a retweet by Sara , I saw Dan Mall ask on Twitter : Does anyone still validate their HTML? To bluntly answer the question: I validate, but only when I encounter a perplexing cross-browser issue I
The top layer sits above its related document in the browser viewport, and each document has one associated top layer. This means that elements promoted to the top layer needn't worry about z-index or
I spent years Googling “the difference between : and :: in CSS” before the information stayed in my brain. Sound familiar? Then this post is for you. First up: if you need a quick answer to the title
The details and summary elements create a simple show/hide disclosure element with only HTML . Today, I wanted to show you how you can use a touch of JavaScript to extend them into a progressively enh
Juan Fernandes