Comment by zoogeny
2 years ago
I am a reluctant convert to tailwind. I've been doing HTML since the 90s, before CSS was even really usable for things like page layout. I mean, we didn't even use div in those days - it was table based layouts and spacer gifs.
CSS appeals to a programmers mindset. Cascading seems like a good idea. Having classes that are reusable seems like a good idea. Complex selectors seem like a good idea. These are all forms of abstraction, almost like functional composition but not quite.
But after decades of fighting with it, I have to admit that it just doesn't work. The myth that you could change an entire site design just by changing the CSS is a complete myth. I've been party to more than a few whole site redesigns and I can assure anyone unfamiliar that it involved a heck of a lot more than updating CSS (and more than HTML in almost every case as well).
In fact, almost all advancements in CSS (including Sass and Less) seemed to tend toward isolating the effect of changes. Pretty soon most projects had a compenent.html/component.scss pair for every fragment and naming conventions like BEM [1] became the norm. Reusability for things like fonts and colors were handled with CSS variables.
Tailwind is proof to me that isolation is more important for visual design than abstraction/inheritance/cascading. Inline styles would be the same advantage but they are way too verbose.
> The myth that you could change an entire site design just by changing the CSS is a complete myth.
You should tell that to this site which has been doing exactly that for 20 years: https://csszengarden.com/
I am old enough to remember when the css zen garden first came out!
I've seen hundreds and hundreds of clever tech demos. I even believed in some of them for a time. Now I realize they were carefully constructed gimmicks.
css zen garden is made explicitly to do one thing and it manages to do that one thing. It's hard for me to even say that it does it very well, clicking through the featured designs. Unfortunately, the dream of redesigning a website that wasn't purpose-made for this particular trick remains but a dream.
I'm also old enough to remember that.
But I think it was clear from the very beginning that it was meant to be aspirational. Nobody is really claiming that today with CSS you can arbitrarily change the design of a page just by modifying CSS. If you look at the evolution from earlier designs on the CSS zen garden to later ones, it's clear that advances in CSS itself has made some designs possible. The ::before and ::after pseudo elements I believe are one of these advances that are critical.
> Unfortunately, the dream of redesigning a website that wasn't purpose-made for this particular trick remains but a dream.
I'm not disagreeing that this is a dream. I'm stating that it is meant to be a dream gradually becoming real.
1 reply →
> You should tell that to this site which has been doing exactly that for 20 years: https://csszengarden.com/
Easy to do when you don't actually have to update the content or functionality. And even with those advantages, most versions of it look bad.
BEM sucks then you die.
I wasn't a huge fan of BEM but it solved a real problem. The fact that sucky BEM was better for large teams than being without it shows how bad CSS design is.
There was nothing more annoying than including a component on a page and some aspect of the component was visually broken. Like a margin inflated somewhere or a wrong color. And then time would be wasted trying to figure out what was cascading/inheriting. Worse case it was some CSS included at runtime by some JS script that was forced onto the team by marketing. But on large teams there was just a constant collision between page authors, component authors and other stakeholders.
HTML Web Components tried to solve the problem by making the shadow dom isolated but in our experimentation the support was just too inconsistent across browsers. It was also a major pain to debug at the time (maybe this has gotten better?)
I was completely against Tailwind, absolutely hated looking at it and I even used my position as a senior engineer at a company to block its adoption. I felt it flew in the face of the entire premise of CSS and the high-ideal of separating form and content. I now believe I was wrong.
> I felt it flew in the face of the entire premise of CSS and the high-ideal of separating form and content.
I mean, you were right about that one. It's just that the entire premise of CSS is wrong and its ideal doesn't work.