Si vous créez ou gérez un site Web, il y a de fortes chances que vous deviez à un moment donné rediriger vos utilisateurs vers une nouvelle adresse. Par exemple, vous avez peut-être déménagé vers un nouveau domaine, acheté un deuxième ou déplacé une page existante vers une autre partie de votre site. Dans certains cas, cela se fait au niveau du serveur, avec des redirections HTTP via.htaccess ou Nginx. Les redirections côté serveur ont l’avantage d’utiliser les codes d’état HTTP 3xx. Ces codes d’état indiquent à l’agent utilisateur (comme les robots des moteurs de recherche) pourquoi la redirection a été configurée, ce qui peut être utile pour le référencement. Par exemple, une redirection HTTP 301 indique que la page en question a été déplacée définitivement vers un nouvel emplacement. En revanche, les redirections JavaScript sont côté client, ce qui signifie qu’elles indiquent au navigateur de récupérer le contenu à partir d’un emplacement différent. Vous pouvez utiliser une redirection côté client comme JavaScript si :
Vous trouverez ci-dessous trois des manières les plus courantes de créer un lien de redirection en JavaScript à l’aide de l’objet de localisation, qui est une entité contenant des informations sur l’URL actuelle.
Définir une nouvelle propriété window.location.href
Il a également tendance à être pris en charge par plus de navigateurslocation.href », assurez-vous de ne pas configurer la redirection pour qu’elle s’exécute automatiquement, sinon l’utilisateur sera bloqué dans une boucle de redirection chaque fois qu’il essaiera de revenir à la page précédente. Au lieu de cela, envisagez de le lier à une action de l’utilisateur. Si vous ne voulez pas qu’ils puissent revenir en arrière, envisagez plutôt d’utiliser la fonction « window.location.replace ».
Redirection à l’aide de la méthode location.assign()
Du point de vue d’un utilisateur, une redirection utilisant « window.location.assign() » ressemble à la définition d’une nouvelle propriété href, comme dans l’exemple précédent. Ceci est dû au fait:
Voici à quoi cela ressemble :window.location.assign(‘https://www.ExampleURL.com/’);Malgré les similitudes, « location.assign() » est différent de « location.href » dans quelques points importants façons. Location.assign() appelle une fonction pour afficher le document situé à l’URL spécifiée. Selon votre navigateur, cela peut être plus lent que de simplement définir une nouvelle propriété href. Cela peut également être considéré comme une option plus sûre que la définition d’une nouvelle propriété href, car si le lien cible est rompu ou n’est pas sécurisé, la fonction lancera une exception DOMException. En JavaScript, une DOMException est un message d’erreur qui peut se produire lors de l’appel d’une fonction ou de l’accès à une propriété.Conseil de pro : Si vous devez rediriger vers un domaine distinct à l’aide de location.assign(), vous devez utiliser HTTPS. Si vous ne le faites pas, votre redirection ne fonctionnera pas et lèvera à la place une exception pour une erreur de sécurité.
Redirection à l’aide de la méthode location.replace()
Comme « location.assign() », « window.location.replace() » appelle une fonction pour afficher un nouveau document situé à l’URL spécifiée. Cela ressemble à ceci : window.location.replace(‘https://www.ExampleURL.com/’ ); Contrairement à la définition d’une nouvelle propriété d’emplacement ou à l’utilisation de « location.assign() », la méthode de remplacement ne crée pas de nouvelle entrée dans l’historique de vos sessions. Au lieu de cela, il remplace l’entrée actuelle, ce qui signifie que les utilisateurs ne peuvent pas cliquer sur le bouton de retour et revenir à la page précédente de pré-redirection. En tant que telle, cette méthode est idéale si vous souhaitez utiliser JavaScript pour empêcher les utilisateurs d’afficher la page à partir de laquelle vous les éloignez. Cette méthode a des forces et des faiblesses similaires à location.assign(), en ce sens qu’elle :
/h2>
Si vous implémentez des redirections sur votre site de quelque manière que ce soit, il est préférable d’auditer régulièrement votre site avec un outil tel que Site Audit. Bien que l’audit du site ne soit pas en mesure de rendre JavaScript, il peut identifier une variété de vérifications liées à la redirection, notamment :
Les redirections de toutes sortes peuvent être utiles pour votre site, mais il est important de les mettre en œuvre correctement afin d’éviter les problèmes techniques de référencement. Si vous débutez ou souhaitez pratiquer JavaScript, vous pouvez visiter un site Web comme W3Schools, qui propose un « TryIt Editor » interactif pour JavaScript, HTML, CSS, et plus :
Réflexions finales : vérifiez toujours votre travail
Utilisées efficacement, les redirections (JavaScript et autres) peuvent avoir un impact majeur sur l’expérience utilisateur sur votre site Web, guidant les utilisateurs vers le contenu le plus pertinent pour leurs besoins. Cependant, développer et maintenir un site Web est un processus compliqué et les erreurs peuvent être coûteuses. Si vous voulez que vos utilisateurs aient la meilleure expérience possible, il est crucial que vous vérifiiez votre travail de manière rigoureuse. L’audit de site peut faciliter ce processus en automatisant les vérifications de votre site, en identifiant les problèmes les plus critiques ayant une incidence sur les performances et l’expérience utilisateur de votre site, et en fournissant des conseils sur la façon de les résoudre.
