Introduction de sites Javascript<\/h2><\/span><\/div><\/div><\/div>Il y a encore quelques ann\u00e9es, l’un des probl\u00e8mes les plus courants en mati\u00e8re d’optimisation du r\u00e9f\u00e9rencement \u00e9tait l’indexation, via Javascript, des pages dont le contenu \u00e9tait cr\u00e9\u00e9 de mani\u00e8re dynamique. Le probl\u00e8me \u00e9tait li\u00e9 aux robots des moteurs de recherche qui n’\u00e9taient pas en mesure de scanner et d’indexer ces ressources et ne prenaient en compte que le contenu du code source du HTML statique.<\/p>\n
Parall\u00e8lement, on a assist\u00e9 \u00e0 une \u00e9volution des frameworks tels que AngularJS, React, Vue.JS, des applications \u00e0 page unique (SPA) et des applications web progressives (PWA), ce qui a conduit Google \u00e0 \u00e9voluer de mani\u00e8re significative et \u00e0 atteindre une pleine maturit\u00e9 dans la compr\u00e9hension des pages web en tant que navigateur moderne.<\/p>\n
Toutefois, bien que Google soit aujourd’hui g\u00e9n\u00e9ralement en mesure d’analyser et d’indexer la plupart des contenus JavaScript, il est recommand\u00e9 d’utiliser un rendu c\u00f4t\u00e9 serveur, un pr\u00e9-rendu ou un rendu dynamique plut\u00f4t que de s’appuyer sur le JavaScript c\u00f4t\u00e9 client, car il est encore difficile pour les robots d’indexation de traiter le JavaScript avec succ\u00e8s ou imm\u00e9diatement.<\/p>\n
Pour ces raisons, il est essentiel, lors de l’analyse, de comprendre les diff\u00e9rences entre le DOM, une fois que JavaScript est entr\u00e9 en jeu et a construit la page web, et la r\u00e9ponse statique du HTML.<\/p>\n
Javascript, le spider seo et quelques contre-indications<\/p>\n
Pour rem\u00e9dier \u00e0 ce besoin, Screaming Frog vous vient en aide avec son mode \u00ab\u00a0Javascript Rendering\u00a0\u00bb, qui a int\u00e9gr\u00e9 la biblioth\u00e8que \u00ab\u00a0Chromium\u00a0\u00bb afin d’\u00e9muler au mieux le comportement du Google Spider.<\/p>\n<\/div>
![\"javascript](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/javascript-crawling-SEO-SPIDER.jpeg\")
<\/a><\/span><\/div>Aper\u00e7u<\/strong>: en 2019, Google a mis \u00e0 jour le service de rendu Web (WRS) qui \u00e9tait auparavant bas\u00e9 sur Chrome 41 avec la derni\u00e8re version stable de Chrome, ce qui lui a permis de prendre en charge plus d’un millier de fonctions suppl\u00e9mentaires.<\/p>\n1. Examinons quelques aspects inh\u00e9rents aux sites en Javascript :<\/p>\n
\n- 1. Activez soigneusement la fonction \u00ab\u00a0Javascript Rendering\u00a0\u00bb.<\/li>\n<\/ul>\n
Bien qu’il soit tr\u00e8s important de comprendre les diff\u00e9rences entre le DOM et le html statique apr\u00e8s l’ex\u00e9cution de Javascript, je vous d\u00e9conseille d’activer le mode \u00ab\u00a0Javascript Rendering\u00a0\u00bb sans discernement pour tous les sites web.<\/p>\n
L’exploration avec JavaScript est plus lente et plus intensive pour le serveur, car toutes les ressources (JavaScript, CSS, images, etc.) doivent \u00eatre r\u00e9cup\u00e9r\u00e9es pour le rendu de chaque page web. Cette criticit\u00e9 n’est pas pertinente pour les petits sites, mais pour les grands portails ou le commerce \u00e9lectronique, elle peut devenir un obstacle \u00e0 votre num\u00e9risation en termes de temps et de Ram.<\/p>\n
\n- 2. Examinez les principes et les limites de l’analyse Javascript<\/li>\n<\/ul>\n
Toutes les ressources d’une page (JS, CSS, images) doivent \u00eatre disponibles pour \u00eatre analys\u00e9es, rendues et index\u00e9es.<\/p>\n
Google exige toujours des URL propres et uniques pour une page, et les liens doivent figurer dans des balises d’ancrage HTML appropri\u00e9es (vous pouvez proposer un lien statique ou appeler une fonction JavaScript).<\/p>\n
Le Google Spider n’interagit pas comme les utilisateurs, c’est-\u00e0-dire qu’il ne clique pas sur les ressources en chargeant des \u00e9v\u00e9nements suppl\u00e9mentaires apr\u00e8s le rendu (un clic, un survol ou un d\u00e9filement, par exemple).<\/p>\n
L’instantan\u00e9 de la page rendue est pris lorsqu’il est d\u00e9termin\u00e9 que l’activit\u00e9 du r\u00e9seau s’est arr\u00eat\u00e9e, ou au-del\u00e0 d’un certain seuil de temps. Si une page prend beaucoup de temps \u00e0 s’afficher, elle risque d’\u00eatre ignor\u00e9e et des \u00e9l\u00e9ments peuvent ne pas \u00eatre vus et index\u00e9s.<\/p>\n
En g\u00e9n\u00e9ral, Google rend toutes les pages, mais ne les met pas en file d’attente pour le rendu si elles ont un \u00ab\u00a0noindex\u00a0\u00bb dans la r\u00e9ponse HTTP initiale ou un code HTML statique.<\/p>\n
Enfin, le rendu de Google est distinct de l’indexation. Google analyse d’abord le code HTML statique d’un site web et reporte le rendu jusqu’\u00e0 ce qu’il n’y ait plus de ressources.<\/p>\n
Lorsque vous commencez le d\u00e9veloppement d’un site web, la connaissance de ces conditions est vitale pour le succ\u00e8s ou l’\u00e9chec du projet en termes de r\u00e9f\u00e9rencement organique.<\/p>\n<\/div>
<\/div><\/div><\/span>Javascript c\u00f4t\u00e9 serveur et c\u00f4t\u00e9 client<\/h3><\/span><\/div><\/div><\/div>Google d\u00e9conseille de s’appuyer sur le JavaScript c\u00f4t\u00e9 client et recommande de d\u00e9velopper avec un \u00ab\u00a0enrichissement progressif\u00a0\u00bb, en construisant la structure et la navigation du site en utilisant uniquement le HTML, puis en am\u00e9liorant l’apparence et l’interface du site \u00e0 l’aide d’AJAX.<\/p>\n
Par cons\u00e9quent, si vous utilisez un framework JavaScript, Google recommande le rendu c\u00f4t\u00e9 serveur, le pr\u00e9-rendu ou le rendu hybride qui peuvent am\u00e9liorer les performances pour les utilisateurs et les robots d’indexation des moteurs de recherche.<\/p>\n
Gr\u00e2ce au rendu c\u00f4t\u00e9 serveur (SSR) et au pr\u00e9-rendu, l’ex\u00e9cution JavaScript des pages fournit une version HTML initiale rendue et pr\u00eate \u00e0 \u00eatre num\u00e9ris\u00e9e.<\/p>\n
Le rendu hybride (parfois appel\u00e9 \u00ab\u00a0isomorphe\u00a0\u00bb) identifie une version du rendu qui ex\u00e9cute Javascript c\u00f4t\u00e9 serveur pour le chargement initial de la page et HTML et Javascript c\u00f4t\u00e9 client pour les \u00e9l\u00e9ments non critiques et les pages suivantes.<\/p>\n
De nombreux frameworks JavaScript, tels que React ou Angular Universal, permettent un rendu c\u00f4t\u00e9 serveur et hybride.<\/p>\n
Vous pouvez \u00e9galement opter pour l’utilisation du rendu dynamique.<\/p>\n
Cela peut \u00eatre particuli\u00e8rement utile lorsqu’il n’est pas possible d’apporter des modifications \u00e0 la base de code frontale. Le rendu dynamique permet de passer d’un rendu c\u00f4t\u00e9 client pour les utilisateurs \u00e0 un contenu pr\u00e9-rendu pour les moteurs de recherche.<\/p>\n<\/div>
<\/div><\/div><\/span>Temps d’exploration par Google<\/h3><\/span><\/div><\/div><\/div>Bien que les trois solutions susmentionn\u00e9es permettent de r\u00e9soudre la plupart des probl\u00e8mes li\u00e9s au crawling, il est bon de tenir compte d’un autre aspect.<\/p>\n
Google dispose d’un processus d’indexation en deux \u00e9tapes, dans lequel il analyse et indexe d’abord le code HTML statique, puis revient plus tard, lorsque les ressources sont disponibles, pour rendre la page et pour analyser et indexer le contenu et les liens dans le code HTML rendu.<\/p>\n<\/div>
![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/google-render-queue-CRAWL.jpeg\" "\\"google-render-queue-CRAWL\\"")
<\/span><\/div>Le temps n\u00e9cessaire entre l’exploration et le rendu pourrait \u00e9galement \u00eatre tr\u00e8s long (jusqu’\u00e0 7 jours) et cette condition est un probl\u00e8me pour les sites qui s’appuient sur du contenu qui, par nature, pr\u00e9sente des caract\u00e9ristiques d’actualit\u00e9 ou qui expire simplement (par exemple, site d’actualit\u00e9s, \u00e9v\u00e9nements, etc.) ; alors que le temps moyen (d\u00e9clar\u00e9 au Chrome Dev Summit en 2019) est de 5 secondes.<\/p>\n<\/div>
<\/div><\/div><\/span>Comment identifier Javascript<\/h3><\/span><\/div><\/div><\/div>Identifier un site construit \u00e0 l’aide d’un cadre JavaScript peut \u00eatre assez simple, mais diagnostiquer des sections, des pages ou simplement des \u00e9l\u00e9ments plus petits qui sont adapt\u00e9s dynamiquement \u00e0 l’aide de JavaScript peut s’av\u00e9rer beaucoup plus difficile. Lors de la mise en place d’un audit Seo, il est bon de d\u00e9terminer imm\u00e9diatement s’il y a pr\u00e9sence de Javascript et d’essayer de comprendre si le site peut avoir des probl\u00e8mes lors des diff\u00e9rents crawls des agents utilisateurs.<\/p>\n
Il existe plusieurs fa\u00e7ons de savoir si le site est construit \u00e0 l’aide d’un cadre JavaScript :<\/p>\n
\n- 1. Identifier Javascript avec Screaming Frog<\/li>\n<\/ul>\n
Par d\u00e9faut, Seo Spider analyse en utilisant l'\u00a0\u00bbancien sch\u00e9ma d’analyse AJAX\u00a0\u00bb, ce qui signifie que JavaScript est d\u00e9sactiv\u00e9 et que seul le HTML brut est analys\u00e9.<\/p>\n
Si le site n’utilise que du JavaScript c\u00f4t\u00e9 client, vous n’obtiendrez qu’une r\u00e9ponse 200 \u00e0 la suite de votre analyse de la page d’accueil, avec quelques fichiers \u00ab\u00a0Javascript et CSS\u00a0\u00bb.<\/p>\n<\/div>
![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/javascript-siti-web-crawling-without-javascript.jpeg\")
<\/a><\/span><\/div>Comme vous pouvez le voir, l’onglet \u00ab\u00a0Outlinks\u00a0\u00bb ne contient pas non plus d’hyperliens car ils ne sont pas rendus en html brut et ne peuvent pas \u00eatre vus par le Seo Spider.<\/p>\n
<\/div>\n<\/div>![\"analisi](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/outlinks-scheda-no-hyperlinks.jpeg\")
<\/a><\/span><\/div>Bien que ce soit souvent le signe que le site Web utilise un cadre JavaScript, avec un rendu c\u00f4t\u00e9 client, cela ne vous indique pas si d’autres d\u00e9pendances JavaScript existent \u00e9galement sur le site.<\/p>\n
Par exemple, un site web peut ne disposer de JavaScript que pour charger des produits sur des pages de cat\u00e9gories ou pour mettre \u00e0 jour des \u00e9l\u00e9ments de titre.<\/p>\n
Comment les trouver facilement ?<\/p>\n
> > Afin d’identifier JavaScript plus efficacement, il est n\u00e9cessaire de passer en mode de rendu JavaScript (‘Config Spider Rendering’) et d’analyser le site, ou un \u00e9chantillon de mod\u00e8les du site entier.<\/p>\n
Le SEO Spider analysera \u00e0 la fois le code HTML original et le code HTML rendu pour identifier les pages dont le contenu ou les liens ne sont disponibles que du c\u00f4t\u00e9 client et pour signaler d’autres d\u00e9pendances cl\u00e9s.<\/p>\n<\/div>
![\"filtri](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/filtri-della-scheda-javascript-del-seo-spider.png\")
<\/a><\/span><\/div>Pour vous aider \u00e0 r\u00e9soudre les probl\u00e8mes courants des sites Javascript c\u00f4t\u00e9 client, vous disposez d’une liste compl\u00e8te de filtres pour vous guider dans la d\u00e9finition de votre audit Seo.<\/p>\n
Le Seo Spider vous alertera s’il y a du contenu qui ne se trouve que dans le HTML rendu apr\u00e8s l’entr\u00e9e en jeu du JavaScript, vous donnant ainsi une vue compl\u00e8te du comportement du site web.<\/p>\n<\/div>
![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/javascript-contenuto.jpeg\")
<\/a><\/span><\/div>Dans cet exemple, 100 % du contenu se trouve uniquement dans le rendu HTML, car le site est enti\u00e8rement bas\u00e9 sur JavaScript.<\/p>\n
Dans ce cas, l’examen a port\u00e9 sur le nombre de mots trouv\u00e9s dans le contenu des pages, mais vous pouvez \u00e9galement trouver, par exemple, des r\u00e9f\u00e9rences de pages avec des liens uniquement dans le code HTML rendu et y rem\u00e9dier en suivant les instructions de Google.<\/p>\n<\/div>
![\"analisi](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/javascript-links-sito-web.jpeg\")
<\/a><\/span><\/div>Cette fonction de Screaming Frog est \u00e9galement tr\u00e8s utile pour v\u00e9rifier si les m\u00e9tabalises ou d’autres \u00e9l\u00e9ments de r\u00e9f\u00e9rencement sont pr\u00e9sents dans le code HTML statique ou s’ils ne sont servis et\/ou modifi\u00e9s qu’une fois que le code Javascript a \u00e9t\u00e9 ex\u00e9cut\u00e9.<\/p>\n
\n- 2. D\u00e9sactiver Javascript dans le navigateur<\/li>\n<\/ul>\n
Une autre solution pour comprendre la nature des sites web consiste \u00e0 d\u00e9sactiver Javascript directement dans le navigateur et \u00e0 recharger la page. S’il appara\u00eet en blanc, il ne fait aucun doute que le site web a \u00e9t\u00e9 con\u00e7u avec Javascript.<\/p>\n<\/div>
![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/disabilitare-javascript-devtools.jpeg\")
<\/a><\/span><\/div>\n- 3. Recherche de Javascript directement dans le code source<\/li>\n<\/ul>\n
La troisi\u00e8me solution consiste \u00e0 faire un clic droit sur le site web et \u00e0 visualiser le code source en examinant le contenu Html, qu’il s’agisse de texte, de liens ou de signes des biblioth\u00e8ques des diff\u00e9rents frameworks JS.<\/p>\n
En suivant ce processus, vous voyez le code avant qu’il ne soit trait\u00e9 par le navigateur et qui correspondra \u00e0 ce que le Seo Spider scanne, lorsqu’il n’est pas en mode de rendu JavaScript.<\/p>\n
Si vous essayez de rechercher quelques \u00e9l\u00e9ments mais que vous n’obtenez aucune occurrence dans le code source, il est probable qu’ils sont g\u00e9n\u00e9r\u00e9s dynamiquement dans le DOM et qu’ils ne seront affich\u00e9s que dans le code rendu.<\/p>\n<\/div>
![\"esempio](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/source-code-sito-web.jpeg\")
<\/a><\/span><\/div><> Dans ce cas, le corps de la balise est compl\u00e8tement vide, ce qui indique clairement que le site dispose de JS.<\/p>\n
\n- 4. Auditer le code rendu<\/li>\n<\/ul>\n
La premi\u00e8re question \u00e0 vous poser est la suivante : quelle est la diff\u00e9rence entre le code rendu et la source HTML statique ? Pour le savoir, il suffit de faire un clic droit et d’utiliser \u00ab\u00a0inspecter l’\u00e9l\u00e9ment\u00a0\u00bb dans Chrome pour voir le code HTML rendu. Vous pouvez souvent voir le nom du framework JS dans le code rendu, comme \u00ab\u00a0React\u00a0\u00bb dans l’exemple ci-dessous.<\/p>\n<\/div>
![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/rendered-html-source-sito-web.jpeg\")
<\/a><\/span><\/div>Vous constaterez que le contenu et les hyperliens se trouvent dans le code rendu, mais pas dans le code source HTML original. C’est ce que le Seo Spider verra lorsqu’il sera en mode de rendu JavaScript.<\/p>\n
> En cliquant sur l’\u00e9l\u00e9ment HTML d’ouverture, puis sur \u00ab\u00a0copy outerHTML\u00a0\u00bb, vous pouvez comparer le code source rendu avec l’original.<\/p>\n<\/div>
<\/div><\/div><\/span>Javascript Crawl avec Screaming Frog<\/h3><\/span><\/div><\/div><\/div>Apr\u00e8s avoir d\u00e9fini la pr\u00e9sence de JS et compris les pi\u00e8ges, vous pouvez commencer votre audit Seo avec Screaming Frog en le configurant en mode de rendu JavaScript. Cela vous permet d’analyser des sites web et des frameworks dynamiques et riches en JavaScript, tels qu’Angular, React et Vue.js.<\/p>\n
\n- 1. > > Pour analyser un site Web JavaScript, ouvrez Seo Spider, cliquez sur \u00ab\u00a0Configuration Spider Rendering\u00a0\u00bb et modifiez \u00ab\u00a0Rendering\u00a0\u00bb en \u00ab\u00a0JavaScript\u00a0\u00bb.<\/li>\n<\/ul>\n<\/div>
![\"Rendering](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/rendering-js-con-screaming-frog.png\")
<\/a><\/span><\/div>\n- 2. Configurez l’agent utilisateur et la taille de la fen\u00eatre<\/li>\n<\/ul>\n
Configurez le user-agent<\/p>\n
> > Configuration En-t\u00eate HTTP User-Agent<\/p>\n
Et la taille de la fen\u00eatre<\/p>\n
> > Configuration Spider Rendering<\/p>\n
Par d\u00e9faut, la fen\u00eatre de visualisation est d\u00e9finie sur \u00ab\u00a0Google Mobile : Smartphone\u00a0\u00bb, conform\u00e9ment \u00e0 l’orientation \u00ab\u00a0Mobile Index First\u00a0\u00bb du moteur de recherche.<\/p>\n<\/div>
![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/rendering-simulato-di-google-smartphone.png\" "\\"rendering")
<\/span><\/div>\n- 3. V\u00e9rifier les ressources et les liens externes<\/li>\n<\/ul>\n
> Assurez-vous que les ressources telles que les images, CSS et JS sont coch\u00e9es dans la \u00ab\u00a0Configuration du Spider\u00a0\u00bb. Si les ressources se trouvent sur un sous-domaine diff\u00e9rent ou sur un \u00ab\u00a0domaine racine\u00a0\u00bb distinct, activez \u00e9galement l’option \u00ab\u00a0v\u00e9rifier les liens externes\u00a0\u00bb, sinon elles ne seront pas analys\u00e9es et donc affich\u00e9es.<\/p>\n<\/div>
![\"configurazione](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/configurazione-crawl-pwe-aiti-Js.png\")
<\/a><\/span><\/div>\n- 4. Num\u00e9risation<\/li>\n<\/ul>\n<\/div>\n<\/div>
![\"crawl](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/crawl-javascript-sito-web.jpeg\")
<\/a><\/span><\/div>\n- 5. Voir l’onglet Javascript<\/li>\n<\/ul>\n
Dans l’onglet JavaScript, vous disposez de 15 filtres pour vous aider \u00e0 prendre en compte les d\u00e9pendances JavaScript et \u00e0 isoler les probl\u00e8mes courants.<\/p>\n<\/div>
<\/span><\/div>\n- Pages avec<\/strong> ressources bloqu\u00e9es<\/strong>: identifie toutes les pages dont les ressources (telles que les images, JavaScript et CSS) sont bloqu\u00e9es par le fichier robots.txt. Cette situation peut poser un probl\u00e8me car les moteurs de recherche ne peuvent pas acc\u00e9der aux ressources essentielles pour restituer les pages avec pr\u00e9cision. Je vous recommande de mettre \u00e0 jour le fichier robots.txt pour permettre \u00e0 toutes les ressources critiques d’\u00eatre analys\u00e9es et utilis\u00e9es pour rendre le contenu du site. Les ressources qui ne sont pas essentielles (par exemple, l’int\u00e9gration de Google Maps) peuvent \u00eatre ignor\u00e9es.<\/li>\n
- Contient des <\/strong> liens JavaScript <\/strong>: le filtre affiche les pages qui contiennent des hyperliens qui ne sont d\u00e9couverts dans le rendu HTML qu’apr\u00e8s l’ex\u00e9cution de JavaScript. Ces hyperliens ne sont pas en HTML brut. C’est une bonne pratique que d’envisager l’inclusion de liens importants c\u00f4t\u00e9 serveur dans le code HTML statique.<\/li>\n
- Contient du contenu JavaScript<\/strong>: affiche toutes les pages qui contiennent un corps de texte uniquement en HTML rendu apr\u00e8s l’ex\u00e9cution de JavaScript. Google est capable d’afficher les pages et de ne voir que le contenu c\u00f4t\u00e9 client, alors que le contenu important c\u00f4t\u00e9 serveur n’est pas inclus dans le code HTML brut.<\/li>\n
- Noindex Only in Original HTML<\/strong>: toutes les pages qui contiennent une balise noindex dans le HTML statique mais pas dans le HTML rendu. Lorsque Googlebot rencontre une balise noindex, il ignore le rendu et l’ex\u00e9cution de JavaScript. \u00c9tant donn\u00e9 que Googlebot ignore l’ex\u00e9cution de JavaScript, l’utilisation de JavaScript pour supprimer le \u00ab\u00a0noindex\u00a0\u00bb dans le code HTML rendu ne fonctionnera pas.<\/li>\n
- Nofollow Only in Original HTML<\/strong>: identifie les pages qui contiennent un attribut nofollow dans le HTML statique, et non dans le HTML rendu. Cela signifie que tout hyperlien contenu dans le code HTML brut avant l’ex\u00e9cution de JavaScript ne sera pas suivi. Supprimez \u00ab\u00a0nofollow\u00a0\u00bb si les liens doivent \u00eatre suivis, analys\u00e9s et index\u00e9s.<\/li>\n
- Canonical<\/strong> Only in Rendered<\/strong> HTML : renvoie toutes les pages qui contiennent une balise canonical only dans le code HTML rendu apr\u00e8s l’ex\u00e9cution de JavaScript. Je recommande d’inclure un lien canonique dans le code HTML statique (ou dans l’en-t\u00eate HTTP) afin de s’assurer que Google puisse le voir et d’\u00e9viter de se fier uniquement au lien canonique dans le code HTML rendu.<\/li>\n
- Mauvaise correspondance<\/strong> canonique : identifie les pages qui contiennent un lien canonique diff\u00e9rent dans le code HTML statique et dans le code HTML rendu apr\u00e8s l’ex\u00e9cution du JavaScript. Cette situation peut entra\u00eener des signaux contradictoires et un comportement ind\u00e9sirable de la part du moteur de recherche.<\/li>\n
- Titre de la page uniquement dans le<\/strong> code HTML rendu<\/strong>: renvoie les pages qui contiennent un titre de page uniquement dans le code HTML rendu apr\u00e8s l’ex\u00e9cution de JavaScript. Cela signifie qu’un moteur de recherche doit rendre la page pour les voir. Pensez \u00e0 inclure le contenu important c\u00f4t\u00e9 serveur dans le code HTML brut.<\/li>\n
- Titre de la page mis \u00e0 jour par JavaScript<\/strong>: identifie les pages dont le titre a \u00e9t\u00e9 modifi\u00e9 par JavaScript. Cela signifie que le titre de la page en HTML statique est diff\u00e9rent du titre de la page en HTML rendu. Envisagez d’inclure le contenu important c\u00f4t\u00e9 serveur dans du HTML statique.<\/li>\n
- M\u00e9ta description<\/strong> uniquement dans le HTML rendu<\/strong>: renvoie les pages qui contiennent une m\u00e9ta description uniquement dans le HTML rendu apr\u00e8s l’ex\u00e9cution de JavaScript.<\/li>\n
- M\u00e9ta description mise \u00e0 jour par JavaScript<\/strong>: toutes les pages dont les m\u00e9ta descriptions sont modifi\u00e9es par JavaScript. Cela signifie que la m\u00e9ta-description en HTML statique est diff\u00e9rente de la m\u00e9ta-description en HTML rendu.<\/li>\n
- H1 <\/strong> uniquement dans le HTML rendu <\/strong>: pages qui contiennent un h1 uniquement dans le HTML rendu apr\u00e8s l’ex\u00e9cution de JavaScript. Cela signifie qu’un moteur de recherche doit rendre la page pour prendre en compte l’intitul\u00e9. Envisagez d’inclure des titres c\u00f4t\u00e9 serveur dans le code HTML statique.<\/li>\n
- H1 Updated by JavaScript<\/strong>: pages dont le h1 a \u00e9t\u00e9 modifi\u00e9 par JavaScript. Cela signifie que le h1 en HTML brut est diff\u00e9rent du h1 en HTML rendu.<\/li>\n
- Utilise les anciennes<\/strong> URL AJAX Crawling Scheme<\/strong>: identifie les URL qui utilisent encore l’ancien sch\u00e9ma de crawling AJAX (une URL contenant un fragment de hachage # !) qui a \u00e9t\u00e9 officiellement d\u00e9pr\u00e9ci\u00e9 en octobre 2015. Envisagez le rendu c\u00f4t\u00e9 serveur ou le pr\u00e9-rendu lorsque c’est possible, et le rendu dynamique comme solution alternative.<\/li>\n<\/ul>\n
\n- Uses Old AJAX Crawling Scheme Meta Fragment Tag<\/strong>: inclut les URL qui comprennent une balise meta fragment indiquant que la page utilise toujours l’ancien sch\u00e9ma de crawling AJAX qui a \u00e9t\u00e9 officiellement mis au rancart en octobre 2015. Il est conseill\u00e9 de mettre \u00e0 jour les URL afin de suivre l’\u00e9volution de JavaScript sur les sites web actuels. Envisagez le rendu c\u00f4t\u00e9 serveur ou le pr\u00e9-rendu lorsque c’est possible, et le rendu dynamique comme solution de contournement. Si le site comporte encore l’ancienne balise m\u00e9ta fragment par erreur, celle-ci doit \u00eatre supprim\u00e9e.<\/li>\n<\/ul>\n
\n- 6. Surveiller les ressources bloqu\u00e9es<\/li>\n<\/ul>\n
Gardez un \u0153il sur tout ce qui appara\u00eet sous le filtre \u00ab\u00a0Pages avec ressources bloqu\u00e9es\u00a0\u00bb dans l’onglet \u00ab\u00a0Javascript\u00a0\u00bb.<\/p>\n<\/div>
![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/pagine-blocked-resources.jpeg\")
<\/a><\/span><\/div>Les ressources bloqu\u00e9es peuvent \u00e9galement \u00eatre affich\u00e9es pour chaque page dans l’onglet \u00ab\u00a0Page rendue\u00a0\u00bb, \u00e0 c\u00f4t\u00e9 de l’\u00e9cran rendu dans le volet inf\u00e9rieur de la fen\u00eatre. Dans les cas les plus graves, si un site JavaScript bloque compl\u00e8tement les ressources JS, le site ne sera tout simplement pas analys\u00e9.<\/p>\n
<\/div>\n<\/div>![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/blocked-resources-small-anteprima.jpeg\")
<\/a><\/span><\/div>Les ressources bloqu\u00e9es sont \u00e9galement visibles dans l’onglet \u00ab\u00a0Code de r\u00e9ponse\u00a0\u00bb.<\/p>\n<\/div><\/div><\/div><\/div><\/div>
> Codes de r\u00e9ponse Ressource bloqu\u00e9e<\/span><\/p>\n<\/div><\/div><\/div><\/div><\/div>> > Les pages et les ressources individuelles bloqu\u00e9es peuvent \u00e9galement \u00eatre export\u00e9es en masse \u00e0 l’aide du rapport \u00ab\u00a0Bulk Export Response Code Blocked Resource Inlinks to be unblocked and optimised\u00a0\u00bb (Exportation en masse des liens de ressources bloqu\u00e9es par le code de r\u00e9ponse \u00e0 d\u00e9bloquer et \u00e0 optimiser).<\/p>\n<\/div>
![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/blocked-resources-bulk-export-report.jpeg\" "\\"blocked-resources-bulk-export-report\\"")
<\/span><\/div>\n- 7. Afficher les pages rendues<\/li>\n<\/ul>\n
Avec Screaming Frog, il est possible d’afficher la page rendue dans l’onglet \u00ab\u00a0Page rendue\u00a0\u00bb qui appara\u00eet dynamiquement au bas de l’interface utilisateur lors de l’exploration en mode de rendu JavaScript.<\/p>\n<\/div>
![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/rendered-page-scheda.jpeg\")
<\/a><\/span><\/div>Si la page ne se charge pas, envisagez d’intervenir sur le d\u00e9lai d’attente AJAX directement dans la configuration de Seo Spider.<\/p>\n
La visualisation de la page rendue est essentielle pour analyser ce qu’un robot de recherche moderne est capable de voir, et elle est particuli\u00e8rement utile lors de l’examen en phase d’essai, lorsqu’il n’est pas possible d’utiliser la fonctionnalit\u00e9 native \u00ab\u00a0Fetch & Render\u00a0\u00bb de Google via la Search Console.<\/p>\n
Si vous avez ajust\u00e9 le user-agent et le viewport sur Googlebot Smartphone, vous pouvez voir exactement comment chaque page est rendue sur mobile, par exemple.<\/p>\n
\n- 8. Comparer le HTML brut et le HTML rendu<\/li>\n<\/ul>\n
Vous pouvez souhaiter stocker et afficher du HTML et du HTML rendu dans Seo Spider lorsque vous travaillez avec JavaScript.<\/p>\n
> > > Configuration Spider Extraction Store Html\/Render Html<\/p>\n
En cochant les options appropri\u00e9es \u00ab\u00a0Store HTML\u00a0\u00bb et \u00ab\u00a0Store HTML Rendered\u00a0\u00bb, vous pouvez facilement comparer les deux versions et \u00eatre en mesure de comparer les diff\u00e9rences pour vous assurer que le contenu ou les liens critiques sont pr\u00e9sents dans le DOM.<\/p>\n<\/div>
Il y a encore quelques ann\u00e9es, l’un des probl\u00e8mes les plus courants en mati\u00e8re d’optimisation du r\u00e9f\u00e9rencement \u00e9tait l’indexation, via Javascript, des pages dont le contenu \u00e9tait cr\u00e9\u00e9 de mani\u00e8re dynamique. Le probl\u00e8me \u00e9tait li\u00e9 aux robots des moteurs de recherche qui n’\u00e9taient pas en mesure de scanner et d’indexer ces ressources et ne prenaient en compte que le contenu du code source du HTML statique.<\/p>\n
Parall\u00e8lement, on a assist\u00e9 \u00e0 une \u00e9volution des frameworks tels que AngularJS, React, Vue.JS, des applications \u00e0 page unique (SPA) et des applications web progressives (PWA), ce qui a conduit Google \u00e0 \u00e9voluer de mani\u00e8re significative et \u00e0 atteindre une pleine maturit\u00e9 dans la compr\u00e9hension des pages web en tant que navigateur moderne.<\/p>\n
Toutefois, bien que Google soit aujourd’hui g\u00e9n\u00e9ralement en mesure d’analyser et d’indexer la plupart des contenus JavaScript, il est recommand\u00e9 d’utiliser un rendu c\u00f4t\u00e9 serveur, un pr\u00e9-rendu ou un rendu dynamique plut\u00f4t que de s’appuyer sur le JavaScript c\u00f4t\u00e9 client, car il est encore difficile pour les robots d’indexation de traiter le JavaScript avec succ\u00e8s ou imm\u00e9diatement.<\/p>\n
Pour ces raisons, il est essentiel, lors de l’analyse, de comprendre les diff\u00e9rences entre le DOM, une fois que JavaScript est entr\u00e9 en jeu et a construit la page web, et la r\u00e9ponse statique du HTML.<\/p>\n
Javascript, le spider seo et quelques contre-indications<\/p>\n
Pour rem\u00e9dier \u00e0 ce besoin, Screaming Frog vous vient en aide avec son mode \u00ab\u00a0Javascript Rendering\u00a0\u00bb, qui a int\u00e9gr\u00e9 la biblioth\u00e8que \u00ab\u00a0Chromium\u00a0\u00bb afin d’\u00e9muler au mieux le comportement du Google Spider.<\/p>\n<\/div>
<\/a><\/span><\/div>Aper\u00e7u<\/strong>: en 2019, Google a mis \u00e0 jour le service de rendu Web (WRS) qui \u00e9tait auparavant bas\u00e9 sur Chrome 41 avec la derni\u00e8re version stable de Chrome, ce qui lui a permis de prendre en charge plus d’un millier de fonctions suppl\u00e9mentaires.<\/p>\n 1. Examinons quelques aspects inh\u00e9rents aux sites en Javascript :<\/p>\n Bien qu’il soit tr\u00e8s important de comprendre les diff\u00e9rences entre le DOM et le html statique apr\u00e8s l’ex\u00e9cution de Javascript, je vous d\u00e9conseille d’activer le mode \u00ab\u00a0Javascript Rendering\u00a0\u00bb sans discernement pour tous les sites web.<\/p>\n L’exploration avec JavaScript est plus lente et plus intensive pour le serveur, car toutes les ressources (JavaScript, CSS, images, etc.) doivent \u00eatre r\u00e9cup\u00e9r\u00e9es pour le rendu de chaque page web. Cette criticit\u00e9 n’est pas pertinente pour les petits sites, mais pour les grands portails ou le commerce \u00e9lectronique, elle peut devenir un obstacle \u00e0 votre num\u00e9risation en termes de temps et de Ram.<\/p>\n Toutes les ressources d’une page (JS, CSS, images) doivent \u00eatre disponibles pour \u00eatre analys\u00e9es, rendues et index\u00e9es.<\/p>\n Google exige toujours des URL propres et uniques pour une page, et les liens doivent figurer dans des balises d’ancrage HTML appropri\u00e9es (vous pouvez proposer un lien statique ou appeler une fonction JavaScript).<\/p>\n Le Google Spider n’interagit pas comme les utilisateurs, c’est-\u00e0-dire qu’il ne clique pas sur les ressources en chargeant des \u00e9v\u00e9nements suppl\u00e9mentaires apr\u00e8s le rendu (un clic, un survol ou un d\u00e9filement, par exemple).<\/p>\n L’instantan\u00e9 de la page rendue est pris lorsqu’il est d\u00e9termin\u00e9 que l’activit\u00e9 du r\u00e9seau s’est arr\u00eat\u00e9e, ou au-del\u00e0 d’un certain seuil de temps. Si une page prend beaucoup de temps \u00e0 s’afficher, elle risque d’\u00eatre ignor\u00e9e et des \u00e9l\u00e9ments peuvent ne pas \u00eatre vus et index\u00e9s.<\/p>\n En g\u00e9n\u00e9ral, Google rend toutes les pages, mais ne les met pas en file d’attente pour le rendu si elles ont un \u00ab\u00a0noindex\u00a0\u00bb dans la r\u00e9ponse HTTP initiale ou un code HTML statique.<\/p>\n Enfin, le rendu de Google est distinct de l’indexation. Google analyse d’abord le code HTML statique d’un site web et reporte le rendu jusqu’\u00e0 ce qu’il n’y ait plus de ressources.<\/p>\n Lorsque vous commencez le d\u00e9veloppement d’un site web, la connaissance de ces conditions est vitale pour le succ\u00e8s ou l’\u00e9chec du projet en termes de r\u00e9f\u00e9rencement organique.<\/p>\n<\/div> Google d\u00e9conseille de s’appuyer sur le JavaScript c\u00f4t\u00e9 client et recommande de d\u00e9velopper avec un \u00ab\u00a0enrichissement progressif\u00a0\u00bb, en construisant la structure et la navigation du site en utilisant uniquement le HTML, puis en am\u00e9liorant l’apparence et l’interface du site \u00e0 l’aide d’AJAX.<\/p>\n Par cons\u00e9quent, si vous utilisez un framework JavaScript, Google recommande le rendu c\u00f4t\u00e9 serveur, le pr\u00e9-rendu ou le rendu hybride qui peuvent am\u00e9liorer les performances pour les utilisateurs et les robots d’indexation des moteurs de recherche.<\/p>\n Gr\u00e2ce au rendu c\u00f4t\u00e9 serveur (SSR) et au pr\u00e9-rendu, l’ex\u00e9cution JavaScript des pages fournit une version HTML initiale rendue et pr\u00eate \u00e0 \u00eatre num\u00e9ris\u00e9e.<\/p>\n Le rendu hybride (parfois appel\u00e9 \u00ab\u00a0isomorphe\u00a0\u00bb) identifie une version du rendu qui ex\u00e9cute Javascript c\u00f4t\u00e9 serveur pour le chargement initial de la page et HTML et Javascript c\u00f4t\u00e9 client pour les \u00e9l\u00e9ments non critiques et les pages suivantes.<\/p>\n De nombreux frameworks JavaScript, tels que React ou Angular Universal, permettent un rendu c\u00f4t\u00e9 serveur et hybride.<\/p>\n Vous pouvez \u00e9galement opter pour l’utilisation du rendu dynamique.<\/p>\n Cela peut \u00eatre particuli\u00e8rement utile lorsqu’il n’est pas possible d’apporter des modifications \u00e0 la base de code frontale. Le rendu dynamique permet de passer d’un rendu c\u00f4t\u00e9 client pour les utilisateurs \u00e0 un contenu pr\u00e9-rendu pour les moteurs de recherche.<\/p>\n<\/div> Bien que les trois solutions susmentionn\u00e9es permettent de r\u00e9soudre la plupart des probl\u00e8mes li\u00e9s au crawling, il est bon de tenir compte d’un autre aspect.<\/p>\n Google dispose d’un processus d’indexation en deux \u00e9tapes, dans lequel il analyse et indexe d’abord le code HTML statique, puis revient plus tard, lorsque les ressources sont disponibles, pour rendre la page et pour analyser et indexer le contenu et les liens dans le code HTML rendu.<\/p>\n<\/div> Le temps n\u00e9cessaire entre l’exploration et le rendu pourrait \u00e9galement \u00eatre tr\u00e8s long (jusqu’\u00e0 7 jours) et cette condition est un probl\u00e8me pour les sites qui s’appuient sur du contenu qui, par nature, pr\u00e9sente des caract\u00e9ristiques d’actualit\u00e9 ou qui expire simplement (par exemple, site d’actualit\u00e9s, \u00e9v\u00e9nements, etc.) ; alors que le temps moyen (d\u00e9clar\u00e9 au Chrome Dev Summit en 2019) est de 5 secondes.<\/p>\n<\/div> Identifier un site construit \u00e0 l’aide d’un cadre JavaScript peut \u00eatre assez simple, mais diagnostiquer des sections, des pages ou simplement des \u00e9l\u00e9ments plus petits qui sont adapt\u00e9s dynamiquement \u00e0 l’aide de JavaScript peut s’av\u00e9rer beaucoup plus difficile. Lors de la mise en place d’un audit Seo, il est bon de d\u00e9terminer imm\u00e9diatement s’il y a pr\u00e9sence de Javascript et d’essayer de comprendre si le site peut avoir des probl\u00e8mes lors des diff\u00e9rents crawls des agents utilisateurs.<\/p>\n Il existe plusieurs fa\u00e7ons de savoir si le site est construit \u00e0 l’aide d’un cadre JavaScript :<\/p>\n Par d\u00e9faut, Seo Spider analyse en utilisant l'\u00a0\u00bbancien sch\u00e9ma d’analyse AJAX\u00a0\u00bb, ce qui signifie que JavaScript est d\u00e9sactiv\u00e9 et que seul le HTML brut est analys\u00e9.<\/p>\n Si le site n’utilise que du JavaScript c\u00f4t\u00e9 client, vous n’obtiendrez qu’une r\u00e9ponse 200 \u00e0 la suite de votre analyse de la page d’accueil, avec quelques fichiers \u00ab\u00a0Javascript et CSS\u00a0\u00bb.<\/p>\n<\/div> Comme vous pouvez le voir, l’onglet \u00ab\u00a0Outlinks\u00a0\u00bb ne contient pas non plus d’hyperliens car ils ne sont pas rendus en html brut et ne peuvent pas \u00eatre vus par le Seo Spider.<\/p>\n Bien que ce soit souvent le signe que le site Web utilise un cadre JavaScript, avec un rendu c\u00f4t\u00e9 client, cela ne vous indique pas si d’autres d\u00e9pendances JavaScript existent \u00e9galement sur le site.<\/p>\n Par exemple, un site web peut ne disposer de JavaScript que pour charger des produits sur des pages de cat\u00e9gories ou pour mettre \u00e0 jour des \u00e9l\u00e9ments de titre.<\/p>\n Comment les trouver facilement ?<\/p>\n > > Afin d’identifier JavaScript plus efficacement, il est n\u00e9cessaire de passer en mode de rendu JavaScript (‘Config Spider Rendering’) et d’analyser le site, ou un \u00e9chantillon de mod\u00e8les du site entier.<\/p>\n Le SEO Spider analysera \u00e0 la fois le code HTML original et le code HTML rendu pour identifier les pages dont le contenu ou les liens ne sont disponibles que du c\u00f4t\u00e9 client et pour signaler d’autres d\u00e9pendances cl\u00e9s.<\/p>\n<\/div> Pour vous aider \u00e0 r\u00e9soudre les probl\u00e8mes courants des sites Javascript c\u00f4t\u00e9 client, vous disposez d’une liste compl\u00e8te de filtres pour vous guider dans la d\u00e9finition de votre audit Seo.<\/p>\n Le Seo Spider vous alertera s’il y a du contenu qui ne se trouve que dans le HTML rendu apr\u00e8s l’entr\u00e9e en jeu du JavaScript, vous donnant ainsi une vue compl\u00e8te du comportement du site web.<\/p>\n<\/div> Dans cet exemple, 100 % du contenu se trouve uniquement dans le rendu HTML, car le site est enti\u00e8rement bas\u00e9 sur JavaScript.<\/p>\n Dans ce cas, l’examen a port\u00e9 sur le nombre de mots trouv\u00e9s dans le contenu des pages, mais vous pouvez \u00e9galement trouver, par exemple, des r\u00e9f\u00e9rences de pages avec des liens uniquement dans le code HTML rendu et y rem\u00e9dier en suivant les instructions de Google.<\/p>\n<\/div> Cette fonction de Screaming Frog est \u00e9galement tr\u00e8s utile pour v\u00e9rifier si les m\u00e9tabalises ou d’autres \u00e9l\u00e9ments de r\u00e9f\u00e9rencement sont pr\u00e9sents dans le code HTML statique ou s’ils ne sont servis et\/ou modifi\u00e9s qu’une fois que le code Javascript a \u00e9t\u00e9 ex\u00e9cut\u00e9.<\/p>\n Une autre solution pour comprendre la nature des sites web consiste \u00e0 d\u00e9sactiver Javascript directement dans le navigateur et \u00e0 recharger la page. S’il appara\u00eet en blanc, il ne fait aucun doute que le site web a \u00e9t\u00e9 con\u00e7u avec Javascript.<\/p>\n<\/div> La troisi\u00e8me solution consiste \u00e0 faire un clic droit sur le site web et \u00e0 visualiser le code source en examinant le contenu Html, qu’il s’agisse de texte, de liens ou de signes des biblioth\u00e8ques des diff\u00e9rents frameworks JS.<\/p>\n En suivant ce processus, vous voyez le code avant qu’il ne soit trait\u00e9 par le navigateur et qui correspondra \u00e0 ce que le Seo Spider scanne, lorsqu’il n’est pas en mode de rendu JavaScript.<\/p>\n Si vous essayez de rechercher quelques \u00e9l\u00e9ments mais que vous n’obtenez aucune occurrence dans le code source, il est probable qu’ils sont g\u00e9n\u00e9r\u00e9s dynamiquement dans le DOM et qu’ils ne seront affich\u00e9s que dans le code rendu.<\/p>\n<\/div> <> Dans ce cas, le corps de la balise est compl\u00e8tement vide, ce qui indique clairement que le site dispose de JS.<\/p>\n La premi\u00e8re question \u00e0 vous poser est la suivante : quelle est la diff\u00e9rence entre le code rendu et la source HTML statique ? Pour le savoir, il suffit de faire un clic droit et d’utiliser \u00ab\u00a0inspecter l’\u00e9l\u00e9ment\u00a0\u00bb dans Chrome pour voir le code HTML rendu. Vous pouvez souvent voir le nom du framework JS dans le code rendu, comme \u00ab\u00a0React\u00a0\u00bb dans l’exemple ci-dessous.<\/p>\n<\/div> Vous constaterez que le contenu et les hyperliens se trouvent dans le code rendu, mais pas dans le code source HTML original. C’est ce que le Seo Spider verra lorsqu’il sera en mode de rendu JavaScript.<\/p>\n > En cliquant sur l’\u00e9l\u00e9ment HTML d’ouverture, puis sur \u00ab\u00a0copy outerHTML\u00a0\u00bb, vous pouvez comparer le code source rendu avec l’original.<\/p>\n<\/div> Apr\u00e8s avoir d\u00e9fini la pr\u00e9sence de JS et compris les pi\u00e8ges, vous pouvez commencer votre audit Seo avec Screaming Frog en le configurant en mode de rendu JavaScript. Cela vous permet d’analyser des sites web et des frameworks dynamiques et riches en JavaScript, tels qu’Angular, React et Vue.js.<\/p>\n Configurez le user-agent<\/p>\n > > Configuration En-t\u00eate HTTP User-Agent<\/p>\n Et la taille de la fen\u00eatre<\/p>\n > > Configuration Spider Rendering<\/p>\n Par d\u00e9faut, la fen\u00eatre de visualisation est d\u00e9finie sur \u00ab\u00a0Google Mobile : Smartphone\u00a0\u00bb, conform\u00e9ment \u00e0 l’orientation \u00ab\u00a0Mobile Index First\u00a0\u00bb du moteur de recherche.<\/p>\n<\/div> > Assurez-vous que les ressources telles que les images, CSS et JS sont coch\u00e9es dans la \u00ab\u00a0Configuration du Spider\u00a0\u00bb. Si les ressources se trouvent sur un sous-domaine diff\u00e9rent ou sur un \u00ab\u00a0domaine racine\u00a0\u00bb distinct, activez \u00e9galement l’option \u00ab\u00a0v\u00e9rifier les liens externes\u00a0\u00bb, sinon elles ne seront pas analys\u00e9es et donc affich\u00e9es.<\/p>\n<\/div> Dans l’onglet JavaScript, vous disposez de 15 filtres pour vous aider \u00e0 prendre en compte les d\u00e9pendances JavaScript et \u00e0 isoler les probl\u00e8mes courants.<\/p>\n<\/div> Gardez un \u0153il sur tout ce qui appara\u00eet sous le filtre \u00ab\u00a0Pages avec ressources bloqu\u00e9es\u00a0\u00bb dans l’onglet \u00ab\u00a0Javascript\u00a0\u00bb.<\/p>\n<\/div> Les ressources bloqu\u00e9es peuvent \u00e9galement \u00eatre affich\u00e9es pour chaque page dans l’onglet \u00ab\u00a0Page rendue\u00a0\u00bb, \u00e0 c\u00f4t\u00e9 de l’\u00e9cran rendu dans le volet inf\u00e9rieur de la fen\u00eatre. Dans les cas les plus graves, si un site JavaScript bloque compl\u00e8tement les ressources JS, le site ne sera tout simplement pas analys\u00e9.<\/p>\n Les ressources bloqu\u00e9es sont \u00e9galement visibles dans l’onglet \u00ab\u00a0Code de r\u00e9ponse\u00a0\u00bb.<\/p>\n<\/div><\/div><\/div><\/div><\/div> > Codes de r\u00e9ponse Ressource bloqu\u00e9e<\/span><\/p>\n<\/div><\/div><\/div><\/div><\/div> > > Les pages et les ressources individuelles bloqu\u00e9es peuvent \u00e9galement \u00eatre export\u00e9es en masse \u00e0 l’aide du rapport \u00ab\u00a0Bulk Export Response Code Blocked Resource Inlinks to be unblocked and optimised\u00a0\u00bb (Exportation en masse des liens de ressources bloqu\u00e9es par le code de r\u00e9ponse \u00e0 d\u00e9bloquer et \u00e0 optimiser).<\/p>\n<\/div> Avec Screaming Frog, il est possible d’afficher la page rendue dans l’onglet \u00ab\u00a0Page rendue\u00a0\u00bb qui appara\u00eet dynamiquement au bas de l’interface utilisateur lors de l’exploration en mode de rendu JavaScript.<\/p>\n<\/div> Si la page ne se charge pas, envisagez d’intervenir sur le d\u00e9lai d’attente AJAX directement dans la configuration de Seo Spider.<\/p>\n La visualisation de la page rendue est essentielle pour analyser ce qu’un robot de recherche moderne est capable de voir, et elle est particuli\u00e8rement utile lors de l’examen en phase d’essai, lorsqu’il n’est pas possible d’utiliser la fonctionnalit\u00e9 native \u00ab\u00a0Fetch & Render\u00a0\u00bb de Google via la Search Console.<\/p>\n Si vous avez ajust\u00e9 le user-agent et le viewport sur Googlebot Smartphone, vous pouvez voir exactement comment chaque page est rendue sur mobile, par exemple.<\/p>\n Vous pouvez souhaiter stocker et afficher du HTML et du HTML rendu dans Seo Spider lorsque vous travaillez avec JavaScript.<\/p>\n > > > Configuration Spider Extraction Store Html\/Render Html<\/p>\n En cochant les options appropri\u00e9es \u00ab\u00a0Store HTML\u00a0\u00bb et \u00ab\u00a0Store HTML Rendered\u00a0\u00bb, vous pouvez facilement comparer les deux versions et \u00eatre en mesure de comparer les diff\u00e9rences pour vous assurer que le contenu ou les liens critiques sont pr\u00e9sents dans le DOM.<\/p>\n<\/div>\n
\n
Javascript c\u00f4t\u00e9 serveur et c\u00f4t\u00e9 client<\/h3><\/span>
Temps d’exploration par Google<\/h3><\/span>
<\/span><\/div>Comment identifier Javascript<\/h3><\/span>
\n
<\/a><\/span><\/div><\/a><\/span><\/div><\/a><\/span><\/div><\/a><\/span><\/div><\/a><\/span><\/div>\n
<\/a><\/span><\/div>\n
<\/a><\/span><\/div>\n
<\/a><\/span><\/div>Javascript Crawl avec Screaming Frog<\/h3><\/span>
\n
<\/a><\/span><\/div>\n
<\/span><\/div>\n
<\/a><\/span><\/div>\n
<\/a><\/span><\/div>\n
<\/span><\/div>\n
\n
\n
<\/a><\/span><\/div><\/a><\/span><\/div><\/span><\/div>\n
<\/a><\/span><\/div>\n