Scheduled and draft 11ty posts (opens in a new window or tab)
How to add scheduled publishing to 11ty site with a bonus for drafts.
All Links
Using Custom Property "Stacks" to Tame the Cascade (opens in a new window or tab)
In-depth examples of inventive way to use custom properties
A little bit of plain Javascript can do a lot (opens in a new window or tab)
Using plain Javascript to manipulate the UI
A Complete Guide to Dark Mode on the Web (opens in a new window or tab)
Different options and approaches to implementing a dark mode design and the technical considerations they entail.
Using Nunjucks 'If Expressions' in 11ty to create a simple active navigation state (opens in a new window or tab)
Title says it all.
Where did the focus go? (opens in a new window or tab)
Quick way to see what has focus.
Inclusively Hiding & Styling Checkboxes and Radio Buttons (opens in a new window or tab)
Different techniques for hiding elements, how each of them affects the accessibility of the content, and how to properly hide checkboxes and radio buttons taking their own accessibility and usability considerations into account to make sure we aren’t leaving any users out.
What a Year of Learning and Teaching Accessibility Taught Me (opens in a new window or tab)
Lessons and core values gleaned from learning accessibility.
How to Build HTML Forms Right: Semantics (opens in a new window or tab)
In this series, we will examine the proper steps to creating forms for the web, how to think about the code we write, and considerations to make along the way.
CSS-only Slide-up Caption Hover Effect (opens in a new window or tab)
Have you ever needed to build a UI where a caption needs to slide over an image on hover, revealing more content?
A user’s guide to CSS variables (opens in a new window or tab)
Detailed explainer with examples.
Making Our Patterns More Accessible (opens in a new window or tab)
Show and tell examples of making patterns and UI elements more accessible.
Equivalent Experiences: What Are They? (opens in a new window or tab)
To create an equivalent experience, you must understand all the different ways people interact with technology, as well as common barriers they experience.
Pixels vs. Relative Units in CSS (opens in a new window or tab)
Comparison of static versus relative units with examples and why it’s still a big deal.
Are you using SVG favicons yet? (opens in a new window or tab)
A guide for modern browsers.
Responsive Images the Simple Way (opens in a new window or tab)
Overview focused on srcset and resolution switching.
Developer tools for designers (opens in a new window or tab)
Handy list of useful dev tools tips.
Easily Use Design Tokens In Eleventy (opens in a new window or tab)
Quick how-to for setting up design tokens in Eleventy.
Myth: ARIA Has Perfect Support (opens in a new window or tab)
Just because you write code that uses ARIA does not mean the ARIA declarations will work as intended.
How to Build HTML Forms Right: Accessibility (opens in a new window or tab)
Overview of how to ensure forms are accessible.