Améliorez votre référencement avec les RSC

Le SSR — et par extension, les RSC — peut vraiment vous aider à améliorer votre référencement ! Découvrez comment procéder dans cet aperçu.

Sur le Web d’aujourd’hui, le référencement est roi. Même si c’est quelque chose que nous aimerions ignorer, ce n’est tout simplement pas possible. Le référencement (optimisation des moteurs de recherche) est l’art d’obtenir un meilleur classement de votre site Web sur divers moteurs de recherche, augmentant ainsi la visibilité de ce que vous avez créé. Internet est incroyablement vaste et la plupart des gens ne trouveront votre travail que s’il apparaît dans les moteurs de recherche lorsqu’ils recherchent des mots-clés associés.

Certains des moyens les plus courants d’améliorer le référencement concernent les balises méta, l’utilisation du langage et des termes appropriés dans votre copie, y compris le texte alternatif ou des fonctionnalités d’accessibilité similaires, ainsi que d’autres approches basées sur le contenu. Mais saviez-vous que vos décisions en matière de développement d’architecture peuvent également avoir un impact ? C’est vrai : les applications qui utilisent le rendu côté serveur (SSR) présentent de nombreux avantages, notamment (roulements de tambour, s’il vous plaît…) un référencement amélioré ! Si vous créez des applications React, cela signifie adhérer aux RSC, l’approche React de la SSR.

Si vous êtes arrivé jusqu’ici et que vous pensez : « Mec, il y a beaucoup d’acronymes que je ne connais pas ! » – ne vous inquiétez pas ; tu n’es pas seul. Vérifier cette introduction à la RSS, à la RSE, aux RSC et plus encore pour vous familiariser avec les termes et la technologie auxquels nous ferons référence dans le reste de cet article.

Comment fonctionne le référencement ?

Avant de pouvoir plonger dans l’impact du SSR sur le référencement, nous devons d’abord prendre du recul et examiner les bases du fonctionnement du référencement.

Les moteurs de recherche analysent le contenu des sites Web et des applications Web selon un processus appelé « exploration ». Dans le cadre du processus d’exploration, le code HTML d’une page est lu et « indexé » – stocké dans l’index du moteur de recherche. Cela inclut l’examen du contenu et du texte de la page, le suivi de divers liens intégrés, le catalogage du titre de la page et des méta-informations, et bien plus encore. Ce que le moteur de recherche essaie de faire, c’est de comprendre de quoi parle la page, afin qu’il soit capable de renvoyer des informations pertinentes lorsque l’utilisateur recherche un mot-clé spécifique.

Par exemple, si vous avez un site consacré à la préparation du croissant parfait, alors naturellement le texte, les images, le titre, etc. de votre page mentionneront les croissants, la pâtisserie, les recettes, les ustensiles de cuisine – vous voyez l’idée. Lorsque les robots des moteurs de recherche chargent votre site Web, ils considèrent ces éléments comme des indices sur le sujet de votre page. Ils parcourent la page, cataloguent tout cela et l’ajoutent à leur index. Ensuite, lorsque quelqu’un recherche « recettes de croissants faciles », votre site apparaît dans l’index du moteur de recherche en tant que contenu associé et est proposé à l’utilisateur.

Quel est l’impact du SSR sur le référencement ?

Vous avez peut-être remarqué un détail important dans cette dernière section : lorsque les robots d’exploration parcourent un site Web, ils analysent le HTML. Pour ceux d’entre nous qui créent des applications Web, cela peut poser un problème, car la grande majorité de ce que nous faisons est en JavaScript. Maintenant, bien sûr, cela est (éventuellement) rendu au format HTML parce que c’est ce dont le navigateur a besoin… mais cela ne se produit pas toujours tout de suite, ni exactement comme on pourrait s’y attendre.

L’approche populaire du développement d’applications Web ces dernières années a été le rendu côté client (CSR). En fait, jusqu’à l’introduction des RSC, il s’agissait de la principale méthode utilisée dans le développement de React. Techniquement, il existait des moyens de réaliser un rendu côté serveur dans React avant les RSC… mais c’était fastidieux et pas très populaire. C’est une généralisation assez sûre de dire que la plupart des applications React, jusqu’à présent, utilisaient la RSE.

Malheureusement, la RSE ne fonctionne pas particulièrement bien avec le référencement. Dans le cas du CSR, le code HTML n’est généralement pas affiché lorsque les robots d’exploration accèdent pour la première fois au site. Dans cet espace entre la récupération sur le serveur et le chargement dans le navigateur de l’utilisateur, notre application est principalement constituée d’un fichier HTML vide et de certains React (pas encore lisibles). Cela signifie qu’il n’y a pas de titre de page, de contenu, d’images – quoi que ce soit, vraiment – ​​que les robots d’exploration puissent indexer. Pas idéal.

Comment pouvons-nous améliorer le référencement avec les RSC ?

La bonne nouvelle est que le SSR – et par extension, les RSC – aide vraiment à résoudre ce problème d’exploration SEO. Cela se produit de plusieurs manières principales, toutes séquentielles et liées :

Le chargement initial plus rapide…

Les applications avec SSR ont généralement un chargement initial plus rapide (ou TTFB : temps jusqu’au premier octet) car le gros du travail de rendu se fait sur le serveur plutôt que dans le navigateur. Au moment où le contenu arrive dans le navigateur, il est prêt à être utilisé : tout ce que le navigateur a à faire est de le proposer. Cela signifie que les éléments sont opérationnels et prêts à être analysés au moment où les robots d’exploration atteignent votre site : plus de code HTML vide.

… Mène à une meilleure exploration…

Étant donné que le code HTML est rendu avant d’atteindre le navigateur, le processus d’exploration lui-même est également amélioré. Tout votre contenu est facilement accessible : en-têtes, balises de paragraphe, images, balises méta, etc., avec moins de JavaScript embêtant. Cela signifie que lorsque votre site est exploré, les moteurs de recherche comprendront quel contenu s’y trouve réellement.

… Ce qui signifie une indexation améliorée !

Ces deux éléments nous conduisent à notre objectif final amélioré : une indexation meilleure et plus précise. Lorsque les moteurs de recherche peuvent facilement charger et explorer votre site, ils obtiennent de meilleures informations, et ces informations vont directement dans leur index, qui est référencé lorsque l’utilisateur effectue une recherche.

Essayez-le !

Si vous êtes un progrès KendoRéagir utilisateur, il est particulièrement facile de commencer à mettre en œuvre des RSC et de récolter tous ces avantages SEO intéressants. Nous sommes fiers d’être les premiers à adopter Composants du serveur React! Désormais, vous pouvez améliorer votre classement dans les recherches (ainsi que profiter de nombreux autres avantages) tout en continuant à utiliser les composants KendoReact magnifiques, accessibles et performants que vous connaissez et aimez déjà. Essayez-le et dites-nous ce que vous en pensez !