Data di pubblicazione: 19 marzo 2025
T-Mobile è una delle principali aziende di telecomunicazioni degli Stati Uniti, che offre una vasta copertura di rete e una connettività 5G rapida.
Analizzando i dati web vital degli utenti reali, T-Mobile ha capito che i miglioramenti di Core Web Vitals possono influire in modo significativo sia sull'esperienza utente sia sulle metriche aziendali.
Nell'ambito di un continuo impegno per perfezionare la propria presenza digitale, T-Mobile ha migliorato i Core Web Vitals del proprio sito web, in particolare il Largest Contentful Paint (LCP), per migliorare l'esperienza utente e, di conseguenza, le metriche aziendali chiave.
Aumentare la consapevolezza del rendimento web con i dati
Consapevoli dell'esigenza crescente di garantire esperienze utente straordinarie sul web, i team di SEO e prodotto di T-Mobile hanno intrapreso un'iniziativa congiunta volta a migliorare il rendimento del loro sito web. Il primo passo è stato mettere i Core Web Vitals al centro delle discussioni con gli stakeholder, assicurandoci che fossero riconosciuti come una priorità assoluta, una difficoltà comunemente affrontata dai team di sviluppo di molte aziende.
Per risolvere il problema, T-Mobile ha adottato una strategia basata sui dati. Consapevoli che i dati di laboratorio di Lighthouse e i dati dei report sull'esperienza utente di Chrome (CrUX) potevano offrire solo una visione parziale della narrativa sul rendimento, hanno incorporato la libreria JavaScript web-vitals nelle proprietà web di T-Mobile per acquisire e analizzare direttamente i dati sul rendimento, noti come dati sul campo, degli utenti reali.
Integrando i dati di Core Web Vitals sul campo con la suite di analisi, T-Mobile ha ottenuto diversi punti dati efficaci, tra cui:
- Impatto sull'esperienza utente: i visitatori di T-Mobile.com sono più propensi ad abbandonare il sito quando il caricamento delle pagine richiede più tempo.
- Impatto sull'attività: i tassi di conversione di T-Mobile.com diminuiscono quando il caricamento delle pagine richiede più tempo.
I dati erano chiari in merito alla correlazione tra il rendimento del sito web di T-Mobile e le relative metriche aziendali.
Stimando l'impatto sulle entrate nei segmenti di 100 millisecondi di LCP, il team è riuscito ad attirare l'attenzione del management, avviando un gruppo di lavoro interfunzionale per migliorare il rendimento del sito web. Presentando dati chiari e misurando l'opportunità, i team di SEO e prodotto di T-Mobile hanno comunicato efficacemente l'importanza del miglioramento dei Core Web Vitals.
Miglioramento delle prestazioni web per un impatto massimo
Per risolvere in modo completo i problemi di prestazioni, il team di T-Mobile ha intrapreso una serie di miglioramenti tecnici tenendo presente la scalabilità. Questi sforzi si sono concentrati sull'ottimizzazione dei componenti critici e sull'utilizzo di tecnologie per garantire incrementi duraturi del rendimento sulle piattaforme digitali.
Impatto sull'esperienza dei clienti
Gli sforzi per migliorare le prestazioni del sito hanno comportato una diminuzione del 42% del Largest Contentful Paint (LCP) complessivo:
Questo miglioramento ha avuto diversi effetti positivi sull'esperienza utente, tra cui:
Impatto sul business
I tempi di caricamento delle pagine più rapidi hanno contribuito anche a un flusso di acquisto più efficiente, con un miglioramento del 60% del tasso di conversione delle visite dei potenziali clienti con intenzione di acquisto nello stesso periodo.
Upgrade chiave del rendimento che hanno fatto fare un salto di qualità a T-Mobile
Di seguito è riportato un elenco dettagliato delle iniziative chiave e dei relativi impatti:
Caching e refactoring delle API
Le API, tra cui le API Products e Promotions, sono state memorizzate nella cache e sottoposte a refactoring per migliorare i tempi di risposta e ridurre il carico del server. Il trasferimento a una rete CDN (Content Delivery Network) per l'ottimizzazione della memorizzazione nella cache ha contribuito in modo significativo a questi miglioramenti.
Memorizzazione nella cache degli asset statici
Gli asset statici, tra cui JavaScript, fogli di stile e librerie client, sono stati memorizzati nella cache per ridurre i tempi di caricamento. L'utilizzo della memorizzazione nella cache CDN e delle impostazioni della cache ottimizzate ha migliorato la velocità di caricamento e ridotto il carico del server. Questa ottimizzazione ha svolto un ruolo fondamentale nel migliorare il rendimento complessivo del sito.
Ottimizzazione del componente immagine
Il team ha ottimizzato i componenti delle immagini riducendone le dimensioni, utilizzando formati di immagini moderni come WebP e implementando immagini responsive per garantire la migliore qualità con le dimensioni dei file più ridotte.
Precaricamento e prelettura dei componenti
Le risorse critiche sono state precaricate e prelevate in modo da essere disponibili immediatamente quando necessario, il che ha ridotto i tempi di attesa per gli utenti e migliorato i tempi di caricamento delle pagine.
Preconnessioni ai domini critici e miglioramenti allo script anti-sfarfallio
Il team ha implementato i precollegamenti ai domini critici per stabilire connessioni anticipate, riducendo la latenza per il recupero delle risorse. Inoltre, è stato migliorato lo script anti-sfarfallio per ridurre al minimo il lampeggiamento dei contenuti e garantire un'esperienza utente più fluida.
Migrazione della piattaforma Adobe Experience Manager (AEM)
Il team ha eseguito la migrazione a una versione più recente della piattaforma frontend, che offriva prestazioni migliori e miglioramenti dell'infrastruttura.
Migrazione dei componenti angolari ai componenti di fabbrica AEM
È stata eseguita la migrazione dei componenti Angular ai componenti di fabbrica di Adobe Experience Manager (AEM) per semplificare l'architettura e migliorare le prestazioni e la manutenibilità.
Ottimizzazioni principali della pagina di destinazione
I miglioramenti includevano l'ottimizzazione dei caroselli di immagini, l'utilizzo di Adobe webSDK, l'estensione del tempo di cache per i contenuti multimediali dinamici, la compressione dei payload e l'aggiornamento dei design delle immagini per migliorare i tempi di caricamento e l'esperienza utente.
Riduzione degli errori nelle API
Il team ha ridotto gli errori per diverse pagine chiave di e-commerce, garantendo un caricamento dei dati più affidabile e migliorando le interazioni degli utenti.
Coltivare una cultura del rendimento web democratizzando i dati
Per mantenere il proprio impegno per l'eccellenza del rendimento web, T-Mobile ha implementato diverse misure chiave nell'intera organizzazione. Queste iniziative sono progettate per democratizzare l'accesso ai dati sul rendimento, formare e coinvolgere il nostro team, monitorare in modo proattivo Core Web Vitals e applicare standard di rendimento per tutte le release del codice. Le seguenti strategie illustrano in che modo queste aziende stanno coltivando una cultura del rendimento web rendendo accessibili i dati, promuovendo l'apprendimento continuo e stabilendo pratiche di governance solide.
Democratizzazione dei dati Core Web Vitals
T-Mobile ha utilizzato dashboard solide di Looker Studio per rendere accessibili a tutti i membri dell'organizzazione i dati sul rendimento. Inoltre, una wiki completa sul rendimento web aiuta i membri del team a interpretare e utilizzare in modo efficace i report Core Web Vitals.
Dashboard di Looker Studio di T-Mobile che mostra le metriche Core Web Vitals in tempo reale. Da sinistra a destra vengono visualizzati:
- Tachimetro: percentile 75 di tutti gli eventi LCP acquisiti nell'intervallo di date selezionato.
- Grafico a linee: tendenza giornaliera dei punteggi del 75° percentile nell'intervallo di date selezionato.
- Grafico a torta: distribuzione in percentuale delle valutazioni Buona, Richiedono miglioramenti e Scadente nell'intervallo di date selezionato.
- Grafico a linee in pila: tendenza giornaliera della distribuzione percentuale delle valutazioni Buono, Richiede miglioramenti e Scarso nell'intervallo selezionato.
Formazione e coinvolgimento continui
Il Product e SEO Manager organizza regolarmente roadshow sul rendimento web e sessioni di trasferimento delle conoscenze. Queste iniziative educano e coinvolgono il team più grande, promuovendo un impegno continuo per l'eccellenza del rendimento web.
Sistema di avviso per Core Web Vitals
È stato creato un sistema di avviso per monitorare Core Web Vitals per vari gruppi di pagine. Quando Core Web Vitals raggiunge una determinata soglia di riferimento, viene inviato automaticamente un avviso via email agli stakeholder pertinenti.
Requisiti di rendimento per le release del codice
T-Mobile ha stabilito anche requisiti di prestazioni per le release del codice. Le pagine devono soddisfare livelli di rendimento specifici in Lighthouse prima di poter essere lanciate, garantendo il rispetto di elevati standard di rendimento web.
Implementando queste misure, T-Mobile è in grado di garantire che le prestazioni web rimangano una priorità e continua a promuovere una cultura di miglioramento continuo.
Ringraziamenti
Grazie a chi ha lavorato al miglioramento del rendimento del sito web di T-Mobile e a questo caso di studio: Kevin Lau, Monique Misrahi, Bill Dinger, Laura Mathisen, Suresh Gundu, Duke Fong, Amir Mohammadi, Liang Yeh, Jennifer Panke, Julia Edgar, Ejaz Malik, Damon Jochum, Will Fraley, Gene McKenna, Vinayak Hegde e Warren McNeel.
Questo caso di studio è stato sviluppato in collaborazione tra T-Mobile e i suoi partner per le soluzioni per i clienti di Google, Ilya Motamedi, Dakota Deady e Christine Zanedis, i cui approfondimenti e il cui supporto hanno contribuito al successo di questa iniziativa.