Condivisione della tecnologia

Guida introduttiva alle prestazioni Web-1.2 Analisi delle prestazioni Web e indicazioni per l'ottimizzazione della vendita al dettaglio online

2024-07-12

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

Mantenere i clienti felici è il segreto del successo nella vendita al dettaglio. È stato dimostrato che offrire un'esperienza online rapida e coerente migliora in modo significativo tutti i parametri importanti per i rivenditori: dai tassi di conversione e dalle entrate alla fidelizzazione e alla notorietà del marchio.

Il trasferimento dell'immagine del collegamento esterno non è riuscito. Il sito di origine potrebbe avere un meccanismo anti-leeching. Si consiglia di salvare l'immagine e caricarla direttamente.

Schema di questo articolo:

  • La velocità della pagina influisce sui dati aziendali di vendita al dettaglio online

  • Come confrontare la velocità del tuo sito web con quella dei tuoi concorrenti

  • Inizia con l'ottimizzazione delle prestazioni: analizza cosa rallenta le tue pagine, da immagini e terze parti a fogli di stile e caratteri personalizzati, e cosa puoi fare al riguardo

La velocità della pagina influisce sui dati aziendali di vendita al dettaglio online

Per la maggior parte dei rivenditori online, la velocità delle pagine ha un impatto misurabile sui profitti. Anche piccoli miglioramenti possono migliorare significativamente parametri come i tassi di conversione.Per esempio

Il trasferimento dell'immagine del collegamento esterno non è riuscito. Il sito di origine potrebbe avere un meccanismo anti-leeching. Si consiglia di salvare l'immagine e caricarla direttamente.

Come analizzare la relazione tra le prestazioni del sito web e i dati di conversione aziendale

Ma per quanto riguarda il tuo sito web? Per comprendere l'impatto dei miglioramenti della velocità della pagina sul tuo sito, devi esaminare i dati RUM (Real User Monitoring).Diagramma di associazione è un ottimo modo per comunicare le prestazioni a tutti nella tua azienda. Puoi utilizzare RUM per creare queste visualizzazioni che consentono anche agli stakeholder meno tecnici di vedere facilmente come le prestazioni sono correlate al coinvolgimento degli utenti e alle metriche aziendali come la frequenza di rimbalzo e il tasso di conversione.

Il grafico di correlazione offre una visualizzazione a istogramma di tutto il traffico degli utenti, suddiviso in diversi gruppi in base a parametri di prestazione quali rendering iniziale, estrazione massima di contenuti e numero di interazioni fino all'estrazione successiva. Il grafico include una sovrapposizione che mostra i parametri di coinvolgimento degli utenti o i parametri aziendali (come la frequenza di rimbalzo o il tasso di conversione) associati a ciascun gruppo. In questo modo puoi vedere a colpo d'occhio la relazione tra prestazioni, coinvolgimento degli utenti e la tua attività.

Il trasferimento dell'immagine del collegamento esterno non è riuscito. Il sito di origine potrebbe avere un meccanismo anti-leeching. Si consiglia di salvare l'immagine e caricarla direttamente.

Come puoi vedere in questo grafico di correlazione, con un tempo massimo di estrazione del contenuto (LCP) di 1,1 secondi, il tasso di conversione raggiunge un picco di poco superiore al 6%. Man mano che l’LCP rallenta, il tasso di conversione diminuisce rapidamente e scende al di sotto del 3% in 2 secondi. Come si può vedere da quanto sopra, l'ottimizzazione delle prestazioni del sito Web per ridurre i tempi LCP può portare a conversioni complessivamente più elevate e a maggiori entrate.

Come si colloca il tuo sito web rispetto ai tuoi concorrenti?

Con SpeedCurve Sintetico Come il monitoraggio completo delle prestazioni, puoi eseguire un test della velocità della pagina su qualsiasi altro sito web proprio come faresti sul tuo. Ciò significa che ottieni tutti gli stessi dati, ricchi e ottimi, screenshot e diapositive per il confronto.

TuoBenchmarking competitivo La dashboard ti consente anche di approfondire e concentrarti su cose come la creazione di pagine. Quella pagina viene visualizzata due volte più velocemente della tua... cosa hanno fatto di diverso? Hanno più JavaScript? meno? Hai fatto 400 richieste e loro ne hanno fatte solo 80? Ecco il posto giusto per scoprirlo.

Il trasferimento dell'immagine del collegamento esterno non è riuscito. Il sito di origine potrebbe avere un meccanismo anti-leeching. Si consiglia di salvare l'immagine e caricarla direttamente.

Benchmark della velocità della pagina è una dashboard rivolta al pubblico che mostra un'istantanea delle prestazioni attuali dei principali rivenditori negli Stati Uniti, nell'UE, nel Regno Unito e in Giappone.

Iniziare con l'ottimizzazione delle prestazioni

Per offrire un'esperienza online eccezionale e veloce, inizia ponendoti due domande:

  • Cosa fa sì che la mia pagina appaia lenta agli utenti?

  • Cosa posso fare?

La buona notizia è che la maggior parte dei problemi che rallentano la pagina del tuo acquirente si verificano sulla tua pagina, il che significa che puoi controllarli. Ecco una panoramica dei problemi di prestazioni più comuni sui siti Web di vendita al dettaglio e come monitorarli e risolverli.

Cosa rallenta la tua pagina web? La stragrande maggioranza dei problemi di prestazioni è causata da quattro motivi:

  • Terze parti come tracker e analizzatori

  • foglio di stile

  • Carattere personalizzato

  • Dimensioni della pagina, in particolare dimensioni dell'immagine

sceneggiatura di terze parti

Oggi, una tipica pagina web di vendita al dettaglio può contenere fino a 75 script di terze parti, come tracker e beacon di analisi.

Il trasferimento dell'immagine del collegamento esterno non è riuscito. Il sito di origine potrebbe avere un meccanismo anti-leeching. Si consiglia di salvare l'immagine e caricarla direttamente.

Le terze parti aggiungono molto valore aumentando le conversioni (tramite beacon di posizione) e aiutandoti a comprendere i tuoi utenti come mai prima d'ora (tramite tag di analisi), quindi non scompariranno presto. Ma possono influenzare in modo significativo il modo in cui viene visualizzata la tua pagina (o anche se viene visualizzata affatto!).

Cosa puoi fare: monitorare le prestazioni di terze parti

Inizia adottando un approccio proattivo per comprendere eventuali danni alle prestazioni che terze parti potrebbero causare.

Non puoi aggiustare ciò che non viene misurato.Questo è ciò che creiamo in SpeedCurveDashboard dedicate di terze partiragioni in modo da poter vedere a colpo d'occhio come si stanno comportando le terze parti, tenere traccia dei singoli script eStabilisci un budget per la performance.

Dopo aver compreso le prestazioni degli script di terze parti, puoi utilizzare i dati storici per sviluppare uno SLA con il fornitore.

argomento di studio: M&S rivoluziona le prestazioni concentrandosi sui contenuti di terze parti

Dimensioni dell'immagine e della pagina

Sebbene le dimensioni della pagina non siano sempre correlate a un'esperienza utente più lenta, spesso lo fa. Le immagini di grandi dimensioni non ottimizzate sono spesso il colpevole.

Il trasferimento dell'immagine del collegamento esterno non è riuscito. Il sito di origine potrebbe avere un meccanismo anti-leeching. Si consiglia di salvare l'immagine e caricarla direttamente.

Oltre a ottimizzare le tue immagini (per assicurarti di non fornire 1 MB di risorse ai tuoi utenti!), dovresti anche assicurarti che le immagini più importanti (come l'immagine del prodotto principale) vengano renderizzate il prima possibile.

Cosa puoi fare: crea un budget prestazionale per le metriche relative alle immagini

I budget e gli avvisi relativi alle prestazioni rappresentano un ottimo modo per gestire il degrado delle prestazioni . Il budget delle prestazioni inizia con il tuo team (tutti: esperti di marketing, designer e sviluppatori) che concorda i principi relativi all'esperienza utente e alla velocità del sito. Innanzitutto, devi decidere quali parametri vuoi monitorare, quindi impostare le soglie in base alle prestazioni passate.

Per le immagini, ecco alcuni parametri da considerare:

  • Visualizzazione massima del contenuto: questa è la dimensione dell'elemento visivo più grande (immagine o video) nel viewport. LCP proviene da GoogleMetriche della rete principalePer prima cosa, si tratta di un insieme di metriche per l'algoritmo di classificazione delle ricerche di Google, quindi è una buona idea monitorarlo.

  • Dimensione immagine: la dimensione totale di tutte le immagini sulla pagina. Questo è un ottimo modo per vedere a colpo d'occhio se alla tua pagina sono state aggiunte immagini grandi e non ottimizzate.

  • Richieste di immagini: il numero totale di immagini sulla pagina.

argomento di studio: Come Zillow è diventato più grande, più veloce e più coinvolgente con un budget ridotto

foglio di stile

I fogli di stile sono un vantaggio per il web moderno. Risolvono un'ampia gamma di problemi di progettazione, dalla compatibilità del browser alla manutenzione e agli aggiornamenti della progettazione. Senza i fogli di stile non avremmo grandi cose come il responsive design.

https://blog-img.speedcurve.com/img/488/f8cb762-blocking-resources.png?auto=format,compress&fit=max&w=2000

Tuttavia, i fogli di stile eseguiti in modo inadeguato possono causare una serie di problemi di prestazioni. Questi problemi includono CSS che impiega troppo tempo per il download e l'analisi e fogli di stile posizionati in modo errato che impediscono il rendering del resto della pagina.

Cosa puoi fare: scopri quali fogli di stile potrebbero impedire il rendering della tua pagina

Ancora una volta, non puoi aggiustare ciò che non misuri. Il tuo strumento di monitoraggio completo può dirti:

  • Quanti fogli di stile sono presenti nella mia pagina e quanti di essi impediscono il rendering della pagina?

  • Questo numero è aumentato o diminuito?

  • Quanto sono grandi le richieste CSS?

  • Come si comporterà il foglio di stile per ciascuna delle mie terze parti?

Carattere personalizzato

I caratteri personalizzati offrono ai progettisti un controllo senza precedenti sui caratteri utilizzati nei loro progetti. Questo desiderio di controllo è il motivo per cui i caratteri personalizzati sono diventati sempre più popolari. Ma dietro questa popolarità c’è un prezzo da pagare in termini di prestazioni.

Il trasferimento dell'immagine del collegamento esterno non è riuscito. Il sito di origine potrebbe avere un meccanismo anti-leeching. Si consiglia di salvare l'immagine e caricarla direttamente.

Alcuni caratteri richiedono molto codice CSS, mentre altri richiedono molto JavaScript o hosting esterno, tutti fattori che possono rallentare notevolmente il rendering della pagina.

Cosa puoi fare: monitora la dimensione del carattere e la velocità di rendering

Oltre a tenere traccia della dimensione del carattere e del numero di richieste, puoi anche utilizzare SpeedCurve per misurare quando il primo elemento H1 ha terminato il rendering. (A SpeedCurve, chiamiamo questo indicatore Hero H1. Sono i treTempo di rendering dell'eroe uno. ) Se il tuo sito web utilizza caratteri personalizzati, molto probabilmente tali caratteri verranno applicati alla copia H1, rendendo questa metrica un modo efficace per misurare la velocità con cui vengono visualizzati i caratteri personalizzati.

Come tutti gli altri parametri che monitoriamo per te, puoi farloCrea budget prestazionali e ricevi avvisi quando superano le soglie.

argomento di studio: NerdWallet utilizza le metriche di rendering H1 per aumentare la velocità di caricamento dei caratteri del 30%