Qu’est-ce que l’attribut rel=noreferrer ?
L’élément rel=noreferrer a une fonction bien spécifique lorsqu’il s’agit de liens hypertextes. Lorsqu’un lien est cliqué, certaines informations sur la page source peuvent être transmises à la page de destination. Cela inclut l’URL de référence qui indique d’où provient le trafic.
En ajoutant rel=noreferrer, cette transmission d’information est bloquée. L’objectif principal de l’attribut noreferrer est de préserver la confidentialité des données du référent, empêchant ainsi la page de destination de savoir quelle page a initié le transfert.
Préserve la vie privée
Utiliser rel=noreferrer contribue fortement à protéger la vie privée des utilisateurs. Parfois, les propriétaires de sites ne souhaitent pas que leurs utilisateurs soient identifiés ou suivis par les sites vers lesquels ils dirigent des visiteurs. Dans ce cas, cet attribut devient essentiel pour maintenir un anonymat en ligne.
Imaginez un site proposant des ressources sensibles ou des contenus confidentiels. Le propriétaire pourrait vouloir empêcher des tiers de savoir quels utilisateurs accèdent à ces contenus via des liens directs depuis son site web. Voilà où rel=noreferrer entre en jeu.
La compatibilité avec les navigateurs
La bonne nouvelle est que la plupart des navigateurs modernes prennent en charge rel=noreferrer. Ainsi, peu importe si un utilisateur utilise Chrome, Firefox, Safari, ou même Edge, l’attribut assurera toujours que l’URL de référence reste cachée.
Certaines versions plus anciennes des navigateurs peuvent ne pas supporter cet attribut. Cependant, la majorité des utilisateurs utilisent aujourd’hui des navigateurs récents, rendant cet attribut efficace pour une large audience.
À quoi sert l’attribut rel=noopener ?
Alors que rel=noreferrer se concentre sur la confidentialité, l’attribut rel=noopener cible un aspect différent, mais tout aussi critique : la sécurité. Lorsque vous ouvrez un lien dans un nouvel onglet ou une nouvelle fenêtre, ce dernier conserve une connexion JavaScript avec la page originale via l’objet window.opener.
Cette situation peut rendre votre site vulnérable à un type de piratage appelé tabnabbing. Les pirates peuvent rediriger l’onglet initial ouvert à partir de la nouvelle page pour tromper les utilisateurs et éventuellement récolter des informations sensibles comme les identifiants de connexion.
Renforcement de la sécurité
Intégrer rel=noopener dans vos balises <a> supprimera cette liaison dangereuse entre la page ouverte et la page d’origine. En activant cet attribut, vous garantissez que la nouvelle page n’aura aucun accès à l’objet window.opener, minimisant grandement les risques de tabnabbing.
Ceci est particulièrement important pour les sites administratifs ou financiers, où la confiance et la protection des données personnelles sont primordiales. La sécurité accrue qu’offre rel=noopener peut faire toute la différence dans ces contextes critiques.
Découpe de la chaîne d’exploitation
Les hackers exploitent souvent des chaînes complexes de vulnérabilités pour accéder aux systèmes. En incluant rel=noopener, vous réduisez autant que possible les vecteurs d’attaque, rendant votre site moins attrayant pour les cybercriminels. C’est une étape simple, mais extrêmement efficace pour sécuriser vos liens externes.
Quand utiliser ces attributs ?
Maintenant que nous comprenons mieux à quoi servent rel=noreferrer et rel=noopener, la question suivante logiquement posée serait : quand devriez-vous les utiliser ? Ces attributs sont particulièrement utiles dans plusieurs scénarios courants dont voici quelques exemples concrets.
Blogs et plateformes de contenu
Sur un blog personnel ou une plateforme de contenu, il peut être judicieux d’utiliser rel=noreferrer pour préserver la confidentialité des visiteurs. De nombreux blogueurs dirigent leurs lecteurs vers des ressources externes régulièrement. Pour éviter de divulguer des informations personnelles sur le comportement de navigation de leurs visiteurs, ils préféreront intégrer cet attribut.
De plus, si une publication traite de sujets sensibles tels que la santé mentale, les problèmes légaux, ou autres domaines où les utilisateurs pourraient rechercher des conseils confidentiels, rel=noreferrer ajoute une couche essentielle de discrétion.
Sites e-commerces
Pour les sites de commerce électronique, rel=noopener est un must absolu. Lorsqu’un client clic sur un lien externe, tel qu’un fournisseur ou une image produit hébergée ailleurs, la dernière chose qu’une entreprise souhaite est ouvrir ses clients à des attaques potentielles.
En utilisant rel=noopener, le propriétaire du site assure que la connexion entre leur propre domaine et le site externe est coupée, maximisant ainsi la sécurité des processus de navigation et de paiement.
Comment implémenter ces attributs dans le code HTML ?
L’ajout de rel=noreferrer et rel=noopener dans votre code HTML est direct et ne demande aucune compétence technique avancée. Voici un exemple simple montrant comment ces attributs peuvent être intégrés dans une balise <a> :
<a href="https://www.example.com" target="_blank" rel="noreferrer noopener">Visitez Example</a>Comme indiqué ci-dessus, ajouter simplement rel= »noreferrer noopener » dans votre balise de lien suffit à activer simultanément ces deux mesures de sécurité et de confidentialité.
Assurez-vous d’inclure target= »_blank »
Il est important de noter que ces attributs sont particulièrement efficaces lorsque combinés avec target= »_blank ». Ce dernier ouvre un nouveau lien dans un nouvel onglet ou une nouvelle fenêtre, ce qui est rarement sans conséquences mineures pour les utilisateurs finaux.
Ainsi, chaque fois que vous prévoyez d’ouvrir des liens externes dans de nouveaux onglets, pensez à intégrer rel=noreferrer et rel=noopener pour tirer pleinement parti de leurs avantages indéniables en matière de sécurité et de confidentialité.
Protégez-vous et vos utilisateurs
Bien que ces attributs soient importants, n’oubliez pas qu’ils ne remplacent pas d’autres bonnes pratiques de sécurité web. Combinez ces solutions avec SSL/TLS, firewalls, pare-feux et mises à jour régulières de logiciels pour avoir une sécurité au top constamment.
Enfin, gardez à l’esprit que rel=noreferrer et rel=noopener sont là pour augmenter votre arsenal de défense contre des menaces potentielles, mais c’est à travers une approche globale que vous obtiendrez les meilleurs résultats. Continuez donc à rester informé et actif face aux nouvelles techniques de sécurité.
