The recent discussion of possibly making the href attribute global
brings to mind a broader issue. To what extent should semantics and
behavior belong to specific elements, and to what extent should they
be carried by global attributes that can apply to any element?
XHTML2 moves a lot of semantics and behavior from elements to global
attributes. For example, href can turn any element into a hyperlink,
and src can turn any element into an image.
HTML5 has so far not taken this approach - elements generally remain
distinct, and new behaviors and semantics appear in the form of new
elements.
In my opinion, it is usually better to put primary semantics on
elements rather than attributes. Here are a few reasons, in
approximate decreasing order of importance:
- An element is generally seen as a separate thing in itself, whereas
an attribute is just an attribute. So it is natural to think of an
element having more semantic strength than an attribute.
- Semantics that has associated behavior often has an associated DOM
API. For example, the A element has a number of attributes related to
its use as a hyperlink source, to programmatically retrieve or change
only part of the href URI. If any element could have the href
attribute, the options become omitting the API, adding it to all
elements, or (yuck) making it conditionally present on all elements
based on presence or absence of the attribute.
- It's easier (and, in many implementations, more efficient) to style
by tag name rather than by presence or absence of an attribute.
- Typically, browser implementations have an implementation class per
element, but not a class per attribute, so putting primary semantics
and behavior on an element instead of an attribute promotes clean
implementation. Otherwise, all behavior ends up in the HTMLElement
base class.
Finally, I'd like to conclude with this reductio ad absurdum of the
XHTML2 approach. If assigning behavior and semantics to attributes is
so much better, why not just have a single <elt> element:
<elt role="paragraph">My cat is really cute: <elt
src="mycat.jpeg">picture of my cat</elt>. Check out <elt
href="story.html">this <elt role="emphasis">hilarious</elt> story
about her</elt>.</elt>
I find the HTML approach much more readable and more semantically clear:
<p>My cat is really cute: <img src="mycat.jpg" alt="picture of my
cat">. Check out <a href="story.html">this <em>hilarious</em> story
about her</a>.</p>
Regards,
Maciej
