Combinare SEO e User Experience per il successo di un ecommerce

Fino a qualche anno fa il lavoro di posizionamento per i motori di ricerca si basava principalmente su due attività: la keyword research e la link building. Tutto questo è ancora valido, ma con sfumature differenti. Sono oltre 200, infatti, i segnali di ranking che il gigantesco algoritmo di Google prende in considerazione per classificare i risultati nelle SERP. Il tutto, condito da un occhio di riguardo a ciò che fa l’utente quando arriva sulla pagina: le variabili di coinvolgimento degli utenti come la frequenza di rimbalzo, il tempo sul sito e le pagine visitate sono diventate fattori critici di classificazione.

Un sito che garantisce una buona User Experience, viene particolarmente apprezzato dai motori di ricerca: attualmente potremmo tranquillamente affermare che Google consideri la UX un fattore di ranking indiretto. 

Tuttavia, il 28 Maggio 2020, Google ha dichiarato che l’esperienza dell’utente entrerà a far parte dei fattori diretti che concorrono al posizionamento di un sito: nel 2021 verrà rilasciato un importante aggiornamento, ribattezzato dalla comunità SEO come Page Experience Update. Oltre ai classici segnali già esistenti che definiscono l’esperienza di navigazione in pagina (navigazione sicura, presenza di protocollo HTTPS, versione mobile, presenza di annunci pubblicitari intrusivi), verranno prese in considerazione tre nuove metriche, i cosiddetti Core Web Vitals (Fattori Web Essenziali): 

• LCP (Largest Contentful Paint), misura la velocità di caricamento percepita da parte dell’utente, calcolando il tempo necessario al rendering dell’elemento più grande del viewport (solitamente un'immagine, un video, un blocco visibile all’interno della pagina, etc.);

• FID (First Input Delay) misura la reattività di una pagina web calcolando il tempo trascorso tra la prima interazione di un utente con il sito e il momento in cui il browser è in grado di rispondere (ci si riferisce ad interazioni quali clic sui collegamenti, tap su pulsanti, etc.);

• CLS (Cumulative Layout Shift) misura la stabilità di una pagina web, analizzando i cambiamenti di layout (unexpected shift) che si verificano durante l’intera durata della visita della pagina.

A questo punto è chiaro come combinare l’attività SEO con una buona progettazione della User Experience potrebbe consentire di raddoppiare le visite e le conversioni di un sito e-commerce. I due comparti, infatti, non solo concorrono al posizionamento, ma agiscono nell’intento di offrire a chi naviga sul web un’esperienza complessiva sempre migliore.

Search Experience Optimization FASE 1: l’analisi.

Ogni progettazione che si rispetti inizia con una fase di ricerca e di analisi.

Innanzitutto è importante capire quali sono le logiche di mercato e le consuetudini che guidano il settore a cui ci stiamo rivolgendo, in modo da individuare le opportunità da sfruttare e le minacce da evitare. Perciò è necessario fare un incontro con il cliente, e raccogliere tutte le informazioni essenziali, ad esempio: chi è? cosa fa? quali sono le caratteristiche del suo prodotto? dove opera? quali sono i mercati a cui si rivolge? quali sono i valori che definiscono il suo brand? come funziona il processo di acquisizione? come gestisce il processo di vendita? ci sono delle criticità nella gestione? chi si occupa della comunicazione? come gestisce le promozioni? possiede un servizio di customer care? quali sono i suoi competitor principali? esiste già un sito web dedicato? ha già fatto attività SEO? quali sono i suoi obiettivi a breve e a lungo termine? qual’è il budget a disposizione?

A questo punto è importante fare un’analisi del settore, per individuare le opportunità e le nicchie di mercato. La domanda da porsi è: il mio cliente appartiene ad un settore saturo, in crescita o in calo? Per trovare la risposta a questo quesito è necessario raccogliere molte informazioni, andando ad indagare: 

- le ricerche pubbliche di mercato (es. Casaleggio e associati)- gli argomenti trattati sui blog di settore- le dichiarazioni degli esperti del settore

- gli eventi e le fiere di settore

La User Research: identificare l’utente i suoi bisogni 

Successivamente si passa all’analisi dell’utente. La prima fase consiste nella user research, cioè un’attività finalizzata al raccoglimento dei dati per conoscere le informazioni fondamentali del pubblico di riferimento, per identificarne i bisogni e gli intenti. Dei clienti è opportuno analizzare: dati demografici e interessi (informazioni riguardo all'età e al sesso degli utenti, dati geografici (informazioni sulla lingua e sulla località degli utenti), comportamento, tecnologia e dispositivi utilizzati.

A questo punto, avrete tra le mani una buona mole di materiale da cui partire, ma non è sufficiente, perché deve essere integrata mediante dei dati qualitativi, che descrivano il sentiment del cliente e le motivazioni che lo spingono all’acquisto (ad esempio Di cosa ha bisogno il nostro possibile cliente? Come soddisfa attualmente quella sua necessità? Quali sono i suoi desideri latenti o inespressi?). A questo proposito può essere utile preparare delle interviste, dei questionari o dei sondaggi da sottoporre a chi si occupa di customer care (ad esempio Quali canali utilizza il cliente per contattare la vostra azienda? Quali sono le domande che fanno più di frequentemente? Quali sono i problemi comuni riscontrati?) oppure direttamente ai clienti (ad esempio Cosa vi ha fatto scegliere questo prodotto o servizio? Come descrivereste la vostra esperienza di acquisto? Quali informazioni avete avuto difficoltà a trovare nel sito? Cambiereste qualcosa per rendere più facile il processo di acquisto?). 

Dopo aver raccolto informazioni sul bacino d’utenza potenziale è possibile definire le Buyer Persona, ovvero gli stereotipi delle più frequenti tipologie di utenti emerse dall’analisi. Costruire le buyer personas consente di comprendere in maniera dettagliata chi è il nostro target di riferimento.

A questo punto, avendo in mano tutti i dati relativi all’utente del sito e avendo definito le principali buyer persona, si può iniziare a creare la mappa del customer journey, ovvero un diagramma che rappresenta un funnel delle fasi del percorso e dei touchpoint attraverso i quali l’utente raggiunge un determinato obiettivo o effettua una conversione. Analizzando la sequenza temporale del processo è possibile evidenziare i comportamenti, nonché le motivazioni, le difficoltà incontrate dall’utente, al fine di progettare nuovi funnel, più efficaci e coinvolgenti per il vostro utente medio. 

L’analisi dei competitors: 

Una volta terminata la user research si passa all’ analisi dei principali competitors. Il mio consiglio è quello di individuare i 4-5 competitor organici principali del cliente: io ad esempio utilizzo Market Explorer di SEMrush, e tra i top 30 indicati cerco di capire quali possono essere quelli che offrono lo stesso tipo di prodotto e servizio:

In particolare, per ogni singolo competitor andrei ad indagare:

• come hanno strutturato il sito ed il flusso di navigazione

• come hanno gestito i contenuti e i meta tag SEO

• quanto traffico ricevono al sito e da quali canali

• quali sono le pagine del sito più visitate

• quali sono le chiavi per cui si posiziona il sito

• quali sono le chiavi per cui siamo in competizione

• quali sono le chiavi per cui il mio competitors si posiziona e io no

• come è messo il profilo off-site del mio competitor

• quali attività fa il mio competitor (ads? digital PR? social?)

Infine non resta che svolgere la vera e propria analisi SEO del sito del cliente. 

L’audit SEO

A mio parere, durante un’audit SEO sono quattro i focus fondamentali analizzare: la presenza sul web (indicizzazione, brand reputation, link profile), l’architettura del sito (architettura dell’informazione, navigazione a faccette, menu di navigazione, paginazione, sitemap.xml, interlinking), il content (contenuti, duplicazione, meta tag, dati strutturati) e l’usabilità (velocità del sito, versione mobile, errori di scansione). Per chi volesse approfondire l’argomento inserisco un rimando all’articolo dedicato “ Come realizzare un'analisi SEO professionale”.

Dal momento che si sta analizzando un sito e-commerce, in questa fase è fondamentale raccogliere dati sul catalogo del cliente, andando ad individuare quali sono i prodotti più cercati, i prodotti più venduti, il prezzo sul mercato e la relativa competitività, la disponibilità e l’assortimento, l’andamento delle vendite, gli effetti della stagionalità ed il loro posizionamento online.

Dove possibile, consiglierei di arricchire l’analisi con i dati di eyetracking, click tracking e le heatmap. Tramite appositi strumenti (consigliati nel capitolo successivo) è possibile registrare ed analizzare il comportamento degli utenti sul sito, per capire dove si concentra il loro sguardo, quali sono le aree di maggior interesse, come interagiscono con gli elementi del sito, etc. 

I tool necessari per l’analisi

Alcuni dei tool che ritengo fondamentali per le varie analisi:

• Analisi del settore: SEMrush, Google Keyword Planner, Google Trends, Consorzi (es. Netcomm, Casaleggio e Associati, etc.), Riviste di settore (es. Largo Consumo)

• Analisi dei target e del customer journey: Analytics, Facebook Insight, Hotjar, Custellence, UXpressia, CEM Cloud, Hubspot, Make My Persona, Survey Monkey, etc.

• Analisi del comportamento utenti: Analytics, Hotjar, SmartLook, Crazyegg, Clicktale, etc.

• Analisi SEO: SEMrush, Analytics, Search Console, Screaming Frog, etc.

UX + SEO FASE 2: la progettazione

Ecco alcuni aspetti che dovrai tenere a mente per fare in modo che UX e SEO lavorino all’unisono.

Definire l’alberatura ed il flusso di navigazione dell’e-commerce

Con il termine " alberatura" s'intende l’organizzazione gerarchica dei contenuti di un sito, affinché essi possano essere trovati facilmente dall’utente e scansionati senza problemi dagli spider dei motori di ricerca. Il primo passo per capire come raggruppare al meglio i prodotti in categorie e sottocategorie è necessario avere un’ottima conoscenza del catalogo. A tal proposito il mio consiglio è quello di far creare al cliente un file, contenente questi dati:

• il nome del prodotto

• l’eventuale brand di appartenenza del prodotto

• i codici di identificazione del prodotto (es. SKU, EAN, etc.)

• le categorie e/o sottocategorie di appartenenza del prodotto

• le caratteristiche estetiche e/o tecniche del prodotto

A questo punto bisogna cercare se i prodotti possono essere raggruppati in base a determinate caratteristiche. Ovviamente ci sono delle “regole da rispettare”:

• La struttura ideale è quella a silos e dovrebbe arrivare ad un massimo di 3 livelli di profondità

• Le schede prodotto devono essere raggiungibili tramite percorsi di navigazione differenti

• Le categorie devono avere più di un prodotto al loro interno (consiglio almeno 4-5)

• Bisogna evitare di creare categorie simili, in modo da evitare il problema della duplicazione

Il passo successivo è quello di andare a definire quali attributi sfruttare per il posizionamento SEO (creando apposite pagine di categoria ottimizzate), e quali possono semplicemente essere usati per la creazione di attributi, utili per la selezione di prodotti in base a determinate caratteristiche (ad esempio filtri di prezzo, annata, formato, etc.), oppure per la navigazione multidimensionale (es. “Chardonnay” + “Alto Adige”).

Queste pagine parametriche, dovranno poi essere gestite nel modo corretto, al fine di evitare duplicazioni di contenuto e spreco di risorse. Progettare un sistema di navigazione a faccette SEO friendly può sembrare semplice, ma allo stato dei fatti rappresenta uno dei fattori principali di insuccesso nel posizionamento degli e-commerce.

Una volta definita la struttura del sito dedicherei tempo alla progettazione del menu di navigazione principale, che andrà inserito all’interno del wireframe. Il menù deve essere semplice, intuitivo, ordinato e deve dare rilevanza alle pagine principali del sito, come ad esempio le categorie merceologiche più importanti lato SEO, i top brand, i prodotti che generano maggiori entrate ed eventuali pagine alternative (ad esempio all’interno di un e-commerce di abbigliamento le collezioni, i must have, gli abbinamenti, etc.).

Esistono diverse tipologie di menù di navigazione: è possibile optare per uno slim menu, oppure per un mega menu, ma è anche possibile scegliere tra la classica navigazione primaria orizzontale (che limita il numero di link visualizzabili nella parte superiore del layout, ad una decina di voci) e una navigazione primaria verticale (che è più versatile e permette di aggiungere un maggior numero di categorie e sottocategorie, quindi ideale per un e-commerce di grandi dimensioni es. Amazon).

Ultimo passaggio, ma non meno importante, è quello relativo al collegamento delle pagine del sito (internal linking). La matrice interna dei link, infatti, va progettata a monte, nel momento in cui si effettua lo studio dell’architettura informativa e della disposizione dei contenuti all’interno di un sito. E’ necessario che tutte le pagine siano perfettamente collegate tra di loro, in modo da consentire all’utente di muoversi facilmente e velocemente da una sezione all’altra del sito, ma anche da permettere allo spider dei motori di ricerca una più facile attività di crawling e indicizzazione delle pagine. Inoltre, mediante un’apposita attività di interlinking avanzato, è possibile dare valore alle pagine focus per il posizionamento del sito.Gli errori da evitare:

• collegare tra di loro contenuti non pertinenti tra loro;

• utilizzare anchor text troppo lunghe o troppo generiche (es. “scopri di più”);

• inserire un numero eccessivo di link interni all’interno dei contenuti testuali;

• utilizzare l’attributo rel=nofollow quando si linka una pagina interna di valore.

Utilizzare una comunicazione convenzionale e mirata

A questo punto il web designer ha tutti i dati a disposizione per l’elaborazione del wireframe da presentare al cliente. E’ bene ricordare che un e-commerce, per potersi affermare online, deve avere un’identità ben definita e ci sono alcune convenzioni da rispettare. Vediamole insieme:

NAVIGAZIONE E RICERCA

• è preferibile optare per un un megamenu con le macro categorie in evidenza;

• il sottomenu a comparsa deve presentare un’ampia finestra per le sottocategorie;

• il menù deve di navigazione deve offrire più percorsi di navigazione differenti;

• le breadcrumbs devono essere utilizzate per consentire l’orientamento dell’utente;

• la barra di ricerca deve essere ampia, riconoscibile e dotata di autosuggest intelligente;

• le CTA devono far leva sul principio del feedforward e comunicare in anticipo gli effetti delle azioni. Devono essere disegnate per stimolare il clic e non devono essere influenzate dallo scroll;

• bisogna fornire un feedback in seguito all’inserimento di un prodotto nel carrello;

• è consigliabile comunicare eventuali errori di navigazione (es. “scegli taglia per proseguire”).

HOME PAGE

• la tagline in evidenza deve spiegare il tipo di business trattato (business value proposition);

• le spese di spedizione devono essere in evidenza, all’interno dell’header;

• il menù deve essere focalizzato sui prodotti, mentre le info di utility vanno inserite nel footer;

• devono essere inserite delle immagini descrittive a supporto della descrizione del prodotto;

• è necessario mettere in primo piano promozioni, scontistiche;

• bisogna presentare sia le categorie merceologiche, che i singoli prodotti; 

• è consigliabile inserire una promo differente, all’ingresso all’uscita.

SCHEDE PRODOTTO

• Il titolo dei prodotti è sempre chiaro e descrittivo;

• i prodotti vengono fotografati fuori dal packaging;

• le immagini e le thumbnail hanno una grandezza adeguata (e lo zoom);

• vengono usati video che mostrano il prodotto, oltre alle fotografie;

• i dettagli tecnici devono essere inseriti in maniera tabellare e schematica;

• le descrizioni dei prodotti devono essere esplicative ed approfondite;

• la CTA d’acquisto deve essere fissa, cioè visibile senza scrollare la pagina;

• deve essere previsto uno spazio per le recensioni ed i feedback degli utenti;

• è consigliabile inserire una carrellata di prodotti correlati e visti di recente.

LOGIN E CHECKOUT

• è necessario prevedere una wishlist, dove l’utente può salvare i prodotti desiderati;

• il percorso di navigazione, dalla home al checkout, deve essere super semplificato;

• la comunicazione dell’aggiunta al carrello deve essere chiara e completa (con prodotti e totale);

• bisogna rendere disponibile il login attraverso altre piattaforme (es. account Google o Facebook);

• durante l’acquisto bisogna richiedere solo le informazioni veramente necessarie;

• bisogna rendere possibile il checkout senza login (accesso da ospite).

Progettare la disposizione dei contenuti: l’attività di UX writing

I contenuti in un e-commerce sono essenziali: l’utente, infatti, non è fisicamente nel negozio, non può toccare con mano il prodotto o il servizio venduto, e non può affidarsi all’aiuto di un venditore fisico che lo può aiutare nelle scelte d’acquisto. Per questo motivo, oltre ad inserire immagini di qualità, è fondamentale inserire contenuti testuali esplicativi, esaurienti e ben scritti. Ma non solo! Anche la posizione del contenuto è importante. L’utente, infatti, si aspetta di trovare con facilità tutte le informazioni che gli consentano di effettuare l’acquisto nel più breve tempo possibile. 

Avete mai sentito parlare di UX writing?

Nel 2020 non basta più saper scrivere bene, è necessario avere un’ottima conoscenza delle tecniche di ottimizzazione per i motori di ricerca e di come funziona la progettazione dell’esperienza dell’utente. Questa figura professionale, infatti, lavora a stretto contatto con il SEO Specialist ed il web designer, e fa uso dei dati da loro raccolti in fase di analisi (es. analisi di mercato, studio del target di riferimento, studio della semantica nei competitors, analisi del posizionamento, etc.) per poter progettare una comunicazione efficace per il cliente di riferimento.

Lo Ux writer è particolarmente specializzato nella stesura dei microtesti, ovvero quelle piccole porzioni di contenuto che spesso vengono trascurate, ma in realtà aiutano l’utente a muoversi nel sito e a compiere la conversione, ad esempio le call to action, i titoli ed i sottotitoli, i messaggi di errore, etc. 

In che modo le parole concorrano a migliorare la user experience?

• Rendono i messaggi più empatici e persuasivi

• Aggiungono personalità al brand

• Forniscono suggerimenti utili per la navigazione

Ecco un esempio di UX writing su Mailchimp:

Il design mobile responsive: fondamentale per la UX e per la SEO

Con Responsive Design si intende “quell’approccio per il quale la progettazione e lo sviluppo di un sito dovrebbero adattarsi al comportamento e all’ambiente dell’utente in base a fattori come le dimensioni dello schermo, la piattaforma e l’orientamento del device” (Kayla Knight, Smashing Magazine).

Il 50% di tutto il traffico, nel 2020, è guidato dalla ricerca mobile. Il design responsive si rende sempre più necessario, sia ai fini di migliorare l’esperienza dell’utente sul sito, che per ottenere migliori risultati di posizionamento (SEO). Non dimentichiamoci infatti che da Luglio 2019 Google ha iniziato ad utilizzare l’indice Mobile First, per la scansione, l’indicizzazione ed il posizionamento dei siti. Inoltre, la page experience, verrà calcolata sulla base di diversi fattori di posizionamento esistenti in Google Search, tra cui proprio la facilità di navigazione dai dispositivi mobili.

Ormai, i progettisti UX più esperti danno la priorità al design mobile-responsive in tutti i progetti in cui sono coinvolti. Ed è stato dimostrato che il 67% delle aziende che ha realizzato siti web mobile-first ha riportato un esponenziale aumento delle vendite ( dati Sagipl.com).

Il mobile-first presenta una serie di sfide, che gli web designer devono affrontare per offrire un'ottima user experience ai propri utenti. 

La prima cosa a cui pensare quando ci si avvicina al design mobile-first è il contenuto: i dispositivi mobili sono maggiormente limitati, di conseguenza è necessario assegnare una priorità agli elementi della pagina, in modo che le informazioni e le azioni più importanti siano chiaramente visibili, a discapito di quelle superflue (ad esempio, tra i contenuti ad alta priorità sarebbe bene includere i prodotti in vetrina, gli articoli in saldo, le nuove collezioni, i codici sconto, i moduli ed i pulsanti di invito all'azione). Ecco alcune best practice da rispettare:

• i contenuti (testuali e visivi) devono essere equivalenti sulle versioni mobile e desktop;

• i caratteri tipografici devono essere leggibili (senza eseguire lo zoom) faed avere un bell’aspetto;

• le informazioni più importanti della pagina devono essere inserite above the fold;

• menu, pulsanti, immagini e frecce di navigazione devono essere facilmente cliccabili;

• le CTA devono essere in evidenza e devono guidare l’utente verso la conversione;

• tra gli elementi cliccabili deve esserci uno spazio bianco adeguato;

• il muro di testo può essere evitato mediante l’utilizzo di un accordion;

• elementi visibili in mouseover, interstitial ed effetti di scorrimento devono essere evitati;

• implementare lo scorrimento orizzontale per visualizzare immagini e slider

• fornire feedback visivi a seguito di un'azione da parte dell’utente (es. aggiunta al carrello).

User experience, SEO e velocità sul web

Un altro punto essenziale da osservare, fondamentale per garantire una buona esperienza complessiva dell’utente ed ottimi risultati di posizionamento, è la velocità del sito web. Esattamente come per quanto riguarda il mobile, la velocità dal 2019 è entrata a far parte dei fattori di ranking diretti più importanti e la page experience, verrà calcolata sulla base di questa metrica.

Dal punto di vista dell’esperienza, se il caricamento delle pagine è veloce l’utente sarà più spronato a proseguire la navigazione, mentre in caso contrario l’abbandono è quasi certo: gli studi dimostrano che il 47% degli utenti prevede che i siti web si carichino in meno di due secondi (dati statistici consultabili sul sito bluecorona.com) ed il ritardo di un solo secondo nel caricamento di una pagina può ridurre le visualizzazioni della stessa dell'11%. 

I principali strumenti per analizzare la velocità di caricamento delle pagine di un sito web sono: GTmetrix. Google PageSpeed, Lighthouse e Web.Dev. Questi strumenti sono sicuramente utili, ma non bisogna pensare alla velocità come ad un mero punteggio. Perché? Perché c'è una gran differenza tra ciò che i dati oggettivi dicono e come sono effettivamente vissuti nel mondo reale. 

Come afferma Google infatti:

Alcune attività consigliate per migliorare le prestazioni del sito:

• Ottimizzare le immagini: le immagini devono essere caricate con formati (PNG, JPEG, GIF) e dimensioni adeguate. Per non perdere la qualità dell’immagine, i tool consigliati per la compressione, a parte Photoshop sono: TinyPNG, Optimizilla, ILove IMG.

• Abilitare la compressione GZIP: questo tipo di compressione abilitata lato server consente un’ulteriore riduzione delle dimensioni di HTML, fogli di stile e file JavaScript, al fine di velocizzare il tempo di rendering delle pagine. Come si abilita? In base al tipo di piattaforma utilizzata è possibile: editare il file .htaccess (Apache), editare il file nginx.conf (Nginx) o ricorrere ad un plugin di caching come WP Rocket (Wordpress).

• Minimizzare CSS, JavaScript e HTML: ottimizzando il codice (inclusa la rimozione di commenti sul codice, spazi, rientri e caratteri non necessari), è possibile aumentare notevolmente la velocità della pagina. Strumenti consigliati: CSSNano e UglifyJS.

• Rimuovere il JavaScript che blocca il rendering: i browser devono creare un albero DOM analizzando HTML prima di poter eseguire il rendering di una pagina. Se il browser rileva uno script durante questo processo, deve arrestarsi ed eseguirlo prima di poter continuare. Di conseguenza, Google suggerisce di evitare e ridurre al minimo l'uso del blocco di JavaScript.

• Migliorare i tempi di risposta del server: i tempi di risposta sono influenzati dalla quantità di traffico ricevuto, dalle risorse utilizzate da ciascuna pagina, dal software e dalla soluzione di hosting utilizzati. Come spiegato nella guida ufficiale di Google, dovrebbero mantenersi sempre al di sotto dei 200 ms. Per migliorare i tempi di risposta del server si devono abolire le componenti che occupano molte risorse e che non sono necessarie, individuare SQL critiche ed errori generati dal sito che possono minarne le prestazioni.

• Sfruttare la memorizzazione nella cache del browser: i browser memorizzano nella cache molte informazioni (fogli di stile, immagini, file JavaScript e altro) in modo che, quando il visitatore ritorna sul sito, il browser non debba ricaricare l'intera pagina e possa recuperare le informazioni più velocemente. Mediante un apposito tool (ad esempio YSlow) è possibile verificare se è già stata impostata una data di scadenza. in caso contrario è suggerito inserirla (a meno che la progettazione di un sito non cambi di frequente, si consiglia la tempistica di almeno un anno).

• Utilizzare un Content Delivery Network (CDN): le reti di distribuzione del contenuto servono per archiviare le copie del sito in più data center geograficamente diversi, in modo che gli utenti possano accedervi in modo più rapido e affidabile. Cloudflare e KeyCDN, ad esempio, sono provider altamente raccomandati da poter utilizzare facilmente sulla piattaforma WordPress.

• Usare gli sprite CSS: gli sprite CSS combinano le immagini usate di frequente nel sito (ad esempio pulsanti e icone) in un unico grande contenuto e le caricano tutte in una volta sola (il che significa un minor numero di richieste HTTP ed un conseguente risparmio nei tempi di caricamento delle immagini.

All’interno degli strumenti di Google, utilizzati per rilevare la velocità del sito, ad esempio Page Speed Insight, Chrome UX Report, Search Console e l’estensione Web Vitals, è possibile visualizzare i dati relativi ai Core Web Vitals.

• Google considera buono l’LCP al di sotto dei 2,5 secondi, mentre lo considera scadente al di sopra dei 4 secondi. I punteggi bassi dell’LCP possono essere influenzati da tempi di caricamento e tempi di risposta del server lenti, da render-blocking di JavaScript e CSS e dal client side rendering. Una volta individuata la propria casistica di riferimento, si potrà procedere con le relative azioni risolutive. Oltre agli strumenti già citati, per l’analisi, si possono utilizzare anche strumenti da laboratorio come Chrome DevTools, Faro e WebPageTest.

• Google considera buono un FID al di sotto dei 100 ms, mentre lo considera scadente al di sopra dei 300ms. Generalmente un FID scadente è dovuto all’esecuzione di JavaScript pesanti, di conseguenza per migliorare le prestazioni si consiglia di suddividere le funzioni, ridurre il tempo di esecuzione del JS, ridurre gli script di terze parti, utilizzare un web worker. Mentre l’LCP si può misurare sia sul campo che “in laboratorio”, il FID può essere misurato solo con gli strumenti che analizzano i Field Data (quindi quelli citati in precedenza).

• Google considera buono un CLS inferiore a 0.1, mentre oltre lo 0.25 è considerato scadente. Anche il CLS, come l’LCP può essere analizzato in laboratorio, mediante l’utilizzo degli stessi strumenti. Per migliorare questo punteggio è necessario rispettare alcune pratiche specifiche, ad esempio: prediligere le proprietà CSS transform: scale() e CSS transform: translate(), includere sempre gli attributi di dimensione a immagini o video ed evitare di inserire contenuti che si sovrappongano a quelli esistenti.

Conclusioni

SEO e UX sono due ambiti differenti, ma estremamente complementari, e lavorano in funzione di un obiettivo comune. Riuscendo a rispettare gli standard e le aspettative degli utenti, sia per quanto riguarda i contenuti, che per il design e l’interfaccia, è possibile ottenere un notevole abbassamento del tasso di rimbalzo ed un aumento dei valori di tutti quei famosi elementi che influiscono sul ranking di un sito. Fondamentale, però, ricordare sempre che non esistono siti uguali agli altri: sottovalutare la fase di ricerca ed analisi per passare immediatamente alla progettazione potrebbe causare danni irreparabili ad un sito e-commerce ed ingenti perdite in termini di denaro.

E tu, cosa ne pensi? Lascia, come sempre, un commento sotto al mio post, per esprimere la tua idea!