fisshy / react-scroll

React scroll component
https://github.com/fisshy/react-scroll/blob/master/README.md
MIT License
4.36k stars 437 forks source link

SEO problem (Link not crawlable) #495

Closed chinhoe closed 2 years ago

chinhoe commented 2 years ago

First of all, thanks for the helpful library.

Just want to ask here to see if this happens to anyone else too. I had a website that uses react-scroll's Link and Element. Few months ago, the SEO was still 100 until recently when I did another lighthouse test, and the SEO dropped to 90 saying that the links are not crawlable.

Just wondering if there is something that I can do on my side to fix this?

image

fisshy commented 2 years ago

Have you tried adding the href tag?

chinhoe commented 2 years ago

Have you tried adding the href tag?

Do you mean passing the href as a prop to react-scroll's Link? Currently what I have is a shared component using Link which I created by referring to the usage in the docs.

image

Update: I added href in the Link and indeed it solved the problem. Thank you.

DaniSido commented 2 years ago

Hi everyone, may I know what you have put inside the href? because if I put '#' the plugin no longer works, while if I leave it empty the error in the SEO persists .... thank you

chinhoe commented 2 years ago

Hi everyone, may I know what you have put inside the href? because if I put '#' the plugin no longer works, while if I leave it empty the error in the SEO persists .... thank you

image

For my case, its just a single page website, so I just put '/' in the href. I assume it should work the same even if you have a website with multiple page, as in using the current page's url (e.g: /home, /about).

The reason I did not use the Element's id is because it will try to redirect my page to https:your-domain.com/<element-id> when I click on the link in browser's element inspect tool.