Skip to main
Link
Miriam on stage talking and gesturing
in front of a projection screen
wearing a yellow leather jacket
and white-blue-pink lightning-bolt earrings

Embracing the Universal Web

CSS-Tricks asked a number of web builders the same question…

What about building websites has you interested this year?

There are constantly new features appearing in browsers – from subgrid to variable fonts to better developer tools. It’s a really great time to be re-thinking everything we know about design on the web. Responsive design has served us well over the years, but it’s still rooted in the limitations of the web from 2010. Ten years later, we’re able to create more “Intrinsic” designs (a term coined by Jen Simmons) and hopefully re-think some “best practices” that are now holding us back.

See more at CSS-Tricks »

That’s exciting but even more interesting to me in the context of a universal web. I began my career during the height of the Web Standards Project, CSS Zen Garden, Designing with Web Standards, and A Dao of Web Design – saturated in the philosophy of universally accessible design. CSS was relatively new, and explicitly designed to balance the desires of a web-creator (like me) with the needs of each individual user (also me), on any number of devices. Terms like “progressive enhancement” and “unobtrusive JavaScript” dominated the industry. We were moving away from “only works in X browser” warnings, to embrace an accessible and resilient user-centered medium.

Over the years, some of those concerns have become industry best-practice. CSS is now standard, and responsive design is the norm. But I also see (and build!) more and more apps targeted at a narrow range of modern, evergreen browsers. Or we ignore new features for years in order to support a browser like IE11. We’ve become resigned to a sense that browser support is binary, and we can only use the features that exactly match our “supported” browsers.

There are many reasons for that shift, including excitement around very cool new features. I don’t think it’s surprising for an industry to have these cycles, but I do think it’s time to reflect on where we’re heading. New CSS features are designed with universal accessibility in mind, and we also have new features for managing browser-support on a continuum, much like viewport-size.

Whatever we want to call it Intrinsic Design, Resilient CSS, Progressive Enhancement, Universal Accessibility, or something else – I think we’re poised for a new movement and a new era of web creation. It’s time for us to take the lessons we learned from Responsive Web Design, adapting to screen sizes, and expand out: adapting to screen readers, legacy browsers, “smart” speakers, and any number of other interfaces.

I’m interested in new methodologies and conventions that move past managing specificity and cascade, or phones and laptops, to help us all manage accessibility and universal compatibility. I’m interested in finding ways to embrace all that is wonderful and new on the web, without abandoning the beautiful vision of a universal web.

We have the tools. Let’s do this.

  1. Sass logo in black
on top of bright oklch color gradient
    Link post type

    Sass Color Spaces (Request for Comments)

    A new proposal for color management in Sass

    There’s been a lot of exciting work in the CSS color specifications lately, and since the new features are already starting to land in browsers, we’ve been preparing to add support in Sass as well. My proposal for that is published and ready for public feedback!

    see all Link posts
  2. fragment of an inverted triangle with the cascade --
cascade layers are highlighted below element-attached styles
and above specificity
    Link post type

    A Complete Guide to CSS Cascade Layers

    Cascade layers are a new CSS feature that allows us to define explicit contained layers of specificity, so that we have full control over which styles take priority in a project without relying on specificity hacks or !important. This guide is intended to help you fully understand what cascade…

    see all Link posts
  3. A whole CSS-art cabinet of single-div objects drawn by Lynn Fisher,
from a mirror and skull, to abacus, clock, viewfinder, plants,
snow globe, hot air balloon, and lightsaber.
    Link post type

    Very Extremely Practical CSS Art

    CSS-Tricks asked a number of web builders the same question…

    What is one thing you learned about building websites this year?” I’ve always enjoyed the CSS art people create, but I’ve never ventured into it much myself. I’m familiar with many of the tricks involved, but still find it surprising every time: the way people are able to…

    see all Link posts