4

I have a question similar to the one posted here.

I'm building a React application which has very strict SEO requirements, so I'm wondering if the following approach is an issue:

For all of our navigation/routing, we're using onClick handlers that push the user to the new location within the app. The way I've built the components means that the generated HTML does not have anchor tags, and thus there are no links/hrefs anywhere in the application.

Can googlebot handle this? Even if it can, I have a feeling it may adversely affect crawlers' ability to properly index the linking structure within the app.

If this is an issue, I will need to add links to everything, and simply prevent the default behavior before triggering the route. This way the crawler would at least be able to see links with href attributes in the HTML that point to the proper URLs.

Unfortunately, since this is a new application, it's not publicly available yet for me to test using the Fetch as Google tool.

Improve this question
1
  • You need links for Googlebot even if you intercept the clicks and show users the same content without refreshing the page.
    – Stephen Ostermiller ♦
    Mar 13, 2018 at 23:12

3 Answers 3

Reset to default
3

Googlebot should be able to handle onclick links. You can test it by seeing the crawl frequency of Googlebot in search console and seeing if it crawls the onclicks.

Javascript is unreliable and it's hard to say if Google will be able to see it 100% of the time, but tests have been performed and shown that Google does crawl onclick links.

We also tested standard JavaScript links. These are the most common types of JavaScript links that SEOs have traditionally recommended be changed to plain text. These tests included JavaScript links coded with:

Functions outside of the href Attribute-Value Pair (AVP) but within the a tag (“onClick”) Functions inside the href AVP (“javascript:window.location“) Functions outside of the a but called within the href AVP (“javascript:openlink()”) etc. Result: The links were fully crawled and followed.

Source: https://searchengineland.com/tested-googlebot-crawls-javascript-heres-learned-220157

Improve this answer
1
  • That link is helpful, thanks for sharing. One nuance I noticed is they mention onClick handlers on <a> tags, but I have onClick handlers on all kinds of non-anchor elements. Based on these findings, I'm going to add links in parallel to onClicks just to be safe. We may test this out once the app is live.
    – carl
    Mar 14, 2018 at 16:53
0

See here for an explanation to a similar question.

Also, here is a supporting article from Google.

Improve this answer
0

Google could probably handle onclick links but you should make a test before your app is finished. Nonetheless, I prefer the old fashion way to link in order to make easier the searchers job and avoid problems.

Have in mind that the Google's ajax crawling method was deprecated a few years ago and that could be because they are able to read the DOM, not just the source code (question 37).

As I said, I would use normal links but if you have to keep the onclick property, you should use:

  • Fetch as Google tool in order to make sure links are visible
  • HTML sitemap somewhere on the site
  • XML sitemap submitted to Google Search Console (and Bing)
Improve this answer
1
  • " they are able to read the DOM, not the source code", the referred link does not says that, and obviously it could read the source code of page downloaded from the http server
    – Andre Figueiredo
    Jun 10, 2019 at 19:49

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.