0

Putting an anchor a around a complex div, or a container, containing more buttons and other anchors is not something valid.

What's the correct, valid, way to follow if I want this container to behave as a link to another element?

code sample:

<div class="my-container-where-i-would-like-a-link" data-href="/something">
      ...
      <a href="/something/else">a children link</a>
</div>

Right now I am considering to implement it in JavaScript, I was wondering if there were any better option.

EDIT: Please also consider how SEO unfriendly is using JavaScript to do this.

AsTeR
  • 7,247
  • 14
  • 60
  • 99
  • You may find this link helpful: http://stackoverflow.com/questions/796087/make-a-div-into-a-link – pingu Jul 31 '14 at 07:29

3 Answers3

1

Without JavaScript I can't think of a way. But the easiest way to do it with JS should be this:

<div class="my-container-where-i-would-like-a-link" onclick="window.location.href = '/something'">
Hoijof
  • 1,343
  • 15
  • 27
1

Nested anchor elements are not valid HTML so the only valid option is to use JavaScript.

Google takes links created with onclick="" into account if they are easy to interpret as links. They are taken into account as normal <a> tags. This is confirmed by Matt Cutts, the Google spokesman about referencing issues. (source: http://www.scriptol.com/seo/faq/).

This is the best way to go:

<a class="my-container-where-i-would-like-a-link" href="/something">
      ...
    <span onclick="location.href='/something/else'; return false;">a children link</span>
</a>

Use return false; to prevent firing of the parent anchor's click event.

Henri Hietala
  • 3,021
  • 1
  • 20
  • 27
0

You can do something like this

<div class="my-container-where-i-would-like-a-link" id="tempId" data-href="/something">


$("#tempId").on("click", function() {
    location.href = "something";
});
Bikas
  • 2,709
  • 14
  • 32
  • My question was to know if this is the best way. Do you have any confirmation about that ? – AsTeR Jul 31 '14 at 07:29
  • There's no issue in using JavaScript at all. In fact it'll make the code cleaner. Bear in mind that, when a child on click is performed, all the parent's on clicks are also performed. So if somebody clicks the anchor inside, the div will also take the click – Bikas Jul 31 '14 at 07:31
  • I know that there is no issue in using JavaScript, but I do see a "cleanliness" issue when setting part of the link in HTML part in JavaScript, overall for matters of SEO. – AsTeR Jul 31 '14 at 07:35