Welcome to WebmasterWorld Guest from 18.204.48.199

Forum Moderators: phranque

Message Too Old, No Replies

Show "#" or "URI" in href when link is overidden by JS

     
5:17 pm on Mar 3, 2019 (gmt 0)

Senior Member

WebmasterWorld Senior Member Top Contributors Of The Month

joined:Apr 1, 2016
posts:2740
votes: 839


I have a page where I have two version of the same image to display on the page. Below the image I have two buttons, "show v1" and "show v2". The v1 images appears by default when the page loads, and when the "show v2" button is clicked by the user the "v2" image is displayed in place of the "v1" image. The buttons are not <button> tags but <a> tags styled as buttons and there is a JS script that use e.preventDefault() to prevent the page for going to the link address. As such the value of the href attribute is moot, typically I would make it "#", but in this case I'm wondering if there is a benefit from an SEO perspective to include the URL.

I realize that users surfing with JS disabled (typically bots and a few people here), when clicking the link, will be directed to the image specifically. This is not the intention from a usability perspective, as I would prefer that user sees the image within the context of the page.
1:20 am on Mar 4, 2019 (gmt 0)

Administrator

WebmasterWorld Administrator phranque is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:Aug 10, 2004
posts:11873
votes: 245


i would consider linking to the same base url with a query string appended, so that the server knows to respond with a reference to the v2 image in the document.
then i would supply a link rel canonical referring to the base url so they both don't get indexed.
3:40 pm on Mar 4, 2019 (gmt 0)

Senior Member

WebmasterWorld Senior Member Top Contributors Of The Month

joined:Apr 1, 2016
posts:2740
votes: 839


so they both don't get indexed.

Getting both indexed was kind of the point of adding the URL's to the link. I don't think my characterization as "v1" and "v2" was accurate. The images are graphs of stats, "v1" shows the data graphed according to 1 dimension and "v2" shows the data graphed for another dimension. switching between the two graphs allows the user to compare the data across both dimensions. But individually the graphs still have value. It is like time to complete activity for men and time to complete activity for women.

Since posting I have implemented it with url included in the link. It has simplified the JS script enormously. Is there any reason not to do this?