This isn't a long article, just a quick thought I just had.
It's no secret that one can use <custom-element>s in HTML without defining them in JS and use them only for styling.
One of the cool things about this is, ironically a restriction: Any element can only have one tag name, not several. A tag name isn't just a long list of different things that apply to an element, it's a singular statement on what it is.
That leads to an obvious question though: Isn't this what classes should be? And if that's how classes should really work, what should HTML/CSS classes be called instead?
I don't have strong thoughts on what it should be called; could be traits="...", could be mixin="...", could be anything else.
Point is, class="..." is a terrible name and should be thought of as one of those big mistakes in early web technology design, next to calling it "border-radius" rather than "corner-radius".
And despite the naming confusion, it is nice that we now have the tools to distinguish what an element is from what it does.
Top comments (6)
I'm not really sure I follow.
I suppose there's a benefit to using custom elements even if they're just for styling - if they have potential semantic meaning then they are there to be used in the future. It's just that maybe YAGNI and future developers are going to have to go on a little side-quest to find out if there's code somewhere that references it.
"class" as an attribute name works fine for me. This paragraph is in the same bucket as these others, etc. It only seems odd if you're using "class" the same as you might in an OO language. Coming from that background it might be better to use, "extends" or something. Yes, "traits" would probably be fine. But it's not an OO language!
Semantically, "utility-class framework" is the worst naming I've seen. You'd might say this paragraph has things in common with others, but it'd never be "others that have a padding of 5 pixels" because that's mind-blowingly unreasonable.
"Class" implies exclusivity, that's not just an OO thing. You're either in one class or another, but not both.
That's incorrect. You can be in the class of people who are over 18, the class of people with red hair, and the class of people who like kittens, all at the same time.
None of those are things people usually call "classes"
"traits" would have been quite a good name.
But there's nothing wrong with "class". It's "class" as in classification. We "classify" things, we don't normally "traitify" them.
And that's the point: Classes aren't a classification, they're traits. You don't normally "classify" an element by giving it a class tag, you assign additional traits to it.
CSS classes don't actually tell you what "class" of paragraph a
<p>is.