Why is CSS So Weird?

CSS is the design language of the web — one of three core web languages — but it also seems to be the most contentious and often perplexing. It’s too easy and too hard, too fragile and too resilient. Love it or hate it, CSS is weird: not quite markup, not quite programming in the common (imperative) sense, and nothing like the design programs we use for print. How did we get here?

I’ve seen some people claim that “CSS is for documents” — as though HTML and JavaScript weren’t also originally for documents. The entire web was for documents, but that hasn’t stopped us from pushing the medium to new extremes. This is a young platform, and all the core languages are growing fast, with CSS advancing leaps and bounds over the last few years.

But there is a real problem: the web is fundamentally device-agnostic, and therefor display-agnostic. The original website from CERN states the problem clearly:

This implies no device-specific markup, or anything which requires control over fonts or colors.

Here we are, putting fonts and colors on the web. But it’s worth taking a step back and asking: what does it even mean to design for an unknown and infinite canvas? This problem isn’t new, it’s not going away, and there are no simple answers – but if we’re going to talk about it, we have to understand the fundamental audacity of the task.

Design on the web will always be weird – but CSS is a living document, and we have the power to keep making it better.

About Miriam Suzanne

Miriam is a co-founder at OddBird, with 15 years experience as a project manager, user-experience designer, and front-end developer. She’s a member of the Sass core team, staff writer for CSS Tricks, and creator of popular open-source tools like Susy, True, and Herman. Miriam is also a musician with Teacup Gorilla, a published novelist & playwright, and a featured speaker at conferences around the world.

More articles by Miriam Suzanne…


7 comments

  1. unter

    It’s not css, it’s you.

    October 2nd, 2019 at 11:36

    Reply

  2. Ann

    WOOOOOOOOOT?
    CSS is the easiest thing in life, I don’t think is weird… weird is that react is a library and not framework, weird is that facebook may be stealing information from our codes, codes that uses react XD, ok too much paranoia..

    Regarts!

    October 3rd, 2019 at 09:52

    Reply

  3. oz123

    Thank you for this clear and concise video!

    October 5th, 2019 at 08:50

    Reply

  4. Preston Bannister

    How did we get here? Easily. Early in the HTML5 process, found folk who were in absolute belief everything as-yet undefined could be in declarative terms.

    That did not work. Sorry. Tried.

    Not surprised at any of this. Soaked up the notion of domain-specific languages from AI courses in the late 1970s. Turn your head sideways, and HTML/CSS/Javascript is a dis-integrated domain-specific language.

    October 5th, 2019 at 22:25

    Reply

  5. Matthias

    It does not need to be:

    https://korban.net/posts/elm/2019-11-17-elm-ui-introduction/

    October 7th, 2019 at 22:33

    Reply

  6. Gralogic

    Thank you for post!

    October 9th, 2019 at 12:32

    Reply

  7. H.E.A.T.

    You raise a few interesting considerations about today’s web. Once thought of as a platform for textual documents, now that web has turned into an accommodation platform.

    We’re no longer talking about documents, colors, or even fonts, but also THINGs (IOT). The web started off simple (with few participants), then became a Frankenstein’s monster of parts that were not naturally organic to the web.

    CSS and HTML made attempts to keep up, but at one point a truth will have to be considered: forgo backward compatibility and take the inevitable evolutionary jump forward with the web.

    October 10th, 2019 at 08:51

    Reply

Post Your Comment