[whatwg] href on any element

[Matthew Raymond]

Kornel Lesinski wrote:
>>> My current solution is:
>>> <tr onclick="this.getElementsByTagName('a')[0].click()">
>>
>>    This can be accomplished by having <a> elements in each individual
>> cell...
> 
> Of course it can, but it bloats code a lot. You have to add several  
> redundant links, add tabindex=-1 to avoid breaking keyboard navigation,  
> move all table and cell styles to anchors, and if cells contain block  
> elements you have to bloat your code even more.

   It didn't occur to me until recently, but the behavior you originally
described isn't desirable from an interface design standpoint. How is a
person supposed to highlight and copy specific information within an
given cell in the row? Furthermore, if two cells next to each other have
the same hyperlink, but the row has a different hyperlink, it's not
entirely clear what happens if you click the space between the two
cells. With hyperlinks for each cell, or even each block, the worst that
happens is that the hyperlink doesn't get clicked, whereas with a
potential |href| attribute would have to handle nested hyperlinks and
multi-block hyperlinks that imply a grouping of elements without
necessarily encouraging a parent element with the semantics necessary to
identify the nature of that grouping.

   That said, I'd also like to point out that most of your arguments for
|href| fall into the category of convenience rather than necessity.

>>> Another situation where I wanted href on any element was advertisement:
>>>
>>> <div href="/buy">
>>> <p>My product is:</p>
>>> <ul>
>>> <li>Cool</li>
>>> <li>Great</li>
>>> <li>And soo semantic</li>
>>> </ul>
>>> </div>
>>    People don't typically don't initiate a purchase in a user interface
>> by clicking on the product description.
> 
> Make it href="/info" then. Sometimes it doesn't make sense to have  
> separate page for each listed detail.

   The fundamental problems with the UI design don't really go away when
you change the purpose of the hyperlink. You still have the problem that
people don't necessarily expect that clicking anywhere on an entire
list, or even the opening paragraph, would lead to another page. It also
has issues with interacting the individual elements of the list, just
like you would with cells in a row.

> Of course you can live without href on every element if you apply a bit of  
> scripting and CSS tricks, but the same thing can be said about almost  
> every thing in WHATWG specifications.

   The difference here is that the potential for poor interface design
goes up significantly. In fact, |href| could be used as a means of
preventing the user from interacting with an element and its descendants.

> It can have some backwards-compatibility. AFAIK XHTML/2 allows nested  
> anchors, so I'd use it like this:
> 
> <tr href=".."><td><a href="..">anchor</a></td><td>no anchor</td><td>no  
> anchor</td><td>no anchor</td></tr>

   Problem is that you essentially have to do all the stuff you
complained about earlier to get full backwards compatibility...

> With some scripting (see first code in this post) this could work in  
> current browsers and had fallback for bots and non-JS agents.

   With some scripting, you could just use the scripting trick you
showed in an earlier example, so what's the point? Just use that little
bit of scripting:

| <tr onclick="this.getElementsByTagName('a')[0].click()">