AJAX: ¿Genera URLs o no?

He escuchado en bastantes ocasiones que la utilización de AJAX tiene como principal beneficio el hecho de no generar nuevas URLs, y aunque bien es cierto que para los usuarios es así, hoy vengo a demostrar que para los rastreadores el comportamiento puede ser diferente.

En primer lugar, y para los menos técnicos, voy a tratar de explicar de la forma más sencilla, qué es AJAX; de hecho en un artículo anterior sobre desindexación a través de X-Robots Tag ya explicaba cómo funcionaba la tecnología AJAX

AJAX: Asynchronous Javascript and XML

AJAX es el acrónimo de Asynchronous Javascript and XML y es una forma de desarrollo de javascript que permite crear un canal de comunicación con el servidor desde el equipo de cliente en segundo plano, pudiendo recuperar datos del servidor sin necesidad de refrescar la página. Básicamente es una forma de recoger información del servidor, de tal forma que de cara al usuario, aparentemente no está ocurriendo nada fuera del entorno de la propia página.

funcionamiento de ajax
Funcionamiento de AJAX

AJAX se estandarizó en 2005 aproximadamente y empezó a tener soporte en la mayoría de los navegadores web.

Lógicamente, de AJAX se puede extraer todo su potencial cuando se fusiona con lenguajes de servidor y bases de datos, como PHP y SQL, ya que se puede establecer una conexión entre un HTML y un PHP para llamar a la base de datos y poder recuperar la información que solicita el usuario.

Un claro ejemplo son los ecommerce que cambian los productos que muestran en función de los filtros seleccionados por el usuario: el filtro llama al servidor haciendo una petición a su propia API y ésta le devuelve la información para que la pinte en la URL de origen.

El Objeto XMLHttpRequest

Para crear una conexión asíncrona a través de AJAX, se suele utilizar el objeto XMLHttpRequest, aunque existen diferentes formas. En mi caso concreto, y para este experimento, voy a hacer una llamada AJAX a través de este objeto.

Para ello básicamente tenemos que crear una estancia del objeto y pasarle una serie de parámetros que serán los que definan a qué URL llamar y bajo qué método (GET, POST..) Aunque no me voy a parar a explicar el código, puesto que no es el objeto del artículo, el objeto lo creamos así:

var peticion = null;
            if(window.XMLHttpRequest){                //si el usuario usa mozilla, chrome, safari...
            peticion = new XMLHttpRequest()}
                else if(window.ActiveXObject){        //si el usuario usa explorer (alguno habrá...)
                    peticion = new ActiveXObject('Microsoft.XMLHTTP')
                }

Experimento: Comprobar que AJAX también puede generar URLs rastreables e indexables.

Utilizar AJAX puede ser una buena solución para los problemas de rastreo e indexación que se pueden generar en los ecommerce con filtros facetados que generan miles de URLs, ya que normalmente son llamadas a APIs internas que devuelven ficheros JSON o XML que finalmente no se suelen indexar.

¡Pero ojo!, También se puede dar el caso contrario: hay que tener en cuenta que con AJAX también se pueden generar problemas de indexación y rastreo si no se gestiona correctamente el comportamiento de las URLs AJAX a las que se hacen peticiones. De hecho, aquí os dejo un caso real donde se empezaron a indexar las URLs AJAX.

Esto va a depender mucho de cómo configuremos las llamadas, y sobretodo, si se necesita una acción «compleja» por parte del usuario para ejecutarla; en cuyo caso es probable que Google tampoco la ejecute.

El hecho de que las URLs AJAX no sean visibles de cara al usuario no significa que no se generen, si no que están funcionando en segundo plano pero pueden ser accesibles* e indexables si no hay ninguna medida que se lo impida (robots.txt, noindex, etc). 

*Bien es cierto que hay que "ponérselo fácil" a Google, si una petición requiere de una acción compleja por parte del usuario, es probable que no la ejecute, o tarde más tiempo en hacerlo, pero, por lo general, si la llamada se ejecuta a través de un click o en el propio evento onload(), Google realizará dicha llamada. Las llamadas que se realizan a través de API Rest, como en ecommerces, y que devuelven ficheros JSON, no suelen dar problemas porque Google no tratará de indexarlos, por lo general.

Paso 1: Subida al servidor del documento al que haré la petición AJAX

Lo primero que voy a hacer va a ser crear un documento HTML el cual voy a subir al servidor.

La idea es recuperar el contenido del HTML a través de AJAX y pintarlo en esta página.

Paso 2: Creación de checkbox y función js para generar la llamada AJAX

Para hacer la llamada AJAX crearé un checkbox que tenga asignado un evento onclick(), el cual me llamará a la función js que me hace la petición.

<input type="checkbox" onclick="peticion_ajax()" name="" id=""> // la funcion peticion_ajax() es la que me abre el canal de comunicacion con mi servidor

La función que he creado para hacer la llamada AJAX es:


        function peticion_ajax(){
            var peticion = null;
            if(window.XMLHttpRequest){
            peticion = new XMLHttpRequest()}
                else if(window.ActiveXObject){
                    peticion = new ActiveXObject('Microsoft.XMLHTTP')
                }
            peticion.open('GET', 'https://seoalex.es/informacion-ajax.html', true);
            peticion.onreadystatechange = function(){
                if(peticion.readyState == 4){
                    respuesta = peticion.responseText;
                    document.getElementById('contenedor-ajax').innerHTML = respuesta;
                }
            }  
            peticion.send();     
        }

Solamente si Google ejecuta el onclick() del checkbox y hace la petición AJAX, podrá acceder al HTML creado en el paso 1.

Puesta en marcha

La idea es darle tiempo a Google a ver si es capaz de renderizar el contenido y ejecutar la llamada AJAX y ver si rastrea e indexa finalmente el documento HTML, lo que viene a significar que con AJAX también se pueden generar nuevas URLs.

A continuación se encuentra el checkbox. Si clickas en él se cargará por AJAX el documento HTML que he creado y subido al servidor.

Click aquí para cargar contenido por AJAX:

Resultados:

Si estás aquí, quiero que sepas que aun no ha concluido el experimento y por tanto no hay resultados.

Sobre el autor

Alex Romero Lopez, Consultor SEO en España
alejandro.romerolopez95@gmail.com Web Otros artículos del autor

Especialista SEO con gran foco en el área técnica. Entusiasta de la programación, en especial Python y Javascript, y la aplicación de ésta en el ámbito SEO para automatizar procesos o profundizar en ciertos ámbitos como el web scraping o el uso de APIs. He trabajado en proyectos SEO de muy diferente tamaño y sector lo que me permite obtener una perspectiva 360º de cómo trabajarlo.

Deja un comentario