Test A/B con Redirect e Split URL
In breve
Con la funzione di redirect, puoi reindirizzare gli utenti in arrivo da una o più pagine verso un'altra pagina. Se utilizzi questa funzione in un test A/B, puoi eseguire un «redirect test». Questo ti permette, ad esempio, di testare la tua pagina attuale rispetto a una nuova versione della pagina accessibile tramite un URL diverso.
In linea di principio, hai a disposizione due metodi per eseguire un redirect test.
Metodo 1: Creare un test di reindirizzamento nell'editor
Questo metodo è adatto solo se vuoi reindirizzare esattamente un sito web verso un altro sito web.
Crea una nuova variante e clicca sull'icona “Redirect URL”. Poi inserisci nel campo di input URL l'indirizzo verso cui gli utenti in arrivo devono essere reindirizzati. Durante il reindirizzamento verso il nuovo URL di destinazione, i parametri URL esistenti dell'URL originale richiamato vengono mantenuti, come i parametri UTM, e vengono aggiunti al nuovo URL di reindirizzamento.
Nota importante: Quando inserisci l'URL, assicurati di inserire l'URL completo e assoluto.
-> «https://www.demoshop.com/new-home» e non «demoshop.com/new-home»
Contattaci se hai domande: https://varify.io/contact/
Metodo 2: Definire il redirect tramite JavaScript
Puoi usare JavaScript per redirect più complessi. Tuttavia, è importante che tu aggiunga anche il parametro va-red, includendo l'ID esperimento e l'ID variazione corretti, all'URL, in modo che il tracking venga attivato anche sulla pagina di destinazione e tu misuri i risultati corretti. Ecco due casi d'uso per esperimenti più complessi, incluso un esempio di tracking:
Reindirizzamento di ogni URL a se stesso - con parametro URL aggiuntivo
Modifica le costanti nel seguente codice experimentId e variationId secondo i valori del tuo esperimento e della tua variazione. Modifica inoltre il valore della costante needsViewParam inserendo lì il parametro URL desiderato.
Esempio:
Pagina originale:
https://www.test.com/products/product1
https://www.test.com/products/product2
Variazione:
https://www.test.com/products/product1?view=2
https://www.test.com/products/product2?view=2
(function () {
const experimentId = 21952;
const variationId = 32490;
const needsViewParam = 'view'; // <-- definiere hier den gewünschten Parameter-Namen
function isInEditor() {
const p = new URLSearchParams(location.search);
return p.has('varify-variation-name') || p.has('varify-variation-id');
}
if (isInEditor()) return;
const params = new URLSearchParams(window.location.search);
const paramAsBase64 = btoa(`${experimentId}:${variationId}`).replace(/=/g, '');
const needsView = params.get(needsViewParam) !== '2';
const needsVa = params.get('va-red') !== paramAsBase64;
if (needsView || needsVa) {
params.set(needsViewParam, '2');
params.set('va-red', paramAsBase64);
const newUrl = `${window.location.origin}${window.location.pathname}?${params.toString()}${window.location.hash || ''}`;
window.location.href = newUrl;
}
})();
Importante: Per evitare che la variante finisca in un loop infinito, è comunque necessario adattare il targeting della pagina. Puoi scoprire come farlo qui: Evitare loop infiniti nei test di split URL
Inoltro di tutti gli URL allo stesso URL con un sotto-percorso aggiuntivo
Modifica le costanti nel seguente codice experimentId e variationId in base ai valori del tuo esperimento e della tua variazione. Modifica inoltre il valore della costante newPathSuffic inserendo lì la sottodirectory desiderata.
Esempio:
Pagina originale:
https://www.test.com/products/product1
https://www.test.com/products/product2
Variazione:
https://www.test.com/products/product1/new
https://www.test.com/products/product2/new
…
(function () {
const experimentId = 21952;
const variationId = 32490;
const newPathSuffix = '/new'; // <-- ändere diesen Wert, um das neue Pfad-Suffix festzulegen
function isInEditor() {
const p = new URLSearchParams(location.search);
return p.has('varify-variation-name') || p.has('varify-variation-id');
}
if (isInEditor()) return;
const params = new URLSearchParams(location.search);
const basePath = location.pathname.replace(/\/+$/, '');
const endsWithNew = basePath.endsWith(newPathSuffix);
const vaValue = btoa(`${experimentId}:${variationId}`).replace(/=/g, '');
const hasVa = params.get('va-red') === vaValue;
if (endsWithNew && hasVa) return;
params.set('va-red', vaValue);
const newPath = endsWithNew ? basePath : basePath + newPathSuffix;
const newUrl = `${location.origin}${newPath}?${params.toString()}${location.hash || ''}`;
location.href = newUrl;
})();
Inoltro di tutti gli URL allo stesso URL con un sottodominio diverso
Modifica le costanti nel seguente codice experimentId e variationId in base ai valori del tuo esperimento e della tua variazione.
Regola anche il valore della costante targetSubdomain inserendo il sottodominio desiderato.
Esempio:
Pagina originale:
https://www.test.com/products/product1
https://www.test.com/products/product2
Variazione:
https://subdomain.test.com/products/product1
https://subdomain.test.com/products/product2
…
(function () {
const experimentId = 21952;
const variationId = 32490;
const targetSubdomain = 'subdomain'; // <-- configure your subdomain here
function isInEditor() {
const p = new URLSearchParams(location.search);
return p.has('varify-variation-name') || p.has('varify-variation-id');
}
if (isInEditor()) return;
const params = new URLSearchParams(window.location.search);
const paramAsBase64 = btoa(experimentId + ':' + variationId).replace(/=/g, '');
const needsVa = params.get('va-red') !== paramAsBase64;
const hostNoWww = location.hostname.replace(/^www\./, '');
const parts = hostNoWww.split('.');
const registrable = parts.length >= 2 ? parts.slice(-2).join('.') : hostNoWww;
const targetHost = targetSubdomain + '.' + registrable;
const needsHost = location.hostname !== targetHost;
if (needsVa || needsHost) {
params.set('va-red', paramAsBase64);
params.delete('view');
const port = location.port ? ':' + location.port : '';
const newUrl =
location.protocol + '//' + (needsHost ? targetHost : location.hostname) + port +
location.pathname +
(params.toString() ? ('?' + params.toString()) : '') +
(location.hash || '');
if (needsHost) {
window.location.href = newUrl;
} else {
history.replaceState(null, '', newUrl);
}
}
})();
Configura il targeting della pagina
Dopo aver creato e salvato l'URL di redirect nel visual editor, puoi definire le impostazioni per il split test nella dashboard di Varify.io.
- In Page Targeting, inserisci l'URL su cui dovrebbe avvenire il tuo esperimento. Questo è l'URL dal quale vuoi effettuare il redirect verso l'URL di redirect. -> NON inserire l'URL di redirect!
- Imposta il tipo di corrispondenza su „Simple Match“
- Imposta la distribuzione del traffico desiderata per la tua variante
- Avvia l'esperimento di redirect
Esempio: lo screenshot mostra l'impostazione secondo cui il 50% degli utenti che arrivano su https://www.demoshop.com/ viene ora reindirizzato all'URL precedentemente inserito nella variante creata sotto Redirect URL.
Prima di avviare l'esperimento, verifica che il reindirizzamento funzioni correttamente e non crei loop infiniti.
La variante di reindirizzamento crea un loop infinito
In determinate circostanze, il targeting di pagina può creare un ciclo infinito per gli utenti reindirizzati. Tuttavia, questo non accadrà se la pagina appena creata ha un proprio URL.
Ad esempio, se il tuo URL di reindirizzamento contiene solo un parametro aggiuntivo rispetto all'URL originale:
Originale: https://www.demoshop.com
Reindirizzamento: https://www.demoshop.com?page=newlp
Puoi scoprire come risolvere facilmente il problema qui: Avoid endless loops in url split tests
Valutazione del test split URL
Valutazione in Varify.io
Con la Google Analytics 4 Connection di Varify.io, puoi visualizzare facilmente i tuoi risultati direttamente nella tua dashboard Varify.io. Puoi scoprire come fare qui: Alla valutazione dei risultati in Varify.io
Valutazione in GA4
Puoi analizzare i dati delle varianti del tuo A/B test in GA4 con la Explorative Data Analysis. Puoi trovare maggiori informazioni qui: Alla valutazione dei risultati in GA4