Introducci\u00f3n de sitios Javascript<\/h2><\/span><\/div><\/div><\/div>Hasta hace unos a\u00f1os, uno de los problemas m\u00e1s comunes en la optimizaci\u00f3n SEO era conseguir que las p\u00e1ginas con contenido creado din\u00e1micamente se indexaran mediante Javascript. El problema estaba relacionado con los robots de los motores de b\u00fasqueda, que no eran capaces de escanear e indexar estos recursos y s\u00f3lo ten\u00edan en cuenta el contenido del c\u00f3digo fuente del HTML est\u00e1tico.<\/p>\n
Paralelamente, se ha producido una evoluci\u00f3n de frameworks como AngularJS, React, Vue.JS, aplicaciones de p\u00e1gina \u00fanica (SPA) y aplicaciones web progresivas (PWA), que ha llevado a Google a evolucionar significativamente y alcanzar una madurez plena en la comprensi\u00f3n de las p\u00e1ginas web como un navegador moderno.<\/p>\n
Sin embargo, aunque hoy en d\u00eda Google suele ser capaz de escanear e indexar la mayor parte del contenido JavaScript, se recomienda la renderizaci\u00f3n del lado del servidor, la renderizaci\u00f3n previa o la renderizaci\u00f3n din\u00e1mica en lugar de confiar en el JavaScript del lado del cliente, ya que sigue siendo dif\u00edcil para los rastreadores procesar JavaScript con \u00e9xito o de forma inmediata.<\/p>\n
Por estas razones, es crucial durante el an\u00e1lisis comprender las diferencias entre el DOM despu\u00e9s de que JavaScript haya entrado en juego y construido la p\u00e1gina web, y la respuesta est\u00e1tica del HTML.<\/p>\n
Javascript, la ara\u00f1a seo y algunas contraindicaciones<\/p>\n
Para remediar esta necesidad, Screaming Frog viene en tu ayuda con su modo \u00abRenderizado Javascript\u00bb, que ha integrado la biblioteca \u00abChromium\u00bb para emular lo mejor posible el comportamiento de la ara\u00f1a de Google.<\/p>\n<\/div>
![\"javascript](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/javascript-crawling-SEO-SPIDER.jpeg\")
<\/a><\/span><\/div>Visi\u00f3n<\/strong>: en 2019, Google actualiz\u00f3 el Servicio de renderizado web (WRS), que antes se basaba en Chrome 41, con la \u00faltima versi\u00f3n estable de Chrome, lo que le permiti\u00f3 admitir m\u00e1s de mil funciones adicionales.<\/p>\n1. Consideremos algunos aspectos inherentes a los sitios en Javascript:<\/p>\n
\n- 1. Activa \u00abRenderizado Javascript\u00bb con cuidado<\/li>\n<\/ul>\n
Aunque comprender las diferencias entre el DOM y el html est\u00e1tico tras la ejecuci\u00f3n de Javascript es muy importante, desaconsejo activar el modo \u00abRenderizado Javascript\u00bb indiscriminadamente para cada sitio web.<\/p>\n
El rastreo con JavaScript es m\u00e1s lento y m\u00e1s intensivo para el servidor, ya que hay que recuperar todos los recursos (tanto JavaScript como CSS, im\u00e1genes, etc.) para la renderizaci\u00f3n de cada p\u00e1gina web. Esta criticidad es irrelevante para los sitios peque\u00f1os, pero para los grandes portales o ecommerce podr\u00eda convertirse en un obst\u00e1culo para tu escaneado en t\u00e9rminos de tiempo y Ram.<\/p>\n
\n- 2. Considera los principios y limitaciones de la exploraci\u00f3n Javascript<\/li>\n<\/ul>\n
Todos los recursos de una p\u00e1gina (JS, CSS, im\u00e1genes) deben estar disponibles para ser escaneados, renderizados e indexados.<\/p>\n
Google sigue exigiendo URL limpias y \u00fanicas para una p\u00e1gina, y los enlaces deben estar en etiquetas de anclaje HTML adecuadas (puedes ofrecer un enlace est\u00e1tico, as\u00ed como llamar a una funci\u00f3n JavaScript).<\/p>\n
La Ara\u00f1a de Google no interact\u00faa como los usuarios, por ejemplo, no hace clic en los recursos cargando eventos adicionales despu\u00e9s de la renderizaci\u00f3n (un clic, un hover o un desplazamiento, por ejemplo).<\/p>\n
La instant\u00e1nea de la p\u00e1gina renderizada se toma cuando se determina que la actividad de la red ha cesado, o m\u00e1s all\u00e1 de un umbral de tiempo. Existe el riesgo de que, si una p\u00e1gina tarda mucho en procesarse, se omita y los elementos no se vean ni se indexen.<\/p>\n
En general, Google renderiza todas las p\u00e1ginas, pero no las pone en cola para ser renderizadas si tienen un \u00abnoindex\u00bb en la respuesta HTTP inicial o HTML est\u00e1tico.<\/p>\n
Por \u00faltimo, la representaci\u00f3n de Google es independiente de la indexaci\u00f3n. Google escanea inicialmente el HTML est\u00e1tico de un sitio web, y pospone la renderizaci\u00f3n hasta que no tiene recursos.<\/p>\n
Al iniciar el desarrollo de un sitio web, conocer estas condiciones es vital para el \u00e9xito o el fracaso del proyecto en t\u00e9rminos de posicionamiento org\u00e1nico.<\/p>\n<\/div>
<\/div><\/div><\/span>Javascript del lado del servidor y del lado del cliente<\/h3><\/span><\/div><\/div><\/div>Google desaconseja confiar en JavaScript del lado del cliente y recomienda desarrollar con \u00abmejora progresiva\u00bb, construyendo la estructura y la navegaci\u00f3n del sitio utilizando s\u00f3lo HTML y mejorando despu\u00e9s el aspecto y la interfaz del sitio con AJAX.<\/p>\n
Por lo tanto, si utilizas un framework JavaScript, Google recomienda la renderizaci\u00f3n del lado del servidor, la renderizaci\u00f3n previa o la renderizaci\u00f3n h\u00edbrida, que pueden mejorar el rendimiento para los usuarios y los rastreadores de los motores de b\u00fasqueda.<\/p>\n
Al servir el renderizado del lado del servidor (SSR) y el pre-renderizado, la ejecuci\u00f3n JavaScript de las p\u00e1ginas proporciona una versi\u00f3n HTML inicial renderizada y lista para escanear.<\/p>\n
El renderizado h\u00edbrido (a veces denominado \u00abisom\u00f3rfico\u00bb) identifica una versi\u00f3n del renderizado que ejecuta Javascript del lado del servidor para la carga inicial de la p\u00e1gina y HTML y Javascript del lado del cliente para los elementos no cr\u00edticos y las p\u00e1ginas posteriores.<\/p>\n
Muchos frameworks de JavaScript, como React o Angular Universal, permiten el renderizado del lado del servidor e h\u00edbrido.<\/p>\n
Alternativamente, puedes optar por utilizar el renderizado din\u00e1mico.<\/p>\n
Esto puede ser especialmente \u00fatil cuando no es posible realizar cambios en la base de c\u00f3digo del front-end. El renderizado din\u00e1mico pasa del renderizado del lado del cliente para los usuarios al contenido pre-renderizado para los motores de b\u00fasqueda.<\/p>\n<\/div>
<\/div><\/div><\/span>Tiempos de rastreo de Google<\/h3><\/span><\/div><\/div><\/div>Aunque optar por las tres soluciones anteriores resuelve la mayor\u00eda de los problemas de rastreo, es bueno tener en cuenta un aspecto adicional.<\/p>\n
Google tiene un proceso de indexaci\u00f3n en dos fases, en el que inicialmente escanea e indexa el HTML est\u00e1tico, y luego vuelve m\u00e1s tarde, cuando hay recursos disponibles, para renderizar la p\u00e1gina y escanear e indexar el contenido y los enlaces del HTML renderizado.<\/p>\n<\/div>
![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/google-render-queue-CRAWL.jpeg\" "\\"google-render-queue-CRAWL\\"")
<\/span><\/div>El tiempo necesario entre el rastreo y la renderizaci\u00f3n tambi\u00e9n podr\u00eda ser muy largo (hasta 7 d\u00edas) y esta condici\u00f3n es un problema para los sitios que dependen de contenidos que por su propia naturaleza tienen caracter\u00edsticas de actualidad o simplemente caducan (por ejemplo, sitios de noticias, eventos, etc.); mientras que el tiempo medio (declarado en la Chrome Dev Summit de 2019) es de 5 segundos.<\/p>\n<\/div>
<\/div><\/div><\/span>C\u00f3mo identificar Javascript<\/h3><\/span><\/div><\/div><\/div>Identificar un sitio construido con un framework JavaScript puede ser bastante sencillo, sin embargo, diagnosticar secciones, p\u00e1ginas o simplemente elementos m\u00e1s peque\u00f1os que se adaptan din\u00e1micamente mediante JavaScript puede ser mucho m\u00e1s dif\u00edcil. Al establecer una Auditor\u00eda Seo, es una buena pr\u00e1ctica determinar inmediatamente si hay presencia de Javascript e intentar comprender si el sitio puede tener problemas durante los distintos rastreos del Agente de Usuario.<\/p>\n
Hay varias formas de saber si el sitio est\u00e1 construido utilizando un framework JavaScript, veamos algunas de ellas:<\/p>\n
\n- 1. Identificar Javascript con Screaming Frog<\/li>\n<\/ul>\n
Por defecto, el Seo Spider escanea utilizando el \u00abantiguo esquema de escaneo AJAX\u00bb, lo que significa que JavaScript est\u00e1 desactivado, y s\u00f3lo escanea HTML sin procesar.<\/p>\n
Si el sitio s\u00f3lo utiliza JavaScript del lado del cliente, entonces s\u00f3lo obtendr\u00e1s como resultado de tu escaneo la p\u00e1gina de inicio con una respuesta 200 con unos cuantos archivos \u00abJavascript y CSS\u00bb.<\/p>\n<\/div>
![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/javascript-siti-web-crawling-without-javascript.jpeg\")
<\/a><\/span><\/div>Como puedes ver, la pesta\u00f1a \u00abEnlaces externos\u00bb tampoco tiene hiperv\u00ednculos, ya que no est\u00e1n renderizados en html sin procesar y no pueden ser vistos por la ara\u00f1a Seo.<\/p>\n
<\/div>\n<\/div>![\"analisi](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/outlinks-scheda-no-hyperlinks.jpeg\")
<\/a><\/span><\/div>Aunque esto suele ser una se\u00f1al de que el sitio web utiliza un framework JavaScript, con renderizaci\u00f3n del lado del cliente, no te dice si existen tambi\u00e9n otras dependencias JavaScript en el sitio.<\/p>\n
Por ejemplo, un sitio web puede tener JavaScript s\u00f3lo para cargar productos en p\u00e1ginas de categor\u00edas, o actualizar elementos de t\u00edtulo.<\/p>\n
Entonces, \u00bfc\u00f3mo encontrarlos f\u00e1cilmente?<\/p>\n
> > Para identificar el JavaScript de forma m\u00e1s eficaz, es necesario cambiar al modo de renderizado de JavaScript (\u00abConfig Spider Rendering\u00bb) y escanear el sitio, o una muestra de modelos de todo el sitio.<\/p>\n
La Ara\u00f1a SEO escanear\u00e1 tanto el HTML original como el renderizado para identificar las p\u00e1ginas que tienen contenido o enlaces s\u00f3lo disponibles del lado del cliente y se\u00f1alar otras dependencias clave.<\/p>\n<\/div>
![\"filtri](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/filtri-della-scheda-javascript-del-seo-spider.png\")
<\/a><\/span><\/div>Para ayudarte a navegar por los problemas habituales de los sitios Javascript del lado del cliente, tienes una lista completa de filtros que te guiar\u00e1n en la definici\u00f3n de tu Auditor\u00eda Seo.<\/p>\n
El Seo Spider te avisar\u00e1 si hay alg\u00fan contenido que s\u00f3lo se encuentre en el HTML renderizado despu\u00e9s de que el JavaScript entre en juego, d\u00e1ndote una visi\u00f3n completa del comportamiento del sitio web.<\/p>\n<\/div>
![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/javascript-contenuto.jpeg\")
<\/a><\/span><\/div>En este ejemplo, el 100% del contenido s\u00f3lo est\u00e1 en el HTML renderizado, ya que el sitio se basa totalmente en JavaScript.<\/p>\n
En este caso, el examen se centr\u00f3 en el n\u00famero de palabras encontradas en el contenido de las p\u00e1ginas, pero tambi\u00e9n puedes encontrar, por ejemplo, referencias a p\u00e1ginas con enlaces s\u00f3lo en el HTML renderizado y remediarlas siguiendo las instrucciones de Google.<\/p>\n<\/div>
![\"analisi](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/javascript-links-sito-web.jpeg\")
<\/a><\/span><\/div>Esta funci\u00f3n de Screaming Frog tambi\u00e9n es muy \u00fatil para comprobar si las metaetiquetas u otros elementos Seo est\u00e1n presentes en el html est\u00e1tico o s\u00f3lo se sirven y\/o modifican una vez ejecutado el Javascript.<\/p>\n
\n- 2. Desactivar Javascript en el navegador<\/li>\n<\/ul>\n
Una alternativa para comprender la naturaleza de los sitios web es desactivar Javascript directamente en el navegador y volver a cargar la p\u00e1gina. Si aparece en blanco, no hay duda de que el sitio web se dise\u00f1\u00f3 con Javascript.<\/p>\n<\/div>
![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/disabilitare-javascript-devtools.jpeg\")
<\/a><\/span><\/div>\n- 3. Buscar Javascript directamente en el c\u00f3digo fuente<\/li>\n<\/ul>\n
La tercera soluci\u00f3n es hacer clic con el bot\u00f3n derecho en el sitio web y ver el c\u00f3digo fuente examinando el contenido Html, si hay texto, enlaces o se\u00f1ales de las librer\u00edas de los distintos frameworks JS.<\/p>\n
Siguiendo este proceso est\u00e1s viendo c\u00f3digo antes de que sea procesado por el navegador que coincidir\u00e1 con lo que escanea la Ara\u00f1a Seo, cuando no est\u00e1 en modo de renderizado JavaScript.<\/p>\n
Si intentas buscar unos elementos pero no obtienes ninguna aparici\u00f3n en el c\u00f3digo fuente, es de suponer que se generan din\u00e1micamente en el DOM y s\u00f3lo se mostrar\u00e1n en el c\u00f3digo renderizado.<\/p>\n<\/div>
![\"esempio](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/source-code-sito-web.jpeg\")
<\/a><\/span><\/div><> En este caso, el cuerpo de la etiqueta est\u00e1 completamente vac\u00edo, una clara se\u00f1al de que el sitio tiene JS.<\/p>\n
\n- 4. Auditar el c\u00f3digo renderizado<\/li>\n<\/ul>\n
La primera pregunta que debes hacerte es: \u00bfqu\u00e9 diferencia hay entre el c\u00f3digo renderizado y la fuente HTML est\u00e1tica? Para averiguarlo, basta con hacer clic con el bot\u00f3n derecho y utilizar \u00abinspeccionar elemento\u00bb en Chrome para ver el HTML renderizado. A menudo puedes ver el nombre del Framework JS en el c\u00f3digo renderizado, como \u00abReact\u00bb en el ejemplo siguiente.<\/p>\n<\/div>
![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/rendered-html-source-sito-web.jpeg\")
<\/a><\/span><\/div>Ver\u00e1s que el contenido y los hiperv\u00ednculos est\u00e1n en el c\u00f3digo renderizado, pero no en el c\u00f3digo fuente HTML original. Esto es lo que ver\u00e1 la Ara\u00f1a Seo cuando est\u00e9 en modo de renderizado JavaScript.<\/p>\n
> Haciendo clic en el elemento HTML inicial y luego en \u00abcopiar HTML externo\u00bb puedes comparar el c\u00f3digo fuente renderizado con el original.<\/p>\n<\/div>
<\/div><\/div><\/span>Javascript Crawl con Screaming Frog<\/h3><\/span><\/div><\/div><\/div>Una vez definida la presencia de JS y comprendidas las trampas, puedes comenzar tu Auditor\u00eda Seo con Screaming Frog configur\u00e1ndolo en modo de renderizado JavaScript. Esto te permite explorar sitios web y frameworks din\u00e1micos y ricos en JavaScript, como Angular, React y Vue.js.<\/p>\n
\n- 1. > > Para escanear un sitio web JavaScript, abre la Ara\u00f1a Seo, haz clic en ‘Configuraci\u00f3n Renderizado Ara\u00f1a’ y cambia ‘Renderizado’ a ‘JavaScript’.<\/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. Configurar el agente de usuario y el tama\u00f1o de la ventana<\/li>\n<\/ul>\n
Configura el agente de usuario<\/p>\n
> > Configuraci\u00f3n Cabecera HTTP Usuario-Agente<\/p>\n
Y el tama\u00f1o de la ventana<\/p>\n
> > Configuraci\u00f3n Renderizado Spider<\/p>\n
Por defecto, la ventana gr\u00e1fica est\u00e1 configurada como \u00abGoogle Mobile: Smartphone\u00bb, siguiendo la orientaci\u00f3n \u00abMobile Index First\u00bb del motor de b\u00fasqueda.<\/p>\n<\/div>
![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/rendering-simulato-di-google-smartphone.png\" "\\"rendering")
<\/span><\/div>\n- 3. Comprueba los recursos y enlaces externos<\/li>\n<\/ul>\n
> Aseg\u00farate de que los recursos como im\u00e1genes, CSS y JS est\u00e1n marcados en \u00abAra\u00f1a de configuraci\u00f3n\u00bb. Si los recursos est\u00e1n en un subdominio diferente, o en un \u00abdominio ra\u00edz\u00bb distinto, activa tambi\u00e9n \u00abcomprobar enlaces externos\u00bb, de lo contrario no se escanear\u00e1n y, por tanto, no se renderizar\u00e1n.<\/p>\n<\/div>
![\"configurazione](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/configurazione-crawl-pwe-aiti-Js.png\")
<\/a><\/span><\/div>\n- 4. Escanea<\/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. Ver la pesta\u00f1a Javascript<\/li>\n<\/ul>\n
Con la pesta\u00f1a JavaScript, dispones de 15 filtros que te ayudar\u00e1n a considerar las dependencias de JavaScript y a aislar los problemas m\u00e1s comunes.<\/p>\n<\/div>
<\/span><\/div>\n- P\u00e1ginas con recursos bloqueados<\/strong>: identifica todas las p\u00e1ginas con recursos (como im\u00e1genes, JavaScript y CSS) bloqueados por robots.txt. Esta condici\u00f3n puede ser un problema porque los motores de b\u00fasqueda pueden no ser capaces de acceder a recursos cr\u00edticos para renderizar las p\u00e1ginas con precisi\u00f3n. Recomiendo actualizar el archivo robots.txt para permitir que se escaneen todos los recursos cr\u00edticos y se utilicen para representar el contenido del sitio. Los recursos que no sean cr\u00edticos (por ejemplo, la incrustaci\u00f3n de Google Maps) pueden ignorarse.<\/li>\n
- Contiene enlaces JavaScript <\/strong>: el filtro muestra las p\u00e1ginas que contienen hiperv\u00ednculos que s\u00f3lo se descubren en el HTML renderizado despu\u00e9s de ejecutar JavaScript. Estos hiperv\u00ednculos no est\u00e1n en HTML crudo. Es una buena pr\u00e1ctica considerar la inclusi\u00f3n de enlaces importantes del lado del servidor en el HTML est\u00e1tico.<\/li>\n
- Contiene contenido JavaScript<\/strong>: muestra todas las p\u00e1ginas que contienen cuerpo de texto s\u00f3lo en HTML renderizado despu\u00e9s de ejecutar JavaScript. Google es capaz de renderizar las p\u00e1ginas y s\u00f3lo ver el contenido del lado del cliente, considera incluir el contenido importante del lado del servidor en el HTML sin procesar.<\/li>\n
- Noindex s\u00f3lo en HTML original<\/strong>: todas las p\u00e1ginas que contienen una etiqueta noindex en HTML est\u00e1tico pero no en HTML renderizado. Cuando Googlebot encuentra una etiqueta noindex, se salta la renderizaci\u00f3n y ejecuci\u00f3n de JavaScript. Como Googlebot se salta la ejecuci\u00f3n de JavaScript, utilizar JavaScript para eliminar el \u00abnoindex\u00bb en el HTML renderizado no funcionar\u00e1.<\/li>\n
- Nofollow s\u00f3lo en HTML original<\/strong>: identifica las p\u00e1ginas que contienen un atributo nofollow en HTML est\u00e1tico, y no en HTML renderizado. Esto significa que no se seguir\u00e1n los hiperv\u00ednculos que haya en el HTML sin procesar antes de la ejecuci\u00f3n de JavaScript. Elimina \u00abnofollow\u00bb si los enlaces deben ser seguidos, escaneados e indexados.<\/li>\n
- S\u00f3lo can\u00f3nico en<\/strong> HTML renderizado: devuelve todas las p\u00e1ginas que contienen una etiqueta s\u00f3lo can\u00f3nico en el HTML renderizado despu\u00e9s de ejecutar JavaScript. Recomiendo incluir un enlace can\u00f3nico en el HTML est\u00e1tico (o cabecera HTTP) para garantizar que Google pueda verlo y evitar depender \u00fanicamente del can\u00f3nico en el HTML renderizado.<\/li>\n
- Desajuste<\/strong> can\u00f3nico:identifica las p\u00e1ginas que contienen un enlace can\u00f3nico diferente en el HTML est\u00e1tico que en el HTML renderizado tras la ejecuci\u00f3n de JavaScript. Esta condici\u00f3n puede causar se\u00f1ales confusas y puede provocar un comportamiento no deseado por parte del motor de b\u00fasqueda.<\/li>\n
- T\u00edtulo de p\u00e1gina s\u00f3lo en<\/strong> HTML renderizado: Devuelve las p\u00e1ginas que contienen un t\u00edtulo de p\u00e1gina s\u00f3lo en el HTML renderizado despu\u00e9s de ejecutar JavaScript. Esto significa que un motor de b\u00fasqueda tiene que procesar la p\u00e1gina para verlos. Considera la posibilidad de incluir el contenido importante del lado del servidor en el HTML sin procesar.<\/li>\n
- T\u00edtulo de p\u00e1gina actualizado por JavaScript<\/strong>: identifica las p\u00e1ginas cuyos t\u00edtulos han sido modificados por JavaScript. Esto significa que el t\u00edtulo de la p\u00e1gina en HTML est\u00e1tico es diferente del t\u00edtulo de la p\u00e1gina en HTML renderizado. Considera la posibilidad de incluir contenido importante del lado del servidor en HTML est\u00e1tico.<\/li>\n
- Meta descripci\u00f3n s\u00f3lo en<\/strong> HTML renderizado: Devuelve las p\u00e1ginas que contienen una meta descripci\u00f3n s\u00f3lo en el HTML renderizado despu\u00e9s de ejecutar JavaScript.<\/li>\n
- Meta descripci\u00f3n actualizada por JavaScript<\/strong>: todas las p\u00e1ginas que tienen meta descripciones modificadas por JavaScript. Esto significa que la meta descripci\u00f3n en HTML est\u00e1tico es diferente de la meta descripci\u00f3n en HTML renderizado.<\/li>\n
- H1 <\/strong> s\u00f3lo en <\/strong> HTML renderizado: p\u00e1ginas que contienen un h1 s\u00f3lo en el HTML renderizado despu\u00e9s de ejecutar JavaScript. Esto significa que un motor de b\u00fasqueda debe renderizar la p\u00e1gina para tener en cuenta el encabezamiento. Considera la posibilidad de incluir encabezamientos del lado del servidor en el HTML est\u00e1tico.<\/li>\n
- H1 Actualizado por JavaScript<\/strong>: p\u00e1ginas que tienen h1s modificados por JavaScript. Esto significa que el h1 en HTML crudo es diferente del h1 en HTML renderizado.<\/li>\n
- Utiliza<\/strong> URLs del antiguo esquema de rastreo AJAX: identifica las URLs que todav\u00eda utilizan el antiguo esquema de rastreo AJAX (una URL que contiene un fragmento hash #!) que qued\u00f3 oficialmente obsoleto en octubre de 2015. Considera el renderizado en el servidor o el pre-renderizado cuando sea posible, y el renderizado din\u00e1mico como soluci\u00f3n alternativa.<\/li>\n<\/ul>\n
\n- Utiliza<\/strong> la etiqueta meta fragmento del antiguo esquema de rastreo AJAX: incluye las URL que incluyen una etiqueta meta fragmento que indica que la p\u00e1gina sigue utilizando el antiguo esquema de rastreo AJAX que qued\u00f3 oficialmente obsoleto en octubre de 2015. El consejo es actualizar las URL para seguir la evoluci\u00f3n de JavaScript en los sitios web actuales. Considera el renderizado en el servidor o el pre-renderizado cuando sea posible, y el renderizado din\u00e1mico como soluci\u00f3n alternativa. Si el sitio sigue teniendo por error la antigua etiqueta meta fragmento, hay que eliminarla.<\/li>\n<\/ul>\n
\n- 6. Supervisar los recursos bloqueados<\/li>\n<\/ul>\n
Vigila todo lo que aparezca bajo el filtro \u00abP\u00e1ginas con recursos bloqueados\u00bb en la pesta\u00f1a \u00abJavascript\u00bb.<\/p>\n<\/div>
![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/pagine-blocked-resources.jpeg\")
<\/a><\/span><\/div>Los recursos bloqueados tambi\u00e9n pueden mostrarse para cada p\u00e1gina en la pesta\u00f1a \u00abP\u00e1gina renderizada\u00bb, junto a la pantalla renderizada en el panel inferior de la ventana. En casos graves, si un sitio JavaScript bloquea completamente los recursos JS, entonces el sitio simplemente no ser\u00e1 escaneado.<\/p>\n
<\/div>\n<\/div>![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/blocked-resources-small-anteprima.jpeg\")
<\/a><\/span><\/div>Los recursos bloqueados tambi\u00e9n pueden verse en la pesta\u00f1a \u00abC\u00f3digo de respuesta\u00bb.<\/p>\n<\/div><\/div><\/div><\/div><\/div>
> C\u00f3digos de respuesta Recurso bloqueado<\/span><\/p>\n<\/div><\/div><\/div><\/div><\/div>> > Las p\u00e1ginas y los recursos individuales bloqueados tambi\u00e9n pueden exportarse en bloque con el informe \u00abExportaci\u00f3n en bloque de enlaces internos de recursos bloqueados por c\u00f3digo de respuesta para desbloquearlos y optimizarlos\u00bb.<\/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. Ver p\u00e1ginas renderizadas<\/li>\n<\/ul>\n
Con Screaming Frog es posible mostrar la p\u00e1gina rastreada renderizada en la pesta\u00f1a \u00abP\u00e1gina renderizada\u00bb que aparece din\u00e1micamente en la parte inferior de la interfaz de usuario cuando se rastrea en modo de renderizado JavaScript.<\/p>\n<\/div>
![](\"http:\/\/screamingfrog.club\/wp-content\/uploads\/2024\/03\/rendered-page-scheda.jpeg\")
<\/a><\/span><\/div>En caso de que la p\u00e1gina no se cargue, considera la posibilidad de intervenir sobre el tiempo de espera AJAX directamente en la configuraci\u00f3n de Seo Spider.<\/p>\n
La visualizaci\u00f3n de la p\u00e1gina renderizada es vital a la hora de analizar lo que un bot de b\u00fasqueda moderno es capaz de ver, y es especialmente \u00fatil cuando se revisa en la puesta en escena, donde no es posible utilizar la funcionalidad nativa de Google \u00abFetch & Render\u00bb a trav\u00e9s de Search Console.<\/p>\n
Si has ajustado el user-agent y el viewport en Googlebot Smartphone, podr\u00e1s ver exactamente c\u00f3mo se renderiza cada p\u00e1gina en m\u00f3vil, por ejemplo.<\/p>\n
\n- 8. Comparar HTML en bruto y renderizado<\/li>\n<\/ul>\n
Es posible que desees almacenar y mostrar HTML y HTML renderizado dentro de la Ara\u00f1a Seo cuando trabajes con JavaScript.<\/p>\n
> > > Configuraci\u00f3n Extracci\u00f3n Spider Almacenar Html\/Renderizar Html<\/p>\n
Marcando las opciones adecuadas \u00abAlmacenar HTML\u00bb y \u00abAlmacenar HTML renderizado\u00bb puedes comparar f\u00e1cilmente las dos versiones y poder comparar las diferencias para asegurarte de que el contenido o los enlaces cr\u00edticos est\u00e1n presentes en el DOM.<\/p>\n<\/div>
Hasta hace unos a\u00f1os, uno de los problemas m\u00e1s comunes en la optimizaci\u00f3n SEO era conseguir que las p\u00e1ginas con contenido creado din\u00e1micamente se indexaran mediante Javascript. El problema estaba relacionado con los robots de los motores de b\u00fasqueda, que no eran capaces de escanear e indexar estos recursos y s\u00f3lo ten\u00edan en cuenta el contenido del c\u00f3digo fuente del HTML est\u00e1tico.<\/p>\n
Paralelamente, se ha producido una evoluci\u00f3n de frameworks como AngularJS, React, Vue.JS, aplicaciones de p\u00e1gina \u00fanica (SPA) y aplicaciones web progresivas (PWA), que ha llevado a Google a evolucionar significativamente y alcanzar una madurez plena en la comprensi\u00f3n de las p\u00e1ginas web como un navegador moderno.<\/p>\n
Sin embargo, aunque hoy en d\u00eda Google suele ser capaz de escanear e indexar la mayor parte del contenido JavaScript, se recomienda la renderizaci\u00f3n del lado del servidor, la renderizaci\u00f3n previa o la renderizaci\u00f3n din\u00e1mica en lugar de confiar en el JavaScript del lado del cliente, ya que sigue siendo dif\u00edcil para los rastreadores procesar JavaScript con \u00e9xito o de forma inmediata.<\/p>\n
Por estas razones, es crucial durante el an\u00e1lisis comprender las diferencias entre el DOM despu\u00e9s de que JavaScript haya entrado en juego y construido la p\u00e1gina web, y la respuesta est\u00e1tica del HTML.<\/p>\n
Javascript, la ara\u00f1a seo y algunas contraindicaciones<\/p>\n
Para remediar esta necesidad, Screaming Frog viene en tu ayuda con su modo \u00abRenderizado Javascript\u00bb, que ha integrado la biblioteca \u00abChromium\u00bb para emular lo mejor posible el comportamiento de la ara\u00f1a de Google.<\/p>\n<\/div>
<\/a><\/span><\/div>Visi\u00f3n<\/strong>: en 2019, Google actualiz\u00f3 el Servicio de renderizado web (WRS), que antes se basaba en Chrome 41, con la \u00faltima versi\u00f3n estable de Chrome, lo que le permiti\u00f3 admitir m\u00e1s de mil funciones adicionales.<\/p>\n 1. Consideremos algunos aspectos inherentes a los sitios en Javascript:<\/p>\n Aunque comprender las diferencias entre el DOM y el html est\u00e1tico tras la ejecuci\u00f3n de Javascript es muy importante, desaconsejo activar el modo \u00abRenderizado Javascript\u00bb indiscriminadamente para cada sitio web.<\/p>\n El rastreo con JavaScript es m\u00e1s lento y m\u00e1s intensivo para el servidor, ya que hay que recuperar todos los recursos (tanto JavaScript como CSS, im\u00e1genes, etc.) para la renderizaci\u00f3n de cada p\u00e1gina web. Esta criticidad es irrelevante para los sitios peque\u00f1os, pero para los grandes portales o ecommerce podr\u00eda convertirse en un obst\u00e1culo para tu escaneado en t\u00e9rminos de tiempo y Ram.<\/p>\n Todos los recursos de una p\u00e1gina (JS, CSS, im\u00e1genes) deben estar disponibles para ser escaneados, renderizados e indexados.<\/p>\n Google sigue exigiendo URL limpias y \u00fanicas para una p\u00e1gina, y los enlaces deben estar en etiquetas de anclaje HTML adecuadas (puedes ofrecer un enlace est\u00e1tico, as\u00ed como llamar a una funci\u00f3n JavaScript).<\/p>\n La Ara\u00f1a de Google no interact\u00faa como los usuarios, por ejemplo, no hace clic en los recursos cargando eventos adicionales despu\u00e9s de la renderizaci\u00f3n (un clic, un hover o un desplazamiento, por ejemplo).<\/p>\n La instant\u00e1nea de la p\u00e1gina renderizada se toma cuando se determina que la actividad de la red ha cesado, o m\u00e1s all\u00e1 de un umbral de tiempo. Existe el riesgo de que, si una p\u00e1gina tarda mucho en procesarse, se omita y los elementos no se vean ni se indexen.<\/p>\n En general, Google renderiza todas las p\u00e1ginas, pero no las pone en cola para ser renderizadas si tienen un \u00abnoindex\u00bb en la respuesta HTTP inicial o HTML est\u00e1tico.<\/p>\n Por \u00faltimo, la representaci\u00f3n de Google es independiente de la indexaci\u00f3n. Google escanea inicialmente el HTML est\u00e1tico de un sitio web, y pospone la renderizaci\u00f3n hasta que no tiene recursos.<\/p>\n Al iniciar el desarrollo de un sitio web, conocer estas condiciones es vital para el \u00e9xito o el fracaso del proyecto en t\u00e9rminos de posicionamiento org\u00e1nico.<\/p>\n<\/div> Google desaconseja confiar en JavaScript del lado del cliente y recomienda desarrollar con \u00abmejora progresiva\u00bb, construyendo la estructura y la navegaci\u00f3n del sitio utilizando s\u00f3lo HTML y mejorando despu\u00e9s el aspecto y la interfaz del sitio con AJAX.<\/p>\n Por lo tanto, si utilizas un framework JavaScript, Google recomienda la renderizaci\u00f3n del lado del servidor, la renderizaci\u00f3n previa o la renderizaci\u00f3n h\u00edbrida, que pueden mejorar el rendimiento para los usuarios y los rastreadores de los motores de b\u00fasqueda.<\/p>\n Al servir el renderizado del lado del servidor (SSR) y el pre-renderizado, la ejecuci\u00f3n JavaScript de las p\u00e1ginas proporciona una versi\u00f3n HTML inicial renderizada y lista para escanear.<\/p>\n El renderizado h\u00edbrido (a veces denominado \u00abisom\u00f3rfico\u00bb) identifica una versi\u00f3n del renderizado que ejecuta Javascript del lado del servidor para la carga inicial de la p\u00e1gina y HTML y Javascript del lado del cliente para los elementos no cr\u00edticos y las p\u00e1ginas posteriores.<\/p>\n Muchos frameworks de JavaScript, como React o Angular Universal, permiten el renderizado del lado del servidor e h\u00edbrido.<\/p>\n Alternativamente, puedes optar por utilizar el renderizado din\u00e1mico.<\/p>\n Esto puede ser especialmente \u00fatil cuando no es posible realizar cambios en la base de c\u00f3digo del front-end. El renderizado din\u00e1mico pasa del renderizado del lado del cliente para los usuarios al contenido pre-renderizado para los motores de b\u00fasqueda.<\/p>\n<\/div> Aunque optar por las tres soluciones anteriores resuelve la mayor\u00eda de los problemas de rastreo, es bueno tener en cuenta un aspecto adicional.<\/p>\n Google tiene un proceso de indexaci\u00f3n en dos fases, en el que inicialmente escanea e indexa el HTML est\u00e1tico, y luego vuelve m\u00e1s tarde, cuando hay recursos disponibles, para renderizar la p\u00e1gina y escanear e indexar el contenido y los enlaces del HTML renderizado.<\/p>\n<\/div> El tiempo necesario entre el rastreo y la renderizaci\u00f3n tambi\u00e9n podr\u00eda ser muy largo (hasta 7 d\u00edas) y esta condici\u00f3n es un problema para los sitios que dependen de contenidos que por su propia naturaleza tienen caracter\u00edsticas de actualidad o simplemente caducan (por ejemplo, sitios de noticias, eventos, etc.); mientras que el tiempo medio (declarado en la Chrome Dev Summit de 2019) es de 5 segundos.<\/p>\n<\/div> Identificar un sitio construido con un framework JavaScript puede ser bastante sencillo, sin embargo, diagnosticar secciones, p\u00e1ginas o simplemente elementos m\u00e1s peque\u00f1os que se adaptan din\u00e1micamente mediante JavaScript puede ser mucho m\u00e1s dif\u00edcil. Al establecer una Auditor\u00eda Seo, es una buena pr\u00e1ctica determinar inmediatamente si hay presencia de Javascript e intentar comprender si el sitio puede tener problemas durante los distintos rastreos del Agente de Usuario.<\/p>\n Hay varias formas de saber si el sitio est\u00e1 construido utilizando un framework JavaScript, veamos algunas de ellas:<\/p>\n Por defecto, el Seo Spider escanea utilizando el \u00abantiguo esquema de escaneo AJAX\u00bb, lo que significa que JavaScript est\u00e1 desactivado, y s\u00f3lo escanea HTML sin procesar.<\/p>\n Si el sitio s\u00f3lo utiliza JavaScript del lado del cliente, entonces s\u00f3lo obtendr\u00e1s como resultado de tu escaneo la p\u00e1gina de inicio con una respuesta 200 con unos cuantos archivos \u00abJavascript y CSS\u00bb.<\/p>\n<\/div> Como puedes ver, la pesta\u00f1a \u00abEnlaces externos\u00bb tampoco tiene hiperv\u00ednculos, ya que no est\u00e1n renderizados en html sin procesar y no pueden ser vistos por la ara\u00f1a Seo.<\/p>\n Aunque esto suele ser una se\u00f1al de que el sitio web utiliza un framework JavaScript, con renderizaci\u00f3n del lado del cliente, no te dice si existen tambi\u00e9n otras dependencias JavaScript en el sitio.<\/p>\n Por ejemplo, un sitio web puede tener JavaScript s\u00f3lo para cargar productos en p\u00e1ginas de categor\u00edas, o actualizar elementos de t\u00edtulo.<\/p>\n Entonces, \u00bfc\u00f3mo encontrarlos f\u00e1cilmente?<\/p>\n > > Para identificar el JavaScript de forma m\u00e1s eficaz, es necesario cambiar al modo de renderizado de JavaScript (\u00abConfig Spider Rendering\u00bb) y escanear el sitio, o una muestra de modelos de todo el sitio.<\/p>\n La Ara\u00f1a SEO escanear\u00e1 tanto el HTML original como el renderizado para identificar las p\u00e1ginas que tienen contenido o enlaces s\u00f3lo disponibles del lado del cliente y se\u00f1alar otras dependencias clave.<\/p>\n<\/div> Para ayudarte a navegar por los problemas habituales de los sitios Javascript del lado del cliente, tienes una lista completa de filtros que te guiar\u00e1n en la definici\u00f3n de tu Auditor\u00eda Seo.<\/p>\n El Seo Spider te avisar\u00e1 si hay alg\u00fan contenido que s\u00f3lo se encuentre en el HTML renderizado despu\u00e9s de que el JavaScript entre en juego, d\u00e1ndote una visi\u00f3n completa del comportamiento del sitio web.<\/p>\n<\/div> En este ejemplo, el 100% del contenido s\u00f3lo est\u00e1 en el HTML renderizado, ya que el sitio se basa totalmente en JavaScript.<\/p>\n En este caso, el examen se centr\u00f3 en el n\u00famero de palabras encontradas en el contenido de las p\u00e1ginas, pero tambi\u00e9n puedes encontrar, por ejemplo, referencias a p\u00e1ginas con enlaces s\u00f3lo en el HTML renderizado y remediarlas siguiendo las instrucciones de Google.<\/p>\n<\/div> Esta funci\u00f3n de Screaming Frog tambi\u00e9n es muy \u00fatil para comprobar si las metaetiquetas u otros elementos Seo est\u00e1n presentes en el html est\u00e1tico o s\u00f3lo se sirven y\/o modifican una vez ejecutado el Javascript.<\/p>\n Una alternativa para comprender la naturaleza de los sitios web es desactivar Javascript directamente en el navegador y volver a cargar la p\u00e1gina. Si aparece en blanco, no hay duda de que el sitio web se dise\u00f1\u00f3 con Javascript.<\/p>\n<\/div> La tercera soluci\u00f3n es hacer clic con el bot\u00f3n derecho en el sitio web y ver el c\u00f3digo fuente examinando el contenido Html, si hay texto, enlaces o se\u00f1ales de las librer\u00edas de los distintos frameworks JS.<\/p>\n Siguiendo este proceso est\u00e1s viendo c\u00f3digo antes de que sea procesado por el navegador que coincidir\u00e1 con lo que escanea la Ara\u00f1a Seo, cuando no est\u00e1 en modo de renderizado JavaScript.<\/p>\n Si intentas buscar unos elementos pero no obtienes ninguna aparici\u00f3n en el c\u00f3digo fuente, es de suponer que se generan din\u00e1micamente en el DOM y s\u00f3lo se mostrar\u00e1n en el c\u00f3digo renderizado.<\/p>\n<\/div> <> En este caso, el cuerpo de la etiqueta est\u00e1 completamente vac\u00edo, una clara se\u00f1al de que el sitio tiene JS.<\/p>\n La primera pregunta que debes hacerte es: \u00bfqu\u00e9 diferencia hay entre el c\u00f3digo renderizado y la fuente HTML est\u00e1tica? Para averiguarlo, basta con hacer clic con el bot\u00f3n derecho y utilizar \u00abinspeccionar elemento\u00bb en Chrome para ver el HTML renderizado. A menudo puedes ver el nombre del Framework JS en el c\u00f3digo renderizado, como \u00abReact\u00bb en el ejemplo siguiente.<\/p>\n<\/div> Ver\u00e1s que el contenido y los hiperv\u00ednculos est\u00e1n en el c\u00f3digo renderizado, pero no en el c\u00f3digo fuente HTML original. Esto es lo que ver\u00e1 la Ara\u00f1a Seo cuando est\u00e9 en modo de renderizado JavaScript.<\/p>\n > Haciendo clic en el elemento HTML inicial y luego en \u00abcopiar HTML externo\u00bb puedes comparar el c\u00f3digo fuente renderizado con el original.<\/p>\n<\/div> Una vez definida la presencia de JS y comprendidas las trampas, puedes comenzar tu Auditor\u00eda Seo con Screaming Frog configur\u00e1ndolo en modo de renderizado JavaScript. Esto te permite explorar sitios web y frameworks din\u00e1micos y ricos en JavaScript, como Angular, React y Vue.js.<\/p>\n Configura el agente de usuario<\/p>\n > > Configuraci\u00f3n Cabecera HTTP Usuario-Agente<\/p>\n Y el tama\u00f1o de la ventana<\/p>\n > > Configuraci\u00f3n Renderizado Spider<\/p>\n Por defecto, la ventana gr\u00e1fica est\u00e1 configurada como \u00abGoogle Mobile: Smartphone\u00bb, siguiendo la orientaci\u00f3n \u00abMobile Index First\u00bb del motor de b\u00fasqueda.<\/p>\n<\/div> > Aseg\u00farate de que los recursos como im\u00e1genes, CSS y JS est\u00e1n marcados en \u00abAra\u00f1a de configuraci\u00f3n\u00bb. Si los recursos est\u00e1n en un subdominio diferente, o en un \u00abdominio ra\u00edz\u00bb distinto, activa tambi\u00e9n \u00abcomprobar enlaces externos\u00bb, de lo contrario no se escanear\u00e1n y, por tanto, no se renderizar\u00e1n.<\/p>\n<\/div> Con la pesta\u00f1a JavaScript, dispones de 15 filtros que te ayudar\u00e1n a considerar las dependencias de JavaScript y a aislar los problemas m\u00e1s comunes.<\/p>\n<\/div> Vigila todo lo que aparezca bajo el filtro \u00abP\u00e1ginas con recursos bloqueados\u00bb en la pesta\u00f1a \u00abJavascript\u00bb.<\/p>\n<\/div> Los recursos bloqueados tambi\u00e9n pueden mostrarse para cada p\u00e1gina en la pesta\u00f1a \u00abP\u00e1gina renderizada\u00bb, junto a la pantalla renderizada en el panel inferior de la ventana. En casos graves, si un sitio JavaScript bloquea completamente los recursos JS, entonces el sitio simplemente no ser\u00e1 escaneado.<\/p>\n Los recursos bloqueados tambi\u00e9n pueden verse en la pesta\u00f1a \u00abC\u00f3digo de respuesta\u00bb.<\/p>\n<\/div><\/div><\/div><\/div><\/div> > C\u00f3digos de respuesta Recurso bloqueado<\/span><\/p>\n<\/div><\/div><\/div><\/div><\/div> > > Las p\u00e1ginas y los recursos individuales bloqueados tambi\u00e9n pueden exportarse en bloque con el informe \u00abExportaci\u00f3n en bloque de enlaces internos de recursos bloqueados por c\u00f3digo de respuesta para desbloquearlos y optimizarlos\u00bb.<\/p>\n<\/div> Con Screaming Frog es posible mostrar la p\u00e1gina rastreada renderizada en la pesta\u00f1a \u00abP\u00e1gina renderizada\u00bb que aparece din\u00e1micamente en la parte inferior de la interfaz de usuario cuando se rastrea en modo de renderizado JavaScript.<\/p>\n<\/div> En caso de que la p\u00e1gina no se cargue, considera la posibilidad de intervenir sobre el tiempo de espera AJAX directamente en la configuraci\u00f3n de Seo Spider.<\/p>\n La visualizaci\u00f3n de la p\u00e1gina renderizada es vital a la hora de analizar lo que un bot de b\u00fasqueda moderno es capaz de ver, y es especialmente \u00fatil cuando se revisa en la puesta en escena, donde no es posible utilizar la funcionalidad nativa de Google \u00abFetch & Render\u00bb a trav\u00e9s de Search Console.<\/p>\n Si has ajustado el user-agent y el viewport en Googlebot Smartphone, podr\u00e1s ver exactamente c\u00f3mo se renderiza cada p\u00e1gina en m\u00f3vil, por ejemplo.<\/p>\n Es posible que desees almacenar y mostrar HTML y HTML renderizado dentro de la Ara\u00f1a Seo cuando trabajes con JavaScript.<\/p>\n > > > Configuraci\u00f3n Extracci\u00f3n Spider Almacenar Html\/Renderizar Html<\/p>\n Marcando las opciones adecuadas \u00abAlmacenar HTML\u00bb y \u00abAlmacenar HTML renderizado\u00bb puedes comparar f\u00e1cilmente las dos versiones y poder comparar las diferencias para asegurarte de que el contenido o los enlaces cr\u00edticos est\u00e1n presentes en el DOM.<\/p>\n<\/div>\n
\n
Javascript del lado del servidor y del lado del cliente<\/h3><\/span>
Tiempos de rastreo de Google<\/h3><\/span>
<\/span><\/div>C\u00f3mo identificar 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 con 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