Orientación de la página
Índice
Corto y dulce
Con la ayuda de la segmentación por páginas, puede determinar en qué páginas de su sitio web debe mostrarse un experimento. En la configuración de su experimento, encontrará varias opciones en "Page targeting" para controlar sus experimentos basándose en reglas. La correcta configuración de la orientación a páginas es también un requisito previo para iniciar un experimento.
Opciones de segmentación de páginas
Puede utilizar reglas para definir las páginas o tipos de páginas en las que sus visitantes se convierten en participantes del experimento. Dispone de varias opciones para identificar las páginas.
Puede utilizar reglas para definir las páginas o tipos de páginas en las que sus visitantes se convierten en participantes del experimento. Dispone de varias opciones para identificar las páginas.
El uso del selector CSS es útil si desea seleccionar varias páginas, pero éstas no pueden identificarse claramente mediante reglas URL.
Puede utilizar JavaScript para definir reglas de selección más complejas. Por ejemplo, también tiene la opción de comprobar entradas especiales de DataLayer.
Coincidencia de URL
Con la coincidencia de URL, puede utilizar reglas de URL para definir las páginas en las que se mostrará su experimento. Puede definir varias reglas de URL que deben aplicarse o no.
Vinculación de varias reglas URL
Puede aplicar varias reglas de URL al mismo tiempo y vincularlas entre sí. Para ello, puede introducir diferentes URL utilizando el símbolo más. Utilice URL "coincide" o "no coincide" para establecer si el experimento debe mostrarse o no en las URL introducidas.
Si desea aplicar reglas de orientación más complejas, por ejemplo El expeirmento debe mostrarse en todas las páginas de https://www.demo.de, excepto en https://www.demo.de/impressum, también puede vincular varias coincidencias de URL.
Tipo de correspondencia
A la derecha del campo de entrada, puede especificar el tipo de coincidencia de su condición de selección. En función de la selección, la URL del campo de entrada situado junto a ella se comprueba en función de varias condiciones. Puede elegir entre las siguientes condiciones:
- Partido simple
- Coincidencia exacta
- Contiene
- Regex
A continuación se explican con más detalle las condiciones de selección con ejemplos de aplicación.
Partido simple
En el Partido simple todas las URL son seleccionadas, incluidos los parámetros de URL asociados.
En el siguiente ejemplo, puede ver las versiones de una URL que se utilizan para la orientación de páginas Partido simple para la URL www.demo.de aplicar:
| URL | Se aplica la focalización |
|---|---|
|
www.demo.de |
aplica |
|
www.demo.de#about |
aplica |
|
www.demo.de?color=red |
aplica |
|
www.demo.de/category |
No aplicable |
|
www.demo.com |
No aplicable |
|
sub.demo.de |
No aplicable |
Si desea dirigirse a varias páginas, tipos de páginas o subdominios al mismo tiempo, puede utilizar la opción Regex. Sigue leyendo.
Coincidencia exacta
Utilice la condición Coincidencia exactasi el objetivo de la página explícitamente sólo para una URL específica - sin parámetros URL.
En el siguiente ejemplo, puede ver las versiones de una URL que se utilizan para la orientación de páginas Coincidencia exacta para la URL www.demo.de aplicar:
| URL | Se aplica la focalización |
|---|---|
|
www.demo.de |
aplica |
|
www.demo.de/ |
No aplicable |
|
www.demo.de#about |
No aplicable |
|
www.demo.de?color=red |
No aplicable |
|
www.demo.de/category |
No aplicable |
|
www.demo.com |
No aplicable |
|
sub.demo.de |
No aplicable |
Contiene
La condición de orientación de la página Contiene que utiliza cuando varias páginas de un determinado grupo que desea seleccionar. Por ejemplo, si desea realizar una prueba sólo en las páginas de productos, puede utilizar "Contiene" con "/productos/" para incluir sólo estas páginas. La expresión completa especificada debe aparecer al menos una vez en la URL.
En el siguiente ejemplo puede ver diferentes versiones de URL en las que se aplica la orientación "/productos/".
| URL | Se aplica la focalización |
|---|---|
|
www.demo.de |
No aplicable |
|
www.demo.de/produkte |
No aplicable |
|
www.demo.de/produkte/t-shirts |
aplica |
|
www.demo.de/produkte/hosen |
aplica |
|
www.demo.de/blog/produkte-reviews |
No aplicable |
|
www.demo.de/blog/produkte/tests |
aplica |
Expresiones regulares (Regex)
Las expresiones regulares le permiten configurar sus pruebas A/B para determinadas páginas individuales o grupos de páginas para apuntar específicamente. Esto puede ser más preciso que, por ejemplo, con las condiciones de focalización que acabamos de presentar.
Hemos creado esta guía de segmentación de páginas con regex para facilitarle los primeros pasos. En muchos casos, basta con copiar uno de nuestros ejemplos y sustituir su propia URL.
Para validar sus expresiones regulares, puede utilizar editores de expresiones regulares como regexr.com.
Ejemplo de creación de una expresión regular
En Plomo-o-Plata, todas las páginas de detalles de productos de la categoría Venta outlet los precios de venta aparecen en rojo. Las páginas de detalles de productos de otras categorías no deben sufrir cambios.
Al utilizar expresiones regulares en la orientación por URL, tiene la opción de asignar explícitamente esta condición de orientación.
Aquí puede ver un ejemplo de URL que se encuentra en la categoría de venta outlet.
La estructura de las URL es la misma para todas las páginas de detalles de productos que se pueden encontrar en esta categoría:
https://plomo-o-plata.de/collections/plomo-o-plata-outlet-sale/products/…
En la tabla Aplicaciones útiles encontrará expresiones regulares predefinidas que puede transferir a la estructura de URL de su sitio web utilizando este ejemplo. En nuestro caso, se aplica el caso de uso 3.
-> Orientación de todas las páginas que siguen la ruta www.demo.de/category/.
-> ^.*www\.demo\.de\/category\/.+
En primer lugar, vamos a https://regexr.com/ y transferimos el caso de uso similar.
Ahora podemos orientarnos en este caso de uso y trasladarlo a nuestro ejemplo de Plomo-o-Plata.
Aplicaciones útiles
| Caso práctico | Página de ejemplo | Expresión regular |
|---|---|---|
|
Dirigirse exactamente a una página |
www.demo.de/product-list |
^.*www\.demo.de/product-list$ |
|
Dirigido exactamente a una página incl. enlaces de anclaje, parámetros y "/" opcional |
www.demo.de/?utm_source=google_cpc |
^.*www\.demo\.de(#.*|\/#.*|$|\/$|\/\?.*) |
|
Orientación de todas las páginas colgadas en la ruta www.demo.de/category/ |
www.demo.de/category/product |
^.*www\.demo\.de\/category\/.+ |
|
Orientación global de una página sin "www". |
demo.de/ |
^.*demo.de\/.* |
|
Segmentación global en todo el dominio www.demo.de/ |
www.demo.de/ |
^.*www\.demo.de\/.* |
|
Segmentación en un subdominio blog.demo.de/ |
blog.demo.de/category/article
|
^.*blog.demo.de\/.* |
|
Focalización en todo un dominio, incluidos los subdominios demo.de/ |
blog.demo.de/category/article
www.demo.de/category/product |
^.*demo.de\/.* |
|
Centrarse en dos categorías específicas de productos |
www.demo.de/shirts/product
www.demo.de/pants/product |
^.*www\.demo.de/(camisas|pantalones)\/.* |
¿Necesitas ayuda para configurar tu regex? No se preocupe.
Simplemente escríbanos un mensaje con el grupo de páginas al que desea dirigirse. Le enviaremos la regex adecuada lo antes posible.
Orientación mediante selector CSS
Diríjase únicamente a páginas o tipos de páginas que contengan un elemento específico con un selector CSS único. Por ejemplo, en un experimento quieres dirigirte a todas las páginas de detalles de productos de tu tienda online, pero no hay ninguna referencia como "/productos/" en la URL que te permita realizar esta asignación. En tal caso, podría buscar un elemento que sólo esté disponible en las páginas de detalles del producto, como el botón "Añadir a la cesta". A continuación, puede utilizar el selector CSS correspondiente para este botón en la orientación de la página.
La forma más sencilla de determinar un selector CSS único es abrir una de las páginas relevantes en el editor visual de Varify. A continuación, haga clic en el elemento que sólo aparece en este tipo específico de página. A continuación, puede copiar el selector CSS mostrado y utilizarlo para la orientación de páginas en
Orientación mediante JavaScript
Puede utilizar JavaScript para una orientación más compleja de las páginas. De este modo, también puede buscar cualquier etiqueta o atributo en el DOM de su sitio web. JavaScript también le permite comprobar los datos de las variables de la capa de datos.
Ejemplo de aplicación - Introducción de la capa de datos
Para dirigirse sólo a los usuarios que tienen un parámetro específico o un valor específico en la capa de datos, puede desplazarse por la capa de datos. En el siguiente ejemplo, sólo se selecciona a los usuarios que han visto previamente un producto específico con ID 1111 o ID 2222.
Ejemplo de código: orientación de la capa de datos
return dataLayer?.some(item => item?.ecommerce?.checkout?.products?.[0]?.id==='1111' || item?.ecommerce?.checkout?.products?.[0]?.id==='2222');
Configuración avanzada
Experimento de limpieza por cambio de URL
Los sitios web que recargan dinámicamente el contenido -como las aplicaciones de página única (SPA) o las tiendas online que ofrecen varias variantes de productos en la página de detalles del producto- se comportan de forma diferente a las páginas estáticas tradicionales. Con las páginas estáticas, todo el contenido se recarga completamente cada vez que se cambia la URL. En cambio, en las SPA y sitios web dinámicos similares, sólo se actualiza el contenido que cambia.
Comportamiento con los cambios de URL
Por defecto, Varify realiza un reinicio de la reproducción de variantes para cada cambio de URL, es decir, se reinician todas las variaciones de la página, se comprueba de nuevo la URL y se vuelven a aplicar todas las variaciones aplicables para la nueva URL.
Desactivación de la función estándar
La desactivación de la función "Experimento de limpieza al cambiar la URL" puede ser especialmente útil en las páginas de productos de las tiendas en línea en las que se pueden seleccionar distintas variantes de productos, como colores. Con dicha selección, la URL puede cambiar para reflejar el color seleccionado. Sin embargo, si hay una variación relacionada con un contenido que no cambia (por ejemplo, el botón "Añadir a la cesta"), no sería deseable eliminar y volver a aplicar esta variación. Esto podría provocar efectos no deseados, como el parpadeo de la pantalla.