Principe de l'Offuscation

L'offuscation de liens est une technique de SEO permettant de diriger le PageRank vers des pages stratégiques en limitant l'impact des liens pointant vers des pages moins importantes.

Pourquoi ne pas utiliser le cloaking ?

Le cloaking consiste à présenter un contenu différent aux moteurs de recherche et aux utilisateurs, ce qui est contraire aux guidelines de Google (source). Même si, en pratique, cacher uniquement des liens est rarement pénalisé, il reste préférable de se conformer aux bonnes pratiques pour éviter tout risque.

Comment fonctionne l'offuscation ?

L'idée est d'éviter que Google ne détecte et ne suive certains liens tout en garantissant leur accessibilité aux utilisateurs. Pour cela, on utilise JavaScript de manière à :

Ne pas insérer de balise <a> pour les liens que l'on souhaite masquer.
Encoder les URL en Base64 (ou avec un chiffrement maison pour une meilleure sécurité).
Déchiffrer et rediriger l'utilisateur via JavaScript lors d'un clic.

Implémentation Technique

HTML

Voici un exemple où un lien est normalement visible et suivi par Google, tandis que les autres sont offusqués :

<ul>
  <li><a href="https://www.google.fr">Vrai lien (Google)</a></li>
  <li><button class="obf" rel="aHR0cHM6Ly93d3cueWFob28uZnI=">Faux lien (Yahoo)</button></li>
  <li><button class="obf" rel="aHR0cHM6Ly93d3cuZ29vZ2xlLmZy">Faux lien (Google)</button></li>
</ul>

CSS

Pour assurer une expérience utilisateur cohérente, on stylise les faux liens pour qu'ils ressemblent visuellement à des liens classiques :

a, .obf {
  font-family: calibri;
  font-size: 1rem;
  cursor: pointer;
  color: #00f;
  text-decoration: underline;
  background: none;
  border: 0;
  padding: 0;
}

JavaScript

Le script suivant décode l'URL stockée en Base64 et redirige l'utilisateur au clic :

var obfLinks = document.querySelectorAll(".obf");
for (var i = 0; i < obfLinks.length; i++) {
  obfLinks[i].onclick = function() {
    var url = atob(this.getAttribute("rel"));
    window.open(url, "_self");
  }
}

Qu'en est il de l'accessibilité ?

Sur un navigateur pour non-voyants, les boutons ne seront pas interprétés comme des liens. Si ces liens sont réellement importants pour la navigation des utilisateurs, nous vous recommandons une autre approche d'offuscation. Il s'agit de transformer dynamiquement en véritables liens <a> via JavaScript au chargement de la page. Néanmoins, google pourrait alors effectuer le rendu également. Pour empêcher Google d’exécuter cette transformation, il est essentiel de bloquer le fichier JavaScript responsable via le robots.txt.

User-agent: Googlebot
Disallow: /js/offuscation.js

Outil pour tester l'accessibilité : https://wave.webaim.org/

voici ci-dessous le code javascript à utiliser pour cette approche.

document.addEventListener("DOMContentLoaded", function() {
  var obfLinks = document.querySelectorAll(".obf");
  obfLinks.forEach(function(button) {
    var url = atob(button.getAttribute("rel"));
    var anchor = document.createElement("a");
    anchor.href = url;
    anchor.textContent = button.textContent;
    anchor.className = button.className;
    button.replaceWith(anchor);
  });
});

Améliorations Possibles

Chiffrement personnalisé : Le Base64 est facilement décodable. Pour une meilleure discrétion, utiliser un chiffrement maison.

Impact sur la Performance

Techniquement, toute exécution de code supplémentaire peut avoir un effet, mais dans la pratique, la fonction utilisée ici est extrêmement légère (quelques lignes de code seulement). Comparé aux scripts de tracking, aux bibliothèques tierces et aux autres ressources généralement présentes sur une page web, son impact est totalement négligeable sur le temps de chargement et l'expérience utilisateur.

Conclusion

L'offuscation de liens est une solution efficace pour optimiser la répartition du PageRank tout en restant conforme aux bonnes pratiques de Google. En combinant HTML, CSS et JavaScript, on peut masquer certains liens aux moteurs de recherche tout en assurant une navigation fluide pour les utilisateurs.