Que sont les codes de statut HTTP ?

Les codes de statut de réponse HTTP indiquent si une requête HTTP spécifique a été exécutée avec succès. Il existe de nombreux codes de statut, mais seuls quelques-uns sont significatifs dans un contexte SEO.

Examinons-les maintenant.

200

Le code de statut de succès HTTP 200 OK indique que la requête a réussi.

Pour qu'une page soit indexée par Google, elle doit renvoyer le code de statut 200. C'est ce que vous recherchez généralement pour vos pages afin qu'elles reçoivent du trafic organique. C'est le code par défaut qui sera défini lorsque Next.js rend une page avec succès.

301/308

Le code de statut de redirection HTTP 301 Moved Permanently indique que la ressource demandée a été définitivement déplacée vers l'URL de destination.

Il s'agit d'une redirection permanente. En général, c'est le type de redirection le plus couramment utilisé.

Les redirections peuvent être utilisées pour diverses raisons, mais la principale est d'indiquer qu'une URL a été déplacée d'un point A à un point B. Les redirections sont nécessaires pour s'assurer que, si un contenu est déplacé d'un endroit à un autre, vous ne perdez pas vos clients actuels et potentiels et que les robots peuvent continuer à indexer votre site.

Remarque : Les redirections permanentes de Next.js utilisent par défaut le code 308 au lieu de 301, car c'est la version la plus récente et considérée comme la meilleure option.

La principale différence entre ces deux codes de statut est qu'un 301 permet de changer la méthode de requête de POST à GET, alors qu'un 308 ne le permet pas.

Vous pouvez déclencher une redirection 308 dans Next.js en renvoyant une redirection au lieu de props dans la fonction getStaticProps().

//  pages/about.js
export async function getStaticProps(context) {
  return {
    redirect: {
      destination: '/',
      permanent: true, // déclenche une 308
    },
  };
}

Vous pouvez également utiliser la clé permanent: true dans les redirections définies dans next.config.js.

//next.config.js
 
module.exports = {
  async redirects() {
    return [
      {
        source: '/about',
        destination: '/',
        permanent: true, // déclenche une 308
      },
    ];
  },
};

302

Le code de statut de redirection HTTP 302 Found indique que la ressource demandée a été temporairement déplacée vers l'URL de destination.

Dans la plupart des cas, les redirections 302 devraient être des redirections 301. Cela peut ne pas être le cas si vous redirigez temporairement les utilisateurs vers une certaine page (par exemple, une page promotionnelle) ou si vous redirigez les utilisateurs en fonction de leur localisation.

404

Le code de statut d'erreur client HTTP 404 Not Found indique que le serveur ne trouve pas la ressource demandée.

Comme mentionné ci-dessus, les pages qui sont déplacées doivent être redirigées avec un code de statut HTTP 301 vers leur nouvel emplacement. Lorsque cela ne se produit pas, les URL peuvent renvoyer un code de statut 404. Les codes de statut 404 ne sont pas nécessairement mauvais par défaut, car c'est le résultat souhaité si un utilisateur visite une URL qui n'existe pas, mais ils ne devraient pas être une erreur fréquente dans vos pages, car cela pourrait entraîner un classement médiocre dans les résultats de recherche.

Next.js renverra automatiquement un code de statut 404 pour les URL qui n'existent pas dans votre application.

Dans certains cas, vous pouvez également vouloir renvoyer un code de statut 404 depuis une page. Vous pouvez le faire en renvoyant ce qui suit à la place des props :

export async function getStaticProps(context) {
  return {
    notFound: true, // déclenche une 404
  };
}

Vous pouvez créer une page 404 personnalisée qui est générée statiquement au moment de la construction en créant pages/404.js.

Exemple :

// pages/404.js
export default function Custom404() {
  return <h1>404 - Page non trouvée</h1>;
}

410

Le code de statut d'erreur client HTTP 410 Gone indique que l'accès à la ressource cible n'est plus disponible sur le serveur d'origine et que cette condition est probablement permanente.

Ce code n'est pas très souvent utilisé, mais vous pourriez vouloir le rechercher si vous supprimez du contenu de votre site web qui n'existera plus.

Exemples où un HTTP 410 Gone pourrait être judicieux à utiliser :

• E-Commerce : Produits définitivement retirés du stock.
• Forum : Discussions supprimées par l'utilisateur.
• Blog : Article de blog retiré du site.

Ce code de statut informe les robots qu'ils ne doivent plus revenir explorer ce contenu.

500

Le code de statut HTTP 500 Internal Server Error indique que le serveur a rencontré une condition inattendue qui l'a empêché de satisfaire la requête.

Next.js renverra automatiquement un code de statut 500 pour une erreur d'application inattendue. Vous pouvez créer une page d'erreur 500 personnalisée qui est générée statiquement au moment de la construction en créant pages/500.js.

Exemple :

// pages/500.js
export default function Custom500() {
  return <h1>500 - Une erreur côté serveur est survenue</h1>;
}

503

Le code de statut d'erreur serveur HTTP 503 Service Unavailable indique que le serveur n'est pas prêt à traiter la requête.

Il est recommandé de renvoyer ce code de statut lorsque votre site web est hors service et que vous prévoyez qu'il le sera pendant une période prolongée. Cela évite de perdre du classement à long terme.