rel noopener : sécuriser vos liens sortants pour le référencement naturel

Êtes-vous conscient que vos liens sortants, ces portes d'entrée vers d'autres sites, pourraient potentiellement compromettre l'intégrité de votre propre plateforme web et même affecter votre positionnement dans les résultats des moteurs de recherche ? Il existe une parade simple et efficace pour vous prémunir contre ces risques : l'attribut HTML rel="" . Cette modeste addition à vos balises de lien peut avoir un impact considérable sur la robustesse de votre site et sa performance en matière de SEO. Alors, comment un attribut aussi discret peut-il générer un tel avantage ?

Cet article vous accompagnera à travers l'univers des liens externes, en détaillant le rôle et le fonctionnement de l'attribut rel="" , en expliquant pourquoi il est fondamental pour la protection de votre site et comment il peut influencer positivement votre référencement organique. Nous aborderons également l'attribut complémentaire rel="" , en comparant leurs spécificités et en vous guidant dans le choix de la combinaison la plus pertinente pour vos besoins. Que vous soyez un propriétaire de site, un développeur web, un expert en SEO ou un créateur de contenu, vous trouverez dans ce guide les informations et les recommandations dont vous avez besoin pour garantir la sûreté de vos liens externes et optimiser votre présence sur les moteurs de recherche.

Le problème : la vulnérabilité `window.opener`

Avant d'explorer les aspects techniques de la solution, il est indispensable de bien comprendre l'enjeu que rel="" vise à adresser : la vulnérabilité window.opener . Cette faille de sécurité, présente dans certains navigateurs, donne la possibilité à un site web ouvert via un lien externe d'accéder et, dans certains cas, de manipuler la page d'origine qui a initié le lien. Cela peut paraître anodin, mais cette capacité peut être exploitée à des fins malhonnêtes, mettant en péril vos visiteurs et la réputation de votre site. Il est donc crucial d'appréhender le fonctionnement et les vecteurs d'exploitation de cette vulnérabilité pour saisir pleinement l'importance de la solution que nous allons détailler.

Qu'est-ce que `window.opener` ?

D'un point de vue technique, window.opener est une propriété JavaScript qui permet à une page web ouverte via un lien (en employant la balise <a> avec l'attribut target="_blank" ) de solliciter la fenêtre (ou l'onglet) qui l'a engendrée. Cela sous-entend que le site web de destination peut, potentiellement, agir sur la page d'origine via JavaScript. Bien que cette fonctionnalité puisse se révéler utile dans certains scénarios légitimes (par exemple, pour renvoyer des informations à la page d'origine après un traitement), elle peut également être compromise par des personnes malintentionnées. La simplicité de son implémentation renforce l'importance de bien cerner les dangers potentiels.

Voici un exemple de code basique qui illustre le mécanisme de window.opener :

 <a href="http://example.com" target="_blank">Ouvrir example.com</a> <script> // Sur example.com (le site ouvert) if (window.opener) { window.opener.location.href = "http://monsitepirate.com/page_de_phishing"; } </script> 

Dans ce cas précis, si example.com s'avère être un site malveillant, le script JavaScript pourrait rediriger la page d'origine (celle qui contenait le lien) vers un site de phishing, potentiellement en reproduisant une page de connexion bancaire ou un autre service sensible. L'internaute, retournant à l'onglet initial, pourrait ne pas détecter la supercherie et divulguer ses identifiants sur le site frauduleux.

Comment la vulnérabilité est exploitée : `tabnabbing` / `reverse tabnabbing`

La technique d'exploitation de cette faille de sécurité est appelée "tabnabbing" ou "reverse tabnabbing". Elle s'appuie sur le fait que l'utilisateur, après avoir cliqué sur un lien externe, peut se laisser distraire par d'autres tâches et ne pas constater immédiatement les modifications opérées sur la page d'origine. Ce décalage temporel dans l'attention de l'utilisateur offre aux pirates l'opportunité d'agir discrètement et de tirer parti de la vulnérabilité. Comprendre le déroulement précis de cette attaque est indispensable pour prendre conscience des risques et mettre en place les protections adéquates.

Voici la succession d'événements typique lors d'une attaque de tabnabbing :

• Un internaute clique sur un lien sortant de votre site, ce qui ouvre un nouveau site dans un onglet ou une fenêtre distincte.
• Le site web ouvert, s'il est compromis, emploie du code JavaScript pour obtenir l'accès à la page d'origine via window.opener .
• Le site malveillant procède ensuite à la modification de l'URL de la page initiale, la substituant par une page de phishing mimant une page de connexion à un service populaire (banque, réseau social, etc.).
• L'utilisateur, après avoir passé un certain temps sur le site infecté, revient à l'onglet initial.
• L'utilisateur, se croyant sur la page d'origine, saisit ses identifiants sur la page de phishing.
• Les identifiants sont alors récupérés par les cybercriminels.

L'astuce réside dans le fait que l'utilisateur ne remarque généralement pas que la page d'origine a été altérée. Le site de phishing est conçu pour imiter parfaitement le site légitime, rendant la fraude complexe à identifier. C'est pourquoi il est vital de se prémunir contre cette vulnérabilité en adoptant l'attribut rel="" .

Conséquences de la vulnérabilité

Les répercussions de la vulnérabilité window.opener peuvent être dévastatrices, tant pour vos visiteurs que pour votre site web. Le vol d'identifiants et d'informations confidentielles est la conséquence la plus directe, mais les dommages peuvent s'étendre bien au-delà. La dégradation de la confiance des utilisateurs et l'atteinte à la notoriété de votre site sont des conséquences indirectes mais tout aussi graves. De surcroît, un site compromis peut être pénalisé par les moteurs de recherche, aboutissant à une détérioration de son positionnement et de son trafic.

• Détournement d'identifiants et de données sensibles: Les pirates informatiques peuvent exploiter la vulnérabilité pour s'emparer des identifiants de connexion, des informations bancaires et d'autres données personnelles de vos utilisateurs.
• Dégradation de la réputation du site initial: Si vos utilisateurs sont victimes de tabnabbing en raison d'un lien présent sur votre site, ils risquent de perdre confiance en votre plateforme et de la juger non sécurisée.
• Influence potentiellement néfaste sur le SEO: Les moteurs de recherche comme Google accordent une importance particulière aux sites protégés. Un site compromis risque de subir une pénalisation et de perdre des positions dans les résultats de recherche.

En conclusion, la vulnérabilité window.opener est un danger sérieux qui ne doit pas être pris à la légère. Il est impératif de prendre les dispositions nécessaires afin de protéger vos visiteurs et votre site web contre cette menace. Heureusement, la parade est simple et facile à déployer : l'attribut rel="" .

Pourquoi les navigateurs anciens étaient-ils vulnérables ?

Les anciennes versions des navigateurs web ne disposaient pas des mécanismes de sécurité nécessaires pour isoler les pages web ouvertes au moyen de liens externes. Cela se traduisait par le fait que le site de destination avait un accès direct et sans restriction à la page d'origine par le biais de window.opener . Au fil du temps, les navigateurs ont évolué et ont mis en place des mesures de sécurité pour minimiser ce risque. Néanmoins, la vulnérabilité peut encore être présente dans des navigateurs plus anciens ou mal configurés. C'est pourquoi il est crucial d'utiliser rel="" afin de garantir une protection optimale, même pour les internautes utilisant des navigateurs obsolètes. Par exemple, les versions d'Internet Explorer antérieures à la version 12 présentaient des faiblesses plus importantes face à cette vulnérabilité.

La parade : `rel=""` et `rel=""`

À présent que nous avons clarifié l'importance de la protection des liens externes et le danger que représente la vulnérabilité window.opener , il est temps d'examiner les solutions disponibles. Fort heureusement, il existe une méthode simple et performante pour se défendre : l'intégration des attributs rel="" et rel="" . Ces attributs, ajoutés aux balises de lien, permettent de gérer le comportement des liens sortants et d'écarter les attaques de tabnabbing. Analysons en détail le mode de fonctionnement de ces attributs et la façon de les employer correctement.

`rel=""` : le rempart de sécurité

L'attribut rel="" représente la solution la plus simple et la plus pertinente pour se prémunir contre la vulnérabilité window.opener . Son rôle consiste à bloquer l'accès à la page d'origine via window.opener , interdisant ainsi au site de destination de manipuler ou de rediriger la page initiale. En d'autres termes, il établit une barrière de protection qui isole la page de départ du site web accessible au moyen du lien externe. L'usage de cet attribut est vivement recommandé pour tous les liens qui s'ouvrent dans un nouvel onglet ou une nouvelle fenêtre. Il est compatible avec la majorité des navigateurs modernes, y compris Chrome, Firefox, Safari et Edge.

D'un point de vue technique, rel="" signale au navigateur d'ouvrir le lien dans un processus indépendant, ce qui empêche le site de destination d'accéder à la page source par l'intermédiaire de window.opener . En conséquence, même si le site de destination s'avère malintentionné, il ne pourra pas modifier la page d'origine et subtiliser les informations de vos visiteurs. La protection s'avère donc directe et efficace, sans nécessiter de paramétrages compliqués. De plus, il est à noter que cet attribut n'altère pas la performance de la page d'origine.

Voici un fragment de code qui illustre l'usage de l'attribut rel="" :

<a href="http://example.com" target="_blank" rel="">Lien externe sécurisé</a>

Pour vérifier que l'attribut est bien implémenté, vous pouvez utiliser les outils de développement de votre navigateur (généralement accessibles via F12). Inspectez le code HTML du lien et assurez-vous que l'attribut `rel=""` est bien présent. Vous pouvez également utiliser un service en ligne d'analyse de liens pour vérifier l'état des attributs de vos liens sortants. Certains services analysent la présence des attributs rel et , et signalent les liens qui ne sont pas sécurisés.

`rel=""` : l'alternative plus radicale

L'attribut rel="" offre une alternative plus radicale que rel="" . Non seulement il bloque l'accès à la page d'origine via window.opener , mais il empêche en sus le navigateur d'envoyer des informations de provenance (l'URL de la page de départ) au site de destination. Par conséquent, le site de destination ne connaîtra pas l'origine du trafic, ce qui peut s'avérer utile dans certaines situations, mais peut aussi occasionner des répercussions sur le suivi des performances de vos liens sortants. Il est important de noter que l'usage de cet attribut peut impacter la capacité de certains outils d'affiliation à fonctionner correctement.

Concrètement, lorsque vous utilisez rel="" , le navigateur ne transmet pas l'en-tête HTTP "Referer" au site de destination. Cet en-tête renferme l'URL de la page source, ce qui permet au site de destination de déduire d'où proviennent ses visiteurs. En bloquant cette information, vous protégez la confidentialité de vos utilisateurs et vous évitez de communiquer des données concernant votre site web à des tiers. Néanmoins, il est crucial de garder à l'esprit que cela peut également affecter le suivi des performances de vos liens sortants dans les solutions d'analyse web.

Voici un exemple de code qui présente l'usage de l'attribut rel="" :

<a href="http://example.com" target="_blank" rel="">Lien externe (sans provenance)</a>

`rel=" "` : la combinaison performante

Dans la majorité des cas, l'association des attributs rel="" et rel="" constitue la solution la plus adéquate. Elle propose une sécurité optimale en neutralisant à la fois l'accès à la page d'origine via window.opener et la transmission d'informations de provenance au site de destination. Cette combinaison assure une protection renforcée de vos visiteurs et de votre site web, tout en vous donnant un contrôle total sur la diffusion d'informations. Cependant, il est primordial d'appréhender les conséquences de l'usage de rel="" sur le suivi des performances de vos liens sortants. En utilisant des paramètres UTM, il est possible de compenser cette perte d'information.

En combinant les deux attributs, vous bénéficiez des atouts de chacun : la sécurité de rel="" et la confidentialité de rel="" . Cela vous permet de mettre vos visiteurs à l'abri des attaques de tabnabbing tout en évitant de révéler des informations sensibles concernant votre site web à des tiers. Cette démarche prudente et responsable est vivement conseillée par les experts en protection web.

Voici un exemple de code qui met en évidence la façon d'associer les attributs rel="" et rel="" :

<a href="http://example.com" target="_blank" rel=" ">Lien externe protégé et anonyme</a>

Choisir le bon attribut : `` vs ``

Le choix entre et dépend de vos nécessités et de vos priorités. Si votre principale préoccupation est la protection, alors est une option idéale. Si vous souhaitez en plus garantir la confidentialité de vos utilisateurs et prévenir le partage d'informations avec des sites tiers, alors est à envisager. L'association des deux attributs propose le niveau de protection le plus élevé, mais il est primordial d'intégrer les conséquences de l'usage de sur le suivi des performances de vos liens. Il est donc important de considérer toutes les options avec leurs avantages et leurs inconvénients.

Attribut	Fonctionnement	Avantages	Inconvénients	Cas d'utilisation
rel=""	Empêche l'accès à la page d'origine via window.opener	Protection maximale contre le tabnabbing	Aucun inconvénient majeur, compatible avec la plupart des navigateurs	Recommandé par défaut pour tous les liens sortants
rel=""	Neutralise l'envoi d'informations de provenance	Confidentialité accrue, prévient le partage d'informations délicates	Absence de données de provenance dans Google Analytics, peut affecter le fonctionnement de certains outils d'affiliation	Liens d'affiliation, campagnes de marketing où l'anonymat est important

En général, il est recommandé d'intégrer rel="" par défaut pour tous les liens sortants qui s'ouvrent dans un nouvel onglet ou une nouvelle fenêtre. Si vous employez des liens d'affiliation ou si vous conduisez des actions de marketing où l'anonymat est essentiel, vous pouvez également envisager d'adopter rel="" . Toutefois, il est indispensable de mettre en place un suivi approprié (au moyen de paramètres UTM) afin de pallier l'absence de données de provenance dans Google Analytics. Pensez également à vérifier la compatibilité de cet attribut avec vos outils d'affiliation.

Mythes et réalités sur `rel=""` et le SEO

Une idée reçue persiste selon laquelle l'utilisation de rel="" nuit au SEO. En réalité, cet attribut n'exerce aucun effet négatif direct sur votre positionnement dans les moteurs de recherche. Les algorithmes de Google et les autres moteurs de recherche ne pénalisent pas les sites web qui font usage de rel="" . En réalité, dans certains cas, le recours à cet attribut peut même s'avérer favorable pour le SEO, en renforçant la protection et la confidentialité de votre site.

La principale préoccupation concernant rel="" réside dans la perte de données de provenance dans Google Analytics. Lorsque vous employez cet attribut, Google Analytics n'est pas en mesure de connaître la page d'origine en tant que source de trafic, ce qui peut compliquer le suivi des performances de vos liens. Afin de résoudre cette problématique, l'utilisation de paramètres UTM (Urchin Tracking Module) est nécessaire. L'utilisation des paramètres UTM permet de suivre l'origine du trafic, même avec rel="" , en ajoutant des informations complémentaires à l'URL de vos liens sortants. Ces paramètres vous permettent d'analyser les performances de vos liens et de les ajuster au mieux.

Déploiement et bonnes pratiques

À présent que nous avons exploré les tenants et les aboutissants de rel="" et rel="" , il est temps de passer à la mise en œuvre pratique et de voir comment intégrer ces attributs à votre site web. Il existe plusieurs méthodes pour joindre ces attributs à vos liens sortants, selon votre plateforme et vos compétences techniques. Nous allons examiner les différentes alternatives disponibles, en vous communiquant des instructions claires et des recommandations pratiques pour une mise en place réussie.

Ajout manuel de l'attribut

La méthode la plus simple et la plus directe pour adjoindre les attributs rel="" et rel="" consiste à les spécifier manuellement à vos balises de lien HTML. Cela peut être fait directement dans le code source de vos pages web. Cette technique est une solution simple et performante, surtout si vous n'avez qu'un petit nombre de liens à corriger. Cependant, il est important de bien inspecter le code pour ne pas faire d'erreur.

Pour ajouter manuellement l'attribut rel="" ou rel="" , il vous suffit d'éditer le code HTML de votre page web et d'intégrer l'attribut souhaité à la balise <a> de chaque lien sortant. Par exemple :

<a href="http://example.com" target="_blank" rel=" ">Lien externe sécurisé</a>

Il est important de bien vérifier le code HTML pour ne pas avoir d'erreurs de syntaxe ou de fautes de frappe. Une simple erreur peut compromettre la protection de votre site, donc il est nécessaire de faire preuve de rigueur. Il est également conseillé de valider votre code HTML à l'aide d'un validateur en ligne pour vous assurer qu'il respecte les standards du web.

Utilisation de plugins WordPress (et autres CMS)

Si vous utilisez un CMS (Content Management System) comme WordPress, de nombreux plugins permettent d'automatiser l'ajout des attributs rel="" et rel="" à vos liens. Ces extensions peuvent vous faire gagner du temps et de l'énergie, spécialement si vous avez un nombre important de liens à modifier. De plus, ils diminuent le risque d'erreurs humaines lors de l'ajout manuel des attributs. Avant de faire votre choix, vérifiez que le plugin est compatible avec votre version de WordPress et que sa note est correcte.

• Avantages: Simplicité d'utilisation, gain de temps, automatisation de la procédure.
• Inconvénients: Dépendance vis-à-vis des plugins, potentiels problèmes de compatibilité avec d'autres plugins ou thèmes, impératif de mettre à jour les plugins.

Voici quelques exemples de plugins WordPress qui facilitent l'ajout de `rel=""` et `rel=""` :

• Rel Nofollow Checkbox
• External Links – , new tab, accessibility
• All in One SEO (AIOSEO)

Avant d'installer un plugin, il est crucial de vérifier sa compatibilité avec votre version de WordPress et avec les autres plugins que vous utilisez. Il est également recommandé de consulter les avis des utilisateurs et de sélectionner un plugin fiable et fréquemment mis à jour. La robustesse de votre site web dépend de la crédibilité des plugins que vous utilisez. Il est donc important de faire preuve de prudence.

Intégration dans les éditeurs de texte enrichi (WYSIWYG)

La majorité des éditeurs de texte enrichi (WYSIWYG) vous permettent de définir les attributs rel="" et rel="" directement lors de la conception de liens. Cette méthode est particulièrement utile si vous ajoutez régulièrement de nouveaux liens sortants. L'avantage de cette technique est que vous n'êtes pas obligé de manipuler directement le code HTML.

Dans la plupart des éditeurs WYSIWYG, vous pouvez accéder aux options avancées du lien et ajouter les attributs rel="" et rel="" dans un champ dédié. L'interface peut différer en fonction de l'éditeur, mais le principe est identique : vous devez trouver les options avancées du lien et spécifier les attributs souhaités. Une mise en œuvre directe vous assure que les nouveaux liens respecteront les bonnes pratiques dès leur création. Si vous utilisez un CMS, référez-vous à la documentation du CMS pour avoir plus d'informations sur l'ajout de ces attributs.

Influence sur le SEO

L'intégrité de votre site web exerce une influence indirecte mais importante sur votre SEO. Les moteurs de recherche comme Google valorisent les sites sécurisés et de confiance. Un site compromis peut être pénalisé et perdre des places dans les résultats. En renforçant la protection de votre site contre les attaques de tabnabbing, l'attribut rel="" participe à améliorer la sécurité et, en conséquence, à optimiser votre SEO. Les attributs rel servent de moyen pour les moteurs de recherche pour analyser les liens, et la crédibilité et l'autorité de votre site sont des facteurs importants pour se positionner correctement.

`rel=""` et le SEO : comment gérer la perte de données de provenance ?

Tel que mentionné précédemment, l'usage de rel="" peut entraîner une perte de données de provenance dans Google Analytics. Néanmoins, il existe une solution simple pour contrer cette difficulté : l'utilisation de paramètres UTM (Urchin Tracking Module). Les paramètres UTM vous permettent de contrôler la source du trafic, même avec rel="" , en ajoutant des informations supplémentaires à l'URL de vos liens. Avec ces paramètres, vous pouvez examiner l'efficacité de vos opérations marketing et identifier les sources de trafic les plus rentables.

Voici un exemple de lien avec des paramètres UTM :

<a href="http://example.com?utm_source=monsite&utm_medium=article&utm_campaign=promotion" target="_blank" rel=" ">Lien externe avec UTM</a>

Dans cet exemple, les paramètres UTM permettent de suivre le trafic provenant de votre site (utm_source=monsite), de l'article qui comporte le lien (utm_medium=article) et de l'opération de promotion concernée (utm_campaign=promotion). Ces données vous permettent d'analyser les performances de vos liens et d'ajuster votre stratégie SEO. Il existe des générateurs de liens UTM qui vous permettent d'ajouter ces paramètres de manière simple et efficace.

Tendances à venir et éléments à considérer à long terme

L'environnement de la protection web est en évolution permanente, et il est essentiel de se tenir au courant des dernières tendances et des bonnes pratiques. Les navigateurs, les CMS et les plugins sont régulièrement actualisés afin de corriger les vulnérabilités et améliorer la protection. Il est donc crucial de maintenir votre site web à jour et de vérifier régulièrement l'intégration de rel="" et rel="" sur l'ensemble de votre site. De plus, il faudra s'adapter aux nouvelles formes de menaces. La sécurité d'aujourd'hui n'est pas la sécurité de demain.

L'importance de la maintenance à long terme

La sécurité web n'est pas une action occasionnelle, mais bien un processus à mettre en place dans la durée. Il est essentiel de vérifier régulièrement l'application de rel="" et rel="" sur l'intégralité de votre site, de mettre à jour vos plugins et vos thèmes, et de vous renseigner sur les dernières menaces et les recommandations. Une maintenance régulière permet de garantir la sécurité de votre site sur le long terme. Le coût de cette maintenance est plus faible que le coût d'une attaque.

Quelques recommandations pour une maintenance continue :

• Contrôler régulièrement l'intégration de rel="" et rel="" sur l'intégralité de votre site.
• Actualiser vos plugins et vos thèmes dès que des mises à jour sont disponibles.
• Se tenir informé des dernières menaces et des bonnes pratiques en matière de sécurité web.
• Mener des audits de protection de façon périodique afin de mettre en lumière les vulnérabilités.

Sécuriser les liens sortants : un atout pour votre site web

En conclusion, l'attribut rel="" est un outil simple mais puissant pour assurer la sécurité de vos liens sortants et mettre vos utilisateurs à l'abri des attaques de tabnabbing. Combiné à l'attribut rel="" , il procure une protection maximale tout en vous permettant de contrôler le partage d'informations. En intégrant ces attributs et en mettant en place un suivi adéquat, vous pouvez améliorer la sûreté de votre site, renforcer la confiance de vos visiteurs et optimiser votre SEO.

Prenez les mesures nécessaires dès aujourd'hui pour protéger vos liens sortants et votre site web. La sécurité est un facteur important de succès pour votre site web !