Corregir 'Links do not have descriptive text' - Gatsby - Lighthouse

Corriendo Lighthouse SEO en mi blog, encontré el error "Links do not have descriptive text". Revisando el sitio de google developers se puede encontrar el error bien explicado.

Básicamente, lighthouse nos advierte que tanto para bots como para personas será dificil comprender a donde lleva el link con el texto utilizado. Algunas ejemplos de palabras poco descripitvas son: click here, click this, this, here, click, ir, inicio y otras. En mi caso, el error es lanzado debido al siguiente link:

<li>
  <a href="/">Inicio</a>
</li>

Como podemos observar, la palabra inicio no es descriptiva (esto lo dice lighthouse, personalmente, creo que inicio tiene una intención clara en un menú, pero... lo corregiremos, siempre solucionamos todo lo posible, especialmente si queremos ser indexados y monetizados por google). La solución en este caso es bastante simple, cambiaremos el texto del link para que sea más descriptivo:

<li>
  <a href="/">Página de Inicio</a>
</li>

Ojo que para insertar los links en Gatby debemos importar Link de React. Veamos un componente muy sencillo utilizando Links:

import React from "react";
import { Link } from "gatsby";

const Nav = () => {
  <ul>
    <li>
      <Link activeClassName="active-link" to="/">
        Página de Inicio
      </Link>
    </li>
    <li>
      <Link activeClassName="active-link" to="/contacto">
        Sobre nosotros
      </Link>
    </li>
  </ul>;
};

export default Nav;

Y ahora, corremos lighthouse nuevamente y...

Por fin, 100 en SEO, lo cuál no es demasiado dificil realizando un sitio con Gatsby.

Y eso es todo por ahora, keep coding!!!