Comprender la representación de JavaScript: una guía para principiantes
Si trabaja en el espacio digital, ya sea como desarrollador, SEO o en marketing en general, es probable que se encuentre con JavaScript en algún momento. Aunque es posible que no desee hacerlo, ya que puede parecer desalentador y abrumador, probablemente tendrá que aprender los conceptos básicos en algún momento. Y ahí es donde entra en juego esta guía para principiantes.
Lo guiaremos a través de los conceptos básicos de JavaScript. En particular, explicaremos con un poco más de detalle qué es el procesamiento de JavaScript, cómo los motores de búsqueda procesan JavaScript y qué significa esto para usted y su sitio web (el de su empresa).
Después de leer esta breve guía introductoria, comprenderá mejor los fundamentos de JavaScript y el proceso de renderizado. ¿Listo para sumergirte? ¡Vamos!
¿Qué es JavaScript?
Comencemos definiendo qué es realmente JavaScript. JavaScript, o JS para abreviar, es un lenguaje de programación que forma parte de la base misma de la World Wide Web.
Es una de las tres tecnologías principales de la web, junto con el lenguaje de marcado de hipertexto (HTML) y las hojas de estilo en cascada (CSS). Cada tecnología es responsable de una parte específica de la creación de una página web:
- HTML agrega estructura y organización a una página al organizar el contenido en elementos como párrafos separados, encabezados o listas
- CSS agrega presentación y diseño, dando a la página su estilo y apariencia específicos.
- JavaScript agrega movimiento e interactividad a los elementos de una página web, como presentaciones de diapositivas o menús desplegables.
En otras palabras, JavaScript es la tecnología que da vida a una página. Sin él, las páginas serían estáticas en lugar de interactivas, estáticas en lugar de animadas.
El lenguaje JavaScript tiene todo tipo de aplicaciones en la web, desde la creación de páginas web interactivas hasta algo como usar una API de búsqueda de Google como SERPMaster con fines de raspado. ¡Puedes ver por qué JavaScript es una parte tan esencial de Internet!
Ahora, a pesar de su gran uso, JavaScript plantea algunos problemas. En particular, los motores de búsqueda no son tan buenos (todavía) para comprender, y por lo tanto indexar, páginas que contienen muchos elementos de JavaScript. Y eso tiene que ver con el proceso de renderizado.
¿Qué es renderizar?
La representación en el contexto del desarrollo web es el proceso de obtener datos de una página y procesar estos datos para producir la salida/resultado requerido.
Es cómo los lenguajes de programación se convierten en un código estructurado comprensible que, a su vez, se convierte en el sitio que ves frente a ti cuando abres una página web. Este proceso de renderizado es un paso esencial para mostrar correctamente una página web al usuario. Vea este paso como la interpretación de los datos sin procesar.
Ahora, un navegador o robot representa fácilmente HTML básico (es decir, lo interpreta) ya que contiene todo el contenido de la página. Cuando la página contiene JavaScript, por otro lado, es un poco más complicado.
Esto se debe a que para comprender el significado del código JavaScript, el navegador primero debe ejecutar el script específico al que se hace referencia en el código para revelar el contenido completo de la página.
Esto hace que la representación de JavaScript sea más difícil que la interpretación de HTML simple.
¿Cómo los motores de búsqueda renderizan JavaScript?
Ahora, un problema particular con la representación de JavaScript ocurre cuando los robots de los motores de búsqueda (rastreadores) necesitan representar una página web con JavaScript.
Algunos motores de búsqueda no son capaces de generar JavaScript en absoluto, mientras que otros (incluidos los gigantes de la industria Google y Bing) luchan por hacerlo.
Entonces, si su sitio web tiene muchos elementos de JavaScript, existe la posibilidad de que los motores de búsqueda (o bien, sus robots) no puedan entender qué hay en su página y piensen erróneamente que no hay contenido para ver. Dado que el bot cree que no hay nada que ver, no incluirá su página en su índice.
En otras palabras, no aparecerás en las páginas de resultados del motor de búsqueda (SERP). Y sin aparecer en las SERP, tienes pocas posibilidades de que los clientes te encuentren. De esta manera, estarás fuera del negocio antes de que te des cuenta, ¡sin importar qué tan bien se vea tu sitio web con todos esos hermosos elementos de JavaScript!
Entonces, ¿por qué la representación de JavaScript es tan difícil para los motores de búsqueda?
Echemos un vistazo a Google como ejemplo. El rastreador web del motor de búsqueda, Googlebot, procesos JavaScript en tres etapas:
- gateando
- Representación
- Indexación
El bot primero rastrea una página web enviando una solicitud al servidor, que se devuelve con la respuesta HTML. Antes de que Googlebot pueda comprender completamente la respuesta HTML que contiene JavaScript, debe procesarla. Una vez renderizado, el archivo HTML interpretado está listo para ser indexado en el motor de búsqueda.
El proceso de indexación de Google funciona en dos oleadas: rastreo e indexación, y representación e indexación.
Ahora, el rastreo y la indexación son procesos relativamente rápidos que se pueden realizar simultáneamente, pero la renderización requiere un poco más de tiempo y potencia de procesamiento. Entonces, si Googlebot rastrea una página y encuentra JavaScript, coloca la página en la cola de procesamiento donde permanecerá hasta que haya suficientes recursos disponibles para procesar la página.
Sin embargo, los datos no procesados ya se habrán agregado al índice durante la primera ola de indexación. Y una vez que su página web se atasque entre estas dos oleadas, el motor de búsqueda no indexará el contenido recién agregado.
Afortunadamente, hay formas de escribir correctamente sus páginas, incluido JavaScript, para que Google las procese más fácilmente. Puede encontrar todas las prácticas recomendadas más recientes en Centro de búsqueda de Google. ¡De esta manera, su rendimiento de SEO no se verá afectado como resultado de su hermoso sitio web!