The right way to apply JavaScript to your links for SEO
Google’s Martin Splitt explains why fragment identifiers don’t get crawled and the importance of href attributes.
The right way to create links. Using the HTML <a> tag with the destination URL in the href attribute is the most straightforward way to create a link. For example, <a href=”https://example.com”>link</a>.
You can also add JavaScript to a link, allowing you to upgrade its functionality. One example of this might be when a user clicks on a pop-out hamburger menu on one of your pages — the JavaScript could be used to intercept the href and display the hidden hamburger menu.
Don’t leave out the href attribute. It may be tempting to eliminate the href attribute and “clean up” your code, but doing so means that the link will only work if your JavaScript is also functioning properly. Crawlers only access content pointed to with href attributes and if there’s a bug, users can’t access the content the JavaScript is pointing to.
Think twice about fragment identifiers. Fragment identifiers, which are distinguished by a “#” symbol within a URL, point to subsections of a given page, not necessarily a different page. For example, example.com/FAQ#subsection would take the user to a specific point on the page example.com/FAQ.
“Because fragments aren’t meant to point to different content, crawlers ignore them; they just pretend that the fragments don’t exist,” Splitt said. This means that if you build a single-page application with fragment identifiers, crawlers will not follow those links.
Why we care. Creating links that Google can crawl will help it understand what your site content is about and increase your chances of ranking well for relevant queries. And, while it is not common, some users may choose to browse with JavaScript turned off; when that’s the case, adhering to these practices will ensure that your links still function correctly.