Qu'est-ce que Rel = « Noopener » et comment l'utilisez-vous avec WordPress ?

Lors de la création et de la maintenance de sites Web, nous devons toujours prendre en considération la sécurité des sites dont nous nous occupons. Les blogs ont particulièrement besoin d'un niveau de soin supplémentaire compte tenu du nombre de liens externes qu'ils ont généralement. Prendre soin des outlinks implique différentes tâches afin de toujours s'assurer qu'ils sont optimisés. L'attribut HTML rel="noopener" est l'un des outils qui aident à surveiller la sécurité de vos liens sortants. C'est une chose simple mais peut faire des merveilles pour la sécurité d'un site.

Dans cet article, nous verrons ce qu'est exactement un lien noopener et comment utiliser l'attribut rel="noopener" avec WordPress.

Qu'est-ce que l'attribut Rel = « Noopener » ?

En termes simples, l'attribut rel="noopener" est ajouté à un lien qui s'ouvre dans un nouvel onglet/fenêtre. Lorsque vous ajoutez un lien dans WordPress, vous avez le choix de sélectionner si le lien s'ouvrira dans la même fenêtre ou dans une autre. Lorsque vous choisissez d'ouvrir sur une autre fenêtre, WordPress ajoute automatiquement l'attribut rel="noopener" à votre code HTML avec l'attribut habituel target="_blank".

À quoi sert l'ajout de l'attribut rel="noopener" aux liens qui s'ouvrent dans une nouvelle fenêtre ? Tout d'abord, en termes d'expérience utilisateur et de statistiques sur les visiteurs, il est bon d'avoir des liens externes ouverts dans de nouveaux onglets, de cette façon ils ne quittent pas complètement votre site.

Mais la principale raison pour laquelle cet attribut existe est la sécurité.

Tabulation inversée

L'attribut rel="noopener" protège les sites contre les intentions malveillantes, en particulier l'attaque de phishing appelée tabnabbing inversé.

Le tabnabbing inversé se produit lorsqu'un site malveillant utilise window.opener.location.assign() pour remplacer une vraie page par une fausse. Cela fonctionne comme ceci : la page où les liens sont ajoutés, appelée la page parent, mène aux pages enfants via lesdits liens. La page enfant malveillante s'attache ensuite à la page parent avec window.opener.location.assign() et imite le site d'origine avec un faux.

Si le site imité dispose d'un widget de connexion et que l'utilisateur saisit ses informations, toutes ces informations sont volées par la page enfant malveillante. L'attribut rel="noopener" protège la page parent contre les attaques malveillantes via la tabulation inversée via les pages enfants.

Qu'en est-il de Noreferrer ?

L'attribut rel="noopener" fonctionne sur la plupart des navigateurs, à l'exception de Firefox et d'autres navigateurs plus anciens. Lorsque WordPress ajoute l'attribut rel="noopener" à vos liens par défaut, vous devez alors ajouter l'attribut rel="noreferrer" à ses côtés. Si vous avez mis à jour vers la dernière version de WordPress, les deux attributs sont ajoutés automatiquement à vos liens.

L'attribut rel="noreferrer" indiquera au navigateur de ne pas collecter les informations de référence à partir de la page principale envoyant les liens.

Voici à quoi devraient ressembler vos liens :

 <a href="https://www.example.com" rel="noopener noreferrer" target="_blank">exemple de texte d'ancrage</a>

Comment un lien Noopener est-il lié aux liens Dofollow et Nofollow ?

C'est une idée fausse commune que les liens avec l'attribut rel="noopener" sont liés aux liens dofollow et nofollow, alors qu'en fait ils ne le sont pas. La différence est que les liens noopener et noreferrer sont destinés à des fins de sécurité, tandis que les liens dofollow et nofollow concernent davantage le page rank et le référencement.

Par exemple, un lien avec un attribut rel=noopener peut être soit dofollow soit nofollow. Ce choix vous appartient. En fait, nous avons publié un article détaillé à ce sujet il y a quelque temps que vous devriez absolument consulter.

Tous les liens ajoutés sont automatiquement attribués en tant que liens suivants (dofollow). Pour vous assurer qu'ils ne sont pas suivis, vos liens doivent ressembler à ceci :

 <a href="https://www.example.com" rel="noopener noreferrer nofollow" target="_blank">exemple de texte d'ancrage</a>

Un lien Noopener affecte-t-il le référencement ?

C'est un mythe qu'un lien avec un attribut rel="noopener" peut affecter le référencement. L'utilisation de liens noopener et noreferrer n'affectera pas du tout le référencement. Les liens Dofollow et Follow affectent le SEO !

Souvenez-vous-en comme ceci :

• noopener et noreferrer : concernent la sécurité
• nofollow et dofollow : concernent le référencement et l'autorité de domaine

Quand est-ce une bonne idée d'utiliser l'attribut Rel="Noopener" ?

Vous devez utiliser l'attribut rel="noopener" sur tous vos liens à chaque fois. Sans surprise, WordPress ajoute désormais l'attribut rel="noopener" par défaut. La sécurité est extrêmement importante pour toutes sortes de sites, des blogs au commerce électronique en passant par les sites remplis de liens d'affiliation.

Dans certains cas, vous souhaiterez peut-être annuler la fonction par défaut consistant à ajouter les attributs rel="noopener" et rel="noreferral". Nous ne vous suggérons pas de le faire cependant. Cela peut ouvrir votre site à des risques de sécurité.

Qu'en est-il de vos liens d'affiliation ?

Si vous vous inquiétez de la façon dont vos liens d'affiliation sont affectés par l'utilisation des attributs rel="noopener" et rel="noreferer", vous n'avez pas besoin de le faire. La plupart des liens d'affiliation auront votre identifiant d'affilié dans l'URL elle-même, il n'est donc pas nécessaire d'envoyer des informations de référence aux pages enfants affiliées via vos liens. En fait, ajouter les attributs rel="noopener" et rel="noferrer" à vos liens d'affiliation devrait être une pratique courante. Vous ne pouvez pas toujours être sûr de la sécurité des sites dont vous vous portez garant.

Un conseil pour les liens d'affiliation : toujours un lien vers des sites dont vous pouvez être sûr qu'ils sont sûrs. Ne vous contentez pas de créer un lien vers un million de sites qui offrent des revenus d'affiliation à partir de tout ce qu'ils vendent. Vos abonnés voudront cliquer sur vos liens d'affiliation si vous êtes honnête au sujet des produits. Plus encore, si vous examinez réellement les produits au lieu de simplement remplir votre site de liens.

Dans cet article, vous trouverez de nombreux excellents programmes d'affiliation WordPress dont nous nous portons garants.

Dernières réflexions sur l'attribut Rel = "Noopener"

Dans cet article, nous avons examiné le but derrière l'attribut rel="noopener" et son compagnon l'attribut rel="noreferrer". Nous avons examiné leur objectif et comment la nouvelle mise à jour de WordPress les ajoute désormais par défaut à tous vos liens. Néanmoins, vous devriez toujours vérifier si votre WordPress le fait. Nous avons également examiné comment les liens noopener sont liés aux liens dofollow et nofollow et en quoi ils sont différents.

N'oubliez pas que l'attribut rel="noopener" existe pour protéger votre site Web et que vous devez toujours l'utiliser. Cela n'affectera pas votre référencement ni vos liens d'affiliation. Nous espérons que cet article vous a aidé à mieux comprendre tout cela et pourquoi il est important d'inclure l'attribut des liens dans tout votre contenu.

Faites-nous part de vos réflexions dans les commentaires, avez-vous déjà été victime de tabnabbing inversé ? Utilisez-vous toujours l'attribut rel="noopener" ?

Image en vedette via MarySan / shutterstock.com