3

When running a Lighthouse check on my site, I received the following error under SEO:

Links are not crawlable

Search engines may use href attributes on links to crawl websites. Ensure that the href attribute of anchor elements links to an appropriate destination, so more pages of the site can be discovered. Learn More

The link that could not be crawled is a#main-content, which is the "Skip to main content" link.

This is the page's HTML:

<a href="#main-content" class="visually-hidden focusable"> Skip to main content </a>

..navbar..

<a id="main-content" tabindex="-1"></a>

As far as I know, this structure is completely fine and doesn't present any real problems for Google or any other search engine. So what's the best way to address this error for this specific link?

I am trying to automate the Lighthouse reports in my CI pipeline, and I want to minimize the number of known errors.

1
2

For this problem in Lighthouse 7.1.0, I use

<span id="main-content" tabindex="-1"></span>

and it works fine.

2
  • In other words you are using <span> tags instead of <a> tags? – Stephen Ostermiller Mar 16 at 21:35
  • yes. correct, i using <span> tags instead of <a> tags. – Cangurin limpiezas Mar 18 at 8:52
1

It seems that Lighthouse only complains if <a> is missing href, even if that link is marked nofollow, so one way to fix this is to point the "Skip to main content" link at something other than <a>.

Before:

<a id="main-content" tabindex="-1"></a>

After:

<main role="main" id="main-content">

Normally I would avoid workarounds to match the eccentricities of the evaluation tool, but in this case it's only one change for one link on a site with hundreds of pages.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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