11

This is a technical question about the way SO implements a feature.

Why does SO use JS to direct the user to the question page if they click on the votes/number/views on the question list on the homepage? Is there an advantage to this other than cleaner HTML?

   <div onclick="javascript:window.location.href='/questions/[question location]'" style="cursor:pointer"> 
        <div class="votes"> 
            <div class="mini-counts">0</div> 
            <div>votes</div> 
        </div> 
        <div class="status unanswered"> 
            <div class="mini-counts">0</div> 
            <div>answers</div> 
        </div> 
        <div class="views"> 
            <div class="mini-counts">0</div> 
            <div>views</div> 
        </div> 
    </div> 
0

3 Answers 3

4

My guess would be that it's because putting <div>s into a <a> is 1. invalid and 2. doesn't work consistently cross-browser.

It would probably be possible to work around that using display: inline-block somehow, but that is also not consistently supported yet.

4
  • I think they could still have used to anchor tags inside the div for the same effect? That would be valid?
    – Ally
    Commented Jan 23, 2010 at 20:50
  • It is valid in HTML5 :P
    – Macha
    Commented Jan 23, 2010 at 22:11
  • @Macha: HTML5 is still way in the future :) But good to know! - Ally: That might work, but I've tried similar with crappy results, because then you won't consistently be able to give the a full width and height, making parts of the button unclickable. I think using pure JS is totally fine. DisgruntledGoat also makes some very fine points in the other answer.
    – Pekka
    Commented Jan 23, 2010 at 22:54
  • Using <span> instead of <div> would have prevented that problem. Commented May 29, 2010 at 13:46
3

I think it could be for SEO purposes:

  • It reduces the total number of links on the page - years ago there were various rumours that having over 100 links on the page is bad.
  • It reduces the link-to-text ratio, which is more of a concern than the above (e.g. Wikipedia articles have hundreds of links, but not every word is linked to something!)
  • To make sure the first link for a question contains the best anchor text. AFAIK search engines ignore subsequent links to the same page, so it's best to link to the question with its title.

The answers about <div> inside <a> may also play a part, but really are invalid since the inner elements don't need to be <div> blocks.

2
  • Very good points. The point 1 I'm not really sure about, but 2 and 3 are definitely valid.
    – Pekka
    Commented Jan 23, 2010 at 22:55
  • Nice perspective.
    – Ally
    Commented Jan 24, 2010 at 16:16
1

It's because the onclick handler is on a <div> element, not on a simple <a> link.

If you ask me, this question belongs on SO, not on meta.

3
  • It was asked there but it was moved by the powers that be. Yeah, so do you think that JS is better supported than using an anchor that fills the divider?
    – Ally
    Commented Jan 23, 2010 at 20:48
  • an anchor tag to fill the divide would add more trouble than it helps. You'll need to handle the default css behavior for anchored text and images (e.g. blue underlined text). Besides, if I recall correctly, an anchor is an inline element, not a block element, so it can't hold other divs inside it
    – Yoni
    Commented Jan 23, 2010 at 21:06
  • I know it was moved by the powers that be, I was in the middle of answer your question when suddenly the submit button became disabled :)
    – Yoni
    Commented Jan 23, 2010 at 21:07

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.