Google: La etiqueta canónica se puede configurar mediante JavaScript: qué significa esto para el SEO y el comercio electrónico

Recordatorio rápido: ¿qué es canónico y por qué existe?

La canonicalización es el proceso mediante el cual Google selecciona la URL más representativa de un contenido cuando existen varias versiones similares o idénticas de una página. Una URL canónica es esta versión "representativa" que Google prefiere mostrar en los resultados de búsqueda. 

En el comercio electrónico, las URL duplicadas son habituales, ya que las tiendas generan variantes y combinaciones:

• filtrado y ordenación (parámetros URL),
• paginación,
• variantes del producto (color/tamaño),
• parámetros de campaña (UTM),
• versiones de idiomas,
• diferentes rutas para acceder al mismo contenido (categoría → producto frente a motor de búsqueda → producto).

Cuando se establece incorrectamente el canon, las consecuencias pueden ser dolorosas:

• Google está indexando direcciones incorrectas (un desastre en el índice)
• Las señales (enlaces, autoridad, datos de comportamiento) se distribuyen a través de múltiples URL,
• estás desperdiciando tu presupuesto de rastreo en duplicados,
• La visibilidad de las categorías y productos clave disminuye.

 ¿Qué dijo exactamente Google sobre la configuración del canonical en JS?

El mensaje es simple:

• Lo mejor es establecer canonical en HTML (en "
• Si no puedes, puedes establecer la etiqueta canónica mediante JavaScript, pero hazlo de forma que la etiqueta canónica sea coherente e inequívoca. 
• La canonicalización se produce antes y después del renderizado, por lo que el cruce entre la canonicalización "en la fuente" y "después del renderizado" es buscarse problemas. 

Google también enfatiza una regla muy práctica: si el canonical ya está en HTML, JS no debería cambiarlo a una dirección diferente. Y si es imposible insertar el canonical en HTML, es mejor no incluirlo allí en absoluto y agregarlo solo a través de JS (correctamente, en "). 

¿Por qué es arriesgado el enfoque "post-render canónico"?

Porque Google no siempre ve tu sitio web de la misma manera que un usuario lo ve en un navegador. En pocas palabras, hay dos "momentos":

• HTML antes de la renderización (lo que el servidor devuelve inmediatamente),
• HTML después de la renderización (lo que se crea después de que se ejecuta JavaScript).

Si la opción canónica aparece solo después de renderizar, entonces:

• aumentas tu dependencia de que Google renderice JS correctamente,
• creas espacio para cruces (canónico diferente en la fuente, diferente después del renderizado),
• es más fácil cometer errores en los frameworks (por ejemplo, duplicados "<link rel=”canonical”> ” o insertándolo en el lugar equivocado).

Google recuerda explícitamente que se acepta el formato canónico cuando está en "y con JS hay que "inyectarlo" correctamente. 

¿Cuándo tiene sentido usar `canonical` en JavaScript en la práctica?

Existen situaciones en las que esto puede ser una solución de compromiso razonable:

• Aplicación SPA renderizada en el lado del cliente, donde la generación de " en el servidor es difícil,
• Plataforma/CMS heredada donde no tienes control total sobre la plantilla .,
• vistas dinámicas, donde la vista canónica depende del estado de la aplicación (aunque aquí se necesita especial cuidado).

En las tiendas online (especialmente en las que utilizan frameworks headless), la URL canónica a veces la establecen bibliotecas como Head Manager (por ejemplo, React Helmet, Next.js Head). Esto funciona, pero solo si una únicaURL canónica consistente después del renderizado y no hay señales conflictivas.

La regla más importante: consistencia canónica "antes" y "después" de la renderización

Si recuerdas una sola cosa de este artículo, que sea esta:

No crees una situación en la que la propiedad canónica en HTML apunte a A y la propiedad canónica después de la renderización apunte a B.

La propia Google señala que la canonización se produce en diferentes etapas, por lo que las "señales contradictorias" reducen la claridad y aumentan el riesgo de que el algoritmo elija una versión diferente. 

En el comercio electrónico, este tipo de cruce suele producirse a través de:

• filtros y ordenación que generan diferentes URL,
• enlace automático de parámetros en JS,
• errores de enrutamiento (por ejemplo, barra diagonal/sin barra diagonal),
• diferencias en las direcciones canónicas entre las versiones para dispositivos móviles y de escritorio.

Paso a paso: cómo implementar un settable canónico en JS sin mins

Paso 1: Decida qué será canónico (lógica de negocio)

Primero, establece las reglas. Ejemplos en una tienda:

• el producto tiene una URL canónica a la URL "limpia" sin parámetros de campaña,
• La categoría tiene una versión canónica a no ordenada,
• Filtrar páginas: ya sea como canónicas de la categoría base, o (si los filtros tienen sentido para el SEO) como canónicas de una combinación específica; pero entonces debe haber una estrategia de indexación.

Paso 2: asegúrese de que haya un canonical después del renderizado

Ni dos, ni tres. Uno. En "Google te recuerda que debes insertar la etiqueta canónica correctamente y en la sección apropiada del documento. 

Paso 3: Si no puedes insertar la etiqueta canónica en HTML, no la insertes en absoluto

Este es un matiz importante de la aclaración de Google: es mejor no tener una URL canónica en el código fuente que tener una diferente a la que se establece posteriormente en JavaScript. 

Paso 4: Realizar la prueba en Google Search Console

Google recomienda probar la representación y la etiqueta canónica con herramientas como Search Console para asegurarse de que Google entienda lo que intentas lograr. La inspección de URL es útil para la canonicalización, ya que muestra, entre otras cosas, la etiqueta canónica que has especificado y la que ha elegido Google. 

Paso 5: Monitorear los cruces de "Google eligió un canon diferente"

Si Google suele elegir una URL canónica diferente a la que usted ha configurado, es una señal de que:

• El contenido no es lo suficientemente similar (el algoritmo no lo considera un duplicado)
• Las señales son contradictorias (enlaces internos, redirecciones, mapas del sitio),
• El símbolo canonical indica una URL de menor calidad (por ejemplo, con errores, sin contenido o con parámetros diferentes).

Google explica que, incluso si se especifica la versión canónica, el algoritmo puede elegir una versión diferente por diversas razones, y conviene comprobar si la elección de Google tiene sentido desde una perspectiva funcional. 

Errores comunes en el comercio electrónico que rompen la sintaxis canónica (especialmente con JS)

Canónico duplicado

El framework inyecta el canónico, y la plataforma de la tienda agrega el segundo en la plantilla. Después de renderizar, tienes dos diferentes "<link rel=”canonical”> ”. Efecto: la señal se vuelve ilegible.

Conjunto canónico externo<head>

Google enfatiza repetidamente que lo canónico debe estar en". Si aterriza en ", a veces se ignora. 

Los puntos canónicos apuntan a una URL con parámetros

En la mayoría de los casos, la ruta canónica debería apuntar a la versión "limpia". Si apunta a una URL con UTM, ordenación o filtrado, se crea rápidamente un laberinto.

Canónico depende del estado de la aplicación

El usuario pulsó un filtro y JavaScript modificó la URL canónica. Como resultado, el robot podría ver versiones diferentes en distintas pasadas de renderizado. Esto es difícil de controlar y aumenta el riesgo de que se produzca un caos en la indexación.

¿Qué cambios supone esto en la práctica para las tiendas online?

Si tienes un negocio de comercio electrónico, el refinamiento de Google tiene dos efectos reales:

• Menos temor en proyectos headless/SPA : el uso de canonical en JS puede funcionar cuando se implementa de forma consistente. 
• Mayor responsabilidad en la implementación , ya que la "mejor práctica" sigue siendo la norma en HTML, y JS es una alternativa de respaldo. 

En tiendas con múltiples combinaciones de URL (filtros, parámetros, variantes), la canonicalización es una de las herramientas principales para organizar el índice. Una canonicalización bien configurada favorece la visibilidad de categorías y productos, mientras que una incorrecta puede obstaculizar el crecimiento.

Lista de verificación: Qué revisar hoy en tu tienda 

• Abra la ficha del producto y compruebe en el código fuente de la página si canonical está en ".
• Comprueba si sigue habiendo una única imagen canónica después del renderizado (por ejemplo, en las herramientas de desarrollo).
• Acceda a la URL con parámetros (UTM / ordenación) y compruebe si los enlaces canónicos apuntan a la versión base.
• En Search Console, usa la inspección de URL y compara: la URL canónica declarada con la URL canónica elegida por Google. 
• Si la propiedad canónica se establece en JS, compruebe que no haya ninguna superposición con HTML (o si HTML no tiene ninguna propiedad canónica, en caso de que JS deba establecerla). 

¿Dónde se encuentra swiatcyfrowy.pl en este lugar?

Si quieres asegurarte de que el contenido canónico, la representación de JavaScript y la indexación estén configurados correctamente, la forma más rápida de hacerlo suele ser mediante una auditoría técnica de SEO (con elementos de comercio electrónico).

En el mundo digital, este tema puede tratarse como parte de un diagnóstico más amplio: optimizar la indexación, eliminar la duplicación, mejorar la visibilidad de las categorías y los productos, y ajustar el embudo SEO → ficha de producto → kupi.swia