Why using a tag in nextjs Link?

Discovering NextJs, I am wondering why the a tag is needed when creating a link. Following the tutorial we have this example:

<Link href="/"><a>Back to home</a></Link>

But the link works even whitout the a tag like <Link href="/">Back to home</Link>.

What is the purpose of this a tag? Isn'it redundant with the Link component?

1 answer

  • answered 2020-08-09 09:51 Joe Lloyd

    It's for semantic html and SEO

    This gives your rendered html proper semantics. This will help with your sites over all SEO. You can see examples and full explanation in the docs here.

    If the child of Link is a custom component that wraps an tag, you must add passHref to Link. This is necessary if you’re using libraries like styled-components. Without this, the tag will not have the href attribute, which might hurt your site’s SEO.