How the same content always has multiple different versions: "The same content can create clarity for one person and confusion, stress, or exclusion for another, without changing a single word." #a11y a11yblog.com/2026/01/30/h...

Some #CSS only contrast options until contrast-color() is Baseline widely available piccalil.li/blog/some-cs...

Unstacking #CSS Stacking Contexts: "Stacking contexts are incredibly useful, but they’re also widely misunderstood and often mistakenly created, leading to a slew of layout issues that can be tricky to solve." www.smashingmagazine.com/2026/01/unst...

Names Are Hard But They Don't Have To Be: "When someone encounters a form that rejects their name, they don't think 'this is a technical limitation.' They think 'this company doesn't want me.' and they aren't wrong." toddl.dev/posts/names-...

Styling ::search-text and Other Highlight-y Pseudo-Elements: "The new ::search-text pseudo (Chrome 144) matches are yellow while the current target (::search-text:current) is orange, but ::search-text enables us to change that." #CSS css-tricks.com/how-to-style...

Lowering the specificity of multiple rules at once: "You probably already knew that you can use `:where()` to lower the specificity of a single selector, but did you know that you can achieve a similar effect on multiple rules at once?" #CSS www.matuzo.at/blog/2026/lo...

I Learned The First Rule of ARIA the Hard Way: "Semantic HTML does a lot more accessibility work than we usually give it credit for already — and ARIA is simple to abuse when we use it both as a shortcut and as a supplement." #a11y css-tricks.com/i-learned-th...

How to Favicon in 2026: Three files that fit most needs: "Prefer SVG over PNG, trust browsers to downscale, drop obscure formats—the ultimate, exhaustive guide to favicons for modern web. Includes steps for static HTML and Webpack." evilmartians.com/chronicles/h...

Common misconceptions about testing accessibility: "Teams either overestimate what tools can do, underestimate their own role, or assume testing is something that happens once only, at completion of the development process." #a11y tetralogical.com/blog/2026/01...

Touch Targets and Web Accessibility: "Learn about touch target accessibility standards and WCAG guidelines. Discover why 24x24px or 44x44px targets improve usability for all users with code examples." #a11y www.sitepoint.com/touch-target...

Better defaults for popovers: "I would argue that in most cases you want your popovers aligned closely with the button that controls them. As it turns out, that's super easy to achieve with #CSS anchor positioning, since popovers already have an implicit anchor." www.matuzo.at/blog/2026/be...

Responsive Hexagon Grid Using Modern #CSS: "A while back, Temani tacked a repeating grid of hexagon shapes. Well, he’s updated it with modern CSS features that result in fewer magic numbers. And it’s impressive!" css-tricks.com/responsive-h...

Rethinking “Pixel Perfect” Web Design: "Amit Sheen takes a hard look at the 'Pixel Perfect' legacy concept, explaining why it’s failing us and redefining what 'perfection' actually looks like in a multi-device, fluid world." #CSS www.smashingmagazine.com/2026/01/reth...

Understanding the fundamentals of #CSS Layout: "Have you ever struggled to understand why the browser put the element where it did? Do you think CSS is hard to work with? By getting a better understanding of the fundamentals, you’ll learn to 'see the matrix'." polypane.app/blog/underst...

#SVG Filters are just amazing! - "So, lately, I have been exploring Haley Park’s website and it’s pretty cute and well designed. What caught my attention, though, was this water ripple effect on one of the text snippets." www.amitmerchant.com/svg-filters-...

Beware the faux bold (and how to fix it): "I don’t know if it’s just me, or if something’s happened in the last few months, but I keep seeing faux bolds everywhere. The fix is tiny and simple." #CSS clagnut.com/blog/2438

Adding shadows to irregular shapes in #CSS with filter: drop-shadow(): "Using box-shadow you can add shadows to any rectangular HTML element. But you can also use filter: drop-shadow() to add shadows to irregular shaped images." www.wearedevelopers.com/en/magazine/...

Responsive Hexagon Grid without Media Queries: "Using modern #CSS to create a responsive hexagon grid. corner-shape to create the hexagon shape and sibling-index() combined with math functions to conditionally apply a margin to only the first element of every other row." css-tip.com/hexagon-grid/

Responsive and fluid typography with Baseline #CSS features: "Learn how to use Baseline CSS features to create typography that responds to the user with accessibility and developer ergonomics in mind." web.dev/articles/bas...

Don't Fall Into the "Accessibility Grade/Score" Trap: "Accessibility scores are attractive because they simplify what is complex, but they collapse lived experience into a number that can never reflect the needs of actual people." #a11y buttondown.com/access-abili...

A Minimal #CSS Starter: "What would you include in a CSS starter, as a CSS minimalist? Submitting not a reset—yet perhaps five and a half surgical tweaks." meiert.com/blog/a-minim...

Common misconceptions about implementing accessibility: "Knowing how to start implementing accessibility and sustain it over time isn't always straightforward. Teams often wonder who is responsible, which tools to use, and when it should be considered." #a11y tetralogical.com/blog/2025/12...

#HTML Input Validation is (maybe) Good: "You can use the Constraint Validation API to layer on accessible messages with a bit of #JavaScript. That way you get the browser's validation working as a baseline, and then enhance it to be accessible when JS is available." www.htmhell.dev/adventcalend...

Different Page Transitions For Different Circumstances: "In #JavaScript, you can detect a view transition happening, set a type, and have #CSS do unique things based on that type." frontendmasters.com/blog/differe...

Replacing #JavaScript with just #HTML: "As time marches on, and the HTML and CSS methods gain traction, we need to start replacing the old JS methods that feel so comfy with new methods that require less JS." www.htmhell.dev/adventcalend...

Recreating Toon Text With #CSS And #SVG: "In this article, pioneering author and web designer Andy Clarke shows his techniques for creating Toon Text titles using modern CSS and SVG." www.smashingmagazine.com/2025/12/smas...

Class names for content not design: "If you make the class names design and layout specific, you will have to edit your #HTML files every time you want to change these elements their position or design, instead of only editing the #CSS file." www.htmhell.dev/adventcalend...

Toggle `position: sticky` to `position: fixed` on Scroll: "Fixed and sticky positioning behave very differently, but we can switch between the two at exact points for some unusual looking effects." #CSS frontendmasters.com/blog/toggle-...

Abbreviations done right: "Skip the <abbr> element altogether. It creates a false sense that your abbreviations are accessible. Clearly spell out each abbreviation the first time you use it, and then stick to the short form for the rest of the text." #a11y www.htmhell.dev/adventcalend...

Connecting Circles With #CSS Anchor Positioning: "Not only is the arrow dynamic, but the shape adjusts according to the distance between the circles. And if they touch each other, the link disappears. Collision detection using pure CSS!" css-tip.com/connected-ci...

The three semantics of #HTML: "There is always that one elephant in the room alongside HTML – semantics. You can ignore it for quite a while, but at the end of the day, you'll need to acknowledge that it's there, cluttering half of the space." www.htmhell.dev/adventcalend...

Forced Colors Mode: "The most important thing when designing for forced colors mode is making things obvious. This browsing mode is often used by people who are not blind but do have vision issues, people who suffer migraines from lots of color, and so on." #CSS gomakethings.com/forced-color...

For the Love of <details> - "It can do so much out of the box but paired with some creative #HTML and #CSS, it’s easy to imagine dozens of uses for the <details> element that do not compromise on performance, accessibility or SEO visibility." www.htmhell.dev/adventcalend...

Vanilla #CSS is all you need: "You might not need Sass or PostCSS. Native CSS has variables, nesting, and color-mix(). You might not need Tailwind for every project. Especially if your team understands CSS well enough to build a small design system." www.zolkos.com/2025/12/03/v...

The #HTML Elements Time Forgot: "These obsolete tags represent experiments in web development—some more successful than others. They're a reminder that the web platform we use today is the result of decades of trial, error, and evolution." www.htmhell.dev/adventcalend...

Pausing a #CSS animation with getAnimations(): "When you call getAnimations(), you can get the currentTime of the animation’s timeline, or the playback state of the animation (playState), or in our case, actually pause the animation with pause()." #JavaScript cassidoo.co/post/pause-c...

Styling by Language: "Japanese text usually needs more line height to breathe. Kanji often appear denser and more detailed than Latin letters. Western fonts can feel too “light” next to Japanese text. This is where the lang attribute becomes your best friend." #CSS www.htmhell.dev/adventcalend...

!important and #CSS Custom Properties: "The `!important` part doesn't become part of the value, the whole declaration is treated as !important;" frontendmasters.com/blog/importa...

Semantics beyond the tag name: "To actually write semantic #HTML, we need to know what elements mean beyond just what we infer from their tag names and how to use them. So, how do we find that out?" www.htmhell.dev/adventcalend...

The what, how, and why of CSS clamp(): "clamp() lets you assign a value to a CSS property between a minimum and a maximum range, and uses a preferred value in that range. It’s really helpful for responsive layouts and typography!" cassidoo.co/post/css-cla...

Forms are a badly designed part of #HTML: "Although the newly standardized form elements and features all point into the right direction, they are incomplete and unfinished. The fact that this is still the case after more than ten years is alarming." www.htmhell.dev/adventcalend...

text-decoration-inset is Like Padding for Text Decorations: "It solves a problem that we’ve had since the beginning of the web, which is that text decorations such as underlines extend beyond the first and last characters, resulting in vertical misalignment." #CSS css-tricks.com/text-decorat...

Don't leave the screen reader hungry: "Screen readers don’t always announce what’s visually on screen. This article explores that gap - through the medium of burritos." #a11y www.htmhell.dev/adventcalend...

The <time> element should actually do something: "This would be amazing, and I’d love to see browsers and screen readers make use of <time> like this. But for now, it’s just kind of an inert relic of the early HTML5 days." #HTML nolanlawson.com/2025/12/14/t...

Giving pages a clear shape by using headings: "Make sure that: text that functions as a heading is marked up as a heading; text that does not function as a heading is not marked up as a heading; headings reflect the content structure;" #HTML www.htmhell.dev/adventcalend...

Common misconceptions about disability: "Disability is often misunderstood or misrepresented online and in mainstream media. In this post, we look at some common misconceptions surrounding disability." #a11y tetralogical.com/blog/2025/12...

Them’s the Breaks: "<br> for the rare break that’s actually part of the content (poems, addresses, etc.); <wbr> for weird run-on strings; &shy; for very occasional hyphenation in prose; &nbsp; when you must avoid a break at all cost;" #HTML www.htmhell.dev/adventcalend...

🎉 CSS Basics is going on break for the holidays. See you in the new years!

You Can’t Make Something Accessible to Everyone: "This post’s title is unpleasant, but it’s important to acknowledge the reality of the human condition and limitations in technologies. Even purpose-built assistive tech." #a11y adrianroselli.com/2025/12/you-...

Non-Square Image Blur Extensions: "I recently came across a demo which creates the blur extension effect by placing a div with a blur() beneath the image and I couldn’t help but think a simpler solution should be possible with a single image and minimal #CSS." frontendmasters.com/blog/non-squ...