19

I spy in Firebug's HTML panel:

<div class="vote"><!-- other children omitted for brevity -->
    <a title="This question shows research effort; it is useful and clear" class="vote-up-off">up vote</a>
</div>

Note that the a has no href attribute. I remember not too long ago that Pentadactyl's hint mode would detect vote buttons, for instance I could type gg f up vote 1 to vote up the question.

This is no longer the case. It seems like the vote anchors recently lost their href attribute (or something else happened that made the buttons no longer appear as "clickable" to Pentadactyl). Why is this?

I managed to work around the problem with a bookmarklet that adds href="#" to all vote buttons, but I'd like to know the reasoning behind this design choice. I suppose it's bad practice to set the href attribute if the anchor isn't supposed to send the browser to another page, but why not use <button>s instead, as demonstrated by this jsFiddle? After all, that's what <button>s are for.

2
  • 7
    Really, the anchor should be a <button type="button"> (or, if SO was going to bother with unobtrusive JS, a form with a submit button). Commented Jul 10, 2014 at 9:37
  • @Quentin Yep, and intercept the submit event if JS is available. :) Commented Jul 10, 2014 at 9:37

1 Answer 1

Reset to default
7

I am not an SO developer but I did find this:

In HTML5, using an a element without an href attribute is valid. It is considered to be a "placeholder hyperlink."

It seems perfectly valid even if it breaks your tool.

EDIT: One problem is that the vote up/down buttons are not keyboard focusable with the missing href portion. Adding in the href=# could add unnecessarily to the browser history. This post suggests the following:

<a href="javascript:void(0);"

8
  • 5
    Sure it's valid, but it's not semantic. Commented Jul 10, 2014 at 15:03
  • @Stijn: I do not understand what you mean. Commented Jul 10, 2014 at 15:04
  • 7
    Semantic means using the right HTML element, not just using valid HTML. For example, you can use <div id="footer"> which is perfectly valid, but the right element would be <footer>. Here, we vote by clicking on buttons, so <button> is the right element. Commented Jul 10, 2014 at 15:09
  • @Stijn: Understood and I can see your point. Someone from SO is going to have to chime in because its hard to know the intent. Commented Jul 10, 2014 at 15:10
  • 4
    Wasn't an a element without the href valid in HTML4 as well? As in that <a name="1337"/> would give you an anchor for the browser to go to when given an URL ending with #1337. Commented Jul 10, 2014 at 15:21
  • @EmilLundberg: I am not sure in HTML4 whether it makes the browser do as you describe but from what I have read it is valid in HTML4 also. But seems to break screen readers and apparently this tool that lets you do fancy things in Firefox with the keyboard. Commented Jul 10, 2014 at 15:30
  • 3
    @EmilLundberg That is true, but it would have to have a name then. Nowadays, this is replaced by the id, and in fact any element that has an id is an anchor. try it. :) Commented Jul 10, 2014 at 20:24
  • 4
    It seems perfectly valid even if it breaks your tool that's what she said. Commented Jul 10, 2014 at 20:42

You must log in to answer this question.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.