Diferentes métodos para indexar contenido JavaScript - Ajax

Publicado por Lino Uruñuela el 19 de mayo del 2019

*Para poder comprobar visualmente desde el inspector de urls de Search Console que se están ejecutando las llamadas Ajax.

A priori debería indexar el contenido con ambos métodos, ya que si no fuese así sería de conocimiento público y se habría comentado ampliamente dada la cantidad de sites que usan estos métodos de una u otra manera.

Diciendo esto puede parecer que este experimento no tiene mucha trascendencia, pero sí la tiene, y mucha, ya que Googlebot se está actualizando, y no sabemos qué novedades habrá en cuanto a cómo Google es capaz de rastrear páginas webs altamente basadas en JavaScript (ya sea puro JavaScript como jQuery como el usado por frameworks como Angular, React o Vue.js).



indexar contenido javascript


Googlebot usando nuevas versiones de Chrome

Y es que Google hasta ahora usaba la versión 41 del navegador Chrome, lanzada en abril del 2015, que para que nos hagamos una idea, por esa fechas se usaba Internet Explorer 11, acaba de lanzarse Microsoft Edge... así que estaba un poco desactualizado.

El problema de esto es que Google no usaba muchas de las nuevas funcionalidades que las nuevas versiones de Chrome han ido añadiendo, algunas de ellas muy importantes para la carga de determinados contenidos como para la disposición de los mismos.

En la siguiente imagen podemos ver las funcionalidades que soporta Googlebot en las diferentes versiones, a la izquierda las funciones que Googlebot aceptaba y acepta cuando rastrea el site usando la antigua versión y a la derecha las funcionalidades soportadas con la reciente actualización.

Funciones soportadas por Googlebot usando Chrome 41 y Chrome 74

Debemos dejar claro, que el bot actual por defecto que usa Google es el antiguo, el que usa la versión 41 de Chrome, son muy pocos los accesos que Google realiza con el nuevo Googlebot y no sabremos cuánto tardará en usarlo como predeterminado.

En realidad Googlebot basado en Chrome 41 sí soporta determinadas funcionalidades posteriores al número de su versión, pero no sabemos cuáles. Tal y como nos ha confirmado el propio Google (a través de Martin Splitt) Google está realizando experimentos usando una versión más actual del navegador, aunque en una muestra pequeña para probarlo.

A raíz de las recientes conversaciones y anuncios por parte de Google sobre esta actualización de su rastreador (Googlebot) han surgido varias dudas, las cuales no están claras al 100%, al menos por mi parte, y sobre las que quiero arrojar algo de luz, o al menos intentarlo.


Métodos para la carga de contenido mediante Ajax

Una de las tendencias actuales con el uso de los dispositivos móviles a la hora de cargar ciertos contenidos y/o recursos cuándo el usuario accede a una url de contenido es obtener ciertos elementos usando una carga diferida de estos recursos, es decir, una vez que el HTML inicial ha sido descargado por el navegador, se realiza la carga de otros elementos (ya sea contenido, como recursos javascript, como imágenes) los cuales podrían retrasar mucho la visualización de contenido posterior a estas llamadas, por eso se cargan lo último.

A la hora de realizar esta carga en diferido se pueden usar diferentes métodos, normalmente este método depende del tipo de elemento que vamos a cargar, pero también de qué "tecnología" usemos. Todas ellas se suelen denominar "carga por ajax" aunque no siempre el término es del todo correcto.

Hoy no vamos a entrar en nomenclaturas, ni en todos los métodos posibles de carga en diferido, hoy vamos a intentar comprobar si Google es capaz de obtener diferentes elementos usando dos técnicas.

  • XMLHttpRequest
    XMLHttpRequest es un objeto JavaScript que fue diseñado por Microsoft y adoptado por Mozilla, Apple y Google. Actualmente es un estándar de la W3C. Proporciona una forma fácil de obtener información de una URL sin tener que recargar la página completa

    Este método era el usado típicamente hace tiempo, pero con la llegada de librerías como jQuery y posteriormente con FrameWorks como Angular, React o Vue (aunque estas dos últimas son librerías si nos ponemos estrictos) se quedó en desuso.

    Aquí documentación y ejemplos de uso

  • Fetch
    El API fetch es un nuevo estándar que viene a dar una alternativa para interactuar por HTTP, con un diseño moderno, basado en promesas, con mayor flexibilidad y capacidad de control a la hora de realizar llamadas al servidor, y que funciona tanto desde window como desde worker

    Este otro método tiene varias ventajas sobre el método XMLHttpRequest pero no vamos a entrar en esto, solo queremos comprobar si Google es capaz de ejecutar ambas y si es capaz de indexar el contenido obtenido por ambos métodos.

    Tenéis documentación y ejemplos en este enlace.


Experimento SEO: indexando contenido obtenido por XMLHttpRequest y Fetch

A continuación vamos a cargar contenido usando ambos métodos, y vamos a cargar de las dos maneras  tanto contenido de texto como imágenes. Decir que estas imágenes no son personas reales sino que son imágenes creadas mediante Inteligencia Artificial en esta web y que me vienen de perlas para determinados experimentos.

Usando XMLHttpRequest

Aquí se mostrará el texto cargado mediante XMLHttpRequest.


Usando Fetch

Y este otro texto es cargado usando fetch


Las urls a las que se llama en cada uno de los métodos son diferentes, para así luego poder comprobar mejor si Googlebot accede a él (usando los logs) y también cómo valora  e interpreta Google esas urls usando el Inspector de URLs del nuevo Search Console, que nos podría dar información útil a la hora de intentar saber cómo trata estos métodos Google.

Las llamadas para la ejecución de los dos métodos son realizadas ambas sin necesidad de la interacción del usuario, se realiza en el onReady del documento, ya que como comprobamos Google es capaz de ejecutar JavaScript (y de hecho así lo hace) cuándo se lanza sin necesidad de ningún evento o acción por parte del usuario.

¿Cómo comprobar los resultados?

Para saber si Google es capaz de indexar (y por lo tanto poder posicionar) páginas que carguen contenido usando alguno de estos métodos JavaScript, podremos hacer una búsqueda por las palabras entrecomilladas en el encabezado de cada método.

Esta manera de comprobar si Google accede e indexa estos contenidos no es del todo fiable, podría ser "forzado" para su indexación, ya sea por sitemaps, por enlaces desde este site como otros sites que copien / fusilen este código, y otras mucha maneras.

La forma más fiable será analizando los logs y comprobando que Google accede a los archivos que contienen el HTML solicitado, y también si Google accede a las imágenes que hay en ese HTML.

Analizando los logs podremos obtener una respuesta más fiable que simplemente comprobando si aparece esta url en los resultados de Google al buscar alguna de las dos palabras que hay entre paréntesis

Así que ya sabéis, atentos a cuando publique los resultados, espero que en una semana podamos ver algo

¿Alguna idea / sugerencia / corrección sobre este experimento?

 



Contacta

Lánzate y pregunta!


He leído y acepto la política de privacidad

Mecagoenlos.com te informa que los datos de carácter personal que nos proporciones rellenando el presente formulario serán tratados por Lino Uruñuela. como responsable de esta web.

La finalidad de la recogida y tratamiento de los datos personales que te solicitamos es para enviar un correo con los datos que introduzcas, sin guardarse en ninguna base de datos.

Legitimación: Al marcar la casilla de aceptación, estás dando tu legítimo consentimiento para que tus datos sean tratados conforme a las finalidades de este formulario descritas en la política de privacidad.

Como usuario e interesado te informamos que los datos que nos facilitas estarán ubicados en los servidores de Linode.com (proveedor de hosting de Mecagoenlos.com) cumpliendo la ley de protección de datos. Ver política de privacidad de Linode.com.

Podrás ejercer tus derechos de acceso, rectificación, limitación y suprimir los datos en info@mecagoenlos.com, así como el derecho a presentar una reclamación ante una autoridad de control. Más información aquí.

Últimos posts

Últimos comentarios


Javier

Buenas Lino, ¿Alguna novedad sobre cómo considera Google los links en PDFs? Se me ocurre que, siguiendo con este experimento, se po
Post: Link building con PDF

Francisco

Flaco. Por lo general, no dejo comentarios pero, en tu caso, voy a hacer una excepción pues, sencillamente... ¡sos un genio!, Gracias.
Post: Cómo cargar css y js y no bloquear la carga de contenido

Juan Francisco Gancia

Excelente artículo, gracias! Te encuentro de casualidad por un post de hace 10 años.
Post: Diferencias entre url indexada y url accesible

Lino Urnuela

@Emirodgar gracias! Pero parece que en tema de imágenes las pilla lo hagas cómo lo hagas parece, eso sí, siempre que no tengas un fall
Post: Indexar imágenes en Google usando Lazy Load

Emirodgar

Muy interesante el experimento. Yo estaba probando con los nuevos formatos webp y pero al final, como eran pocas imágenes y usaba Masonry,
Post: Indexar imágenes en Google usando Lazy Load

Lino Uruñuela

Completamente de acuerdo :) Pero en este experimento solo quería comprobar el método usado para hacer lazy load, en este caso con xmlht
Post: Indexar imágenes en Google usando Lazy Load

Francisco Morales

Lino muy interesante las distintas formas de cargar la imagen. Pero no crees que lo realmente interesante de aplicar Lazy Loading es cargar
Post: Indexar imágenes en Google usando Lazy Load

javier

Buenas , esto del onclik ha cambiado actuamente en algunas web que tengo las lee y sigue enlaces
Post: ¿Cómo ejecuta, interpreta e indexa Google el contenido cargado mediante javascript?

David Girona

Antes de Nada muchas gracias por la aportación. Estoy probando de poner en marcha este procedimiento y me surgen un par de dudas. En
Post: Cómo añadir el valor del meta Robots a Google Analytics via Google Tag Manager

Javier Espinoza

Gracias por la informacion!! Este tipo de blogs me parecen muy importantes, esto lo estudio en la universidad. gracias por la informacion. h
Post: Atacados por los .cn .cz .pl