{"id":1327,"date":"2022-05-18T16:49:00","date_gmt":"2022-05-18T14:49:00","guid":{"rendered":"http:\/\/www.chi-siamo.com\/magazine\/?p=1327"},"modified":"2022-05-13T12:58:01","modified_gmt":"2022-05-13T10:58:01","slug":"core-web-vitals-come-valutare-lusabilita-di-una-pagina-web","status":"publish","type":"post","link":"https:\/\/www.chi-siamo.com\/magazine\/core-web-vitals-come-valutare-lusabilita-di-una-pagina-web\/","title":{"rendered":"Core Web Vitals: come valutare l\u2019usabilit\u00e0 di una pagina web"},"content":{"rendered":"\n<p>I <strong>Core Web Vitals <\/strong>sono l\u2019ultima novit\u00e0 di Google per definire la qualit\u00e0 di una pagina online, dal punto di vista della user experience. Si tratta di parametri centrali da individuare per ottimizzare al meglio un sito web in termini di qualit\u00e0 dei contenuti, layout, interazione con gli elementi della pagina web e cos\u00ec via.<\/p>\n\n\n\n<p>Nella pratica, i core web vitals sono dei dati necessari per poter valutare l\u2019<strong>usabilit\u00e0 di una pagina web<\/strong>. La loro importanza \u00e8 stata dichiarata da <strong>Google <\/strong>e Mountain View all\u2019interno del blog dedicato ai webmaster, affermando che a partire da maggio rappresentano dei fattori di ranking molto importanti da tenere in considerazione.&nbsp;<\/p>\n\n\n\n<p>L\u2019ottimizzazione dei core web vitals, quindi, sar\u00e0 una parte integrante del posizionamento online assieme ad altri fattori di ranking come la velocit\u00e0 del sito. Come fare, quindi, per conoscere i Core Web Vitals e ottimizzarli?<\/p>\n\n\n\n<h2>Come funzionano i Core Web Vitals: lo studio&nbsp;<\/h2>\n\n\n\n<p>Su<strong> Search Engine Journal<\/strong>, <em>Matt Southern<\/em> ha fornito un resoconto dettagliato che rivela la piccola percentuale di siti web in grado di superare un valutazione dei Core Web Vitals all\u2019interno di PageSpeed \u200b\u200bInsights.&nbsp;&nbsp;&nbsp;<\/p>\n\n\n\n<p>I risultati dell\u2019analisi hanno evidenziato notevoli problemi per stabilit\u00e0 visiva e velocit\u00e0 di caricamento: per il <strong>FID <\/strong>(<strong>First Input Delay<\/strong>), il primo parametro dei Core Web Vitals, il 99% dei siti web desktop e l\u201989% dei siti web mobile soddisfano il benchmark di 100millesecondi. Ci\u00f2 significa che la maggior parte dei siti presi in esame sono in grado di interagire immediatamente con le pagine interne.<\/p>\n\n\n\n<p>Altri due parametri fondamentali sono <strong>LCP <\/strong>(<strong>Largest Contentful Paint<\/strong>) e il <strong>CLS <\/strong>(<strong>Cumulative Layout Shift<\/strong>). Lo studio effettuato da Matt Southern ha evidenziato due grandi problemi: la maggior parte delle pagine analizzate, su cui atterrano gli utenti, impiega pi\u00f9 di 2,5 secondi per caricarsi e mostra dei cambiamenti di layout imprevisti. Questi errori forniscono una <em>cattiva esperienza utente<\/em>, perch\u00e9 le persone devono aspettare il caricamento della pagina mentre il contenuto oscilla in diverse direzioni.&nbsp;<\/p>\n\n\n\n<h3>I nuovi fattori di ranking&nbsp;<\/h3>\n\n\n\n<p>Google, all\u2019inizio del 2021 ha dichiarato che gli algoritmi valutano nuovi e diversi elementi ai fini del posizionamento e che contribuiscono a determinare l\u2019esperienza complessiva di una pagina.&nbsp;<br>Tra questi elementi troviamo in prima linea di Core Web Vitals, le tre metriche chiave per valutare le prestazioni che misurano:&nbsp;<\/p>\n\n\n\n<ul><li>Il caricamento visivo;<\/li><li>L\u2019interattivit\u00e0;<\/li><li>La stabilit\u00e0 visiva di una pagina durante il caricamento.<\/li><\/ul>\n\n\n\n<p>Un secondo elemento molto importante ai fini del posizionamento \u00e8 la <strong>compatibilit\u00e0 con i dispositivi mobile<\/strong>, ovvero la capacit\u00e0 di un sito di essere mobile friendly e la facilit\u00e0 di navigazione su smartphone, tablet ed altri dispositivi mobili.&nbsp;<\/p>\n\n\n\n<p>Al terzo posto si posiziona la <strong>navigazione sicura<\/strong>, un parametro fondamentale per valutare se un sito presenta problemi di phishing, malware e contenuti compromessi.&nbsp;<br>Seguono <strong>HTTPS <\/strong>e Intersistial non intrusivi, questi ultimi servono ad assicurare che i contenuti pi\u00f9 importanti non siano ostruiti durante la navigazione.<\/p>\n\n\n\n<h2>Come ottimizzare un sito per la Page Experience in 5 mosse<\/h2>\n\n\n\n<ol><li><strong>Accelerare i tempi di caricamento visivo<\/strong><\/li><\/ol>\n\n\n\n<p>Il primo passo per ottimizzare un sito \u00e8 il <strong>pre-caricamento delle risorse chiave <\/strong>che serve ad accelerare i tempi di caricamento visivo. L\u2019apparizione dei <em>contenuti above the fold <\/em>\u00e8 il primo indicatore che mostra all\u2019utente il processo di caricamento di una pagina e in questo esatto momento entra in gioco il primo parametro dei Core Web Vitals, il Largest Contentful Paint (LCP)<\/p>\n\n\n\n<p>Il pre-caricamento \u00e8 senza dubbio una possibile metodo per <strong>accelerare il caricamento LCP<\/strong> e il contenuto above the fold.&nbsp;&nbsp;<\/p>\n\n\n\n<ol start=\"2\"><li><strong>Minimizzare i long task<\/strong><\/li><\/ol>\n\n\n\n<p>La seconda metrica, il FID (First Input Delay) misura tutti quei problemi che possono rallentare l\u2019attesa dell\u2019utente quando il browser dev rispondere ad un clic su una pagina. Per <strong>ridurre i tempi di attesa tra l\u2019interazione umana e la risposta del browser <\/strong>\u00e8 possibile minimizzare i long task, ovvero dei pezzi di codice JavasScrip che bloccano il canale principale per un lungo periodo di tempo.&nbsp;<\/p>\n\n\n\n<ol start=\"3\"><li><strong>Riservare lo spazio per il caricamento delle immagini&nbsp;<\/strong><\/li><\/ol>\n\n\n\n<p>Il Cumulative Layout Shift (CLS) esamina la quantit\u00e0 di spostamento del layout visivo di una pagina durante il suo caricamento. Quante volte \u00e8 capitato di fare clic su un link, ma la pagina si sposta e finiamo per cliccare su altro? Questo abbassa aumenta notevolmente il punteggio CLS e abbassa il punteggio della User Experience. Ogni sito dovrebbe riservare lo spazio per il caricamento delle immagini e delle risorse incorporate per risolvere il problema.&nbsp;<\/p>\n\n\n\n<ol start=\"4\"><li><strong>Rendere le pagine chiave mobile friendly<\/strong><\/li><\/ol>\n\n\n\n<p>L\u2019<strong>usabilit\u00e0 di un sito su un dispositivo mobile<\/strong> e l\u2019ottimizzazione del layout incidono fortemente sulle sorti dell\u2019esperienza utente. \u00c8 possibile applicare due modalit\u00e0 per valutare l\u2019usabilit\u00e0 mmobile di un sito: il primo \u00e8 monitorare il rapporto di usabilit\u00e0 mobile su Google Search Console per controllare tutti gli errori e il secondo \u00e8 eseguire i <em>key page template <\/em>nel test ottimizzazione di Google.<\/p>\n\n\n\n<ol start=\"5\"><li><strong>Fare audit per garantire la sicurezza del sito web<\/strong><\/li><\/ol>\n\n\n\n<p>La <strong>sicurezza del sito web<\/strong>, come anticipato nel paragrafo precedente, gioca un ruolo fondamentale nel determinare l\u2019esperienza utente su una pagina. Un modo molto semplice ma al tempo stesso efficiente, per verificare problemi di sicurezza sul sito, \u00e8 utilizzare il rapporto Problemi di sicurezza presente in Google Search Console.<\/p>\n\n\n\n<ol start=\"6\"><li><strong>Verificare risorse e form&nbsp;<\/strong><\/li><\/ol>\n\n\n\n<p>Google cerca di garantire la sicurezza degli utenti durante la navigazione anche attraverso l\u2019utilizzo dell\u2019HTTPS. I contenuti che richiedono l\u2019interazione e l\u2019input dell\u2019utente, come form e risorse varie, devono essere serviti da una connessione HTTPS sicura che protegge i dati delle persone.&nbsp;<\/p>\n\n\n\n<h3>Conclusioni&#8230;<\/h3>\n\n\n\n<p>Abbiamo compreso, dunque, che nel momento in cui si decide di ottimizzare un sito \u00e8 importante tenere in mente che la velocit\u00e0 non \u00e8 l\u2019unico elemento a cui pensare per poter essere presi in considerazione dall\u2019algoritmo di Google.&nbsp;&nbsp;<\/p>\n\n\n\n<p>Ottimizzare tutti i Core Web Vitals, secondo Google porta ad ottenere un maggior numero di processi di acquisto terminati, una diminuzione della frequenza di rimbalzo e maggiori conversioni.&nbsp;&nbsp;<\/p>\n\n\n\n<p>La <strong>user experience <\/strong>\u00e8 l\u2019elemento cardine su cui sono puntati tutti gli occhi dei motori di ricerca e, in particolare, di Google. Come abbiamo visto in questo articolo, la UX tiene conto del caricamento rapido, della qualit\u00e0 dei contenuti, delle interazioni e della sicurezza di un sito web.&nbsp;<\/p>\n\n\n\n<p>Grazie a Google, ai webmaster e ai migliori esperti del web, oggi abbiamo tutti gli strumenti utili a disposizione per migliorare e ottimizzare un sito web, a favore di performance pi\u00f9 efficienti e a favore di maggiori conversioni che portano ad un aumento di visibilit\u00e0 e fatturato.&nbsp;<br><br><\/p>\n","protected":false},"excerpt":{"rendered":"<p>I Core Web Vitals sono l\u2019ultima novit\u00e0 di Google per definire la qualit\u00e0 di una pagina online, dal punto di vista della user experience. Si tratta di parametri centrali da individuare per ottimizzare al meglio un sito web in termini di qualit\u00e0 dei contenuti, layout, interazione con gli elementi della pagina web e cos\u00ec via. &hellip; <\/p>\n<p><a href=\"https:\/\/www.chi-siamo.com\/magazine\/core-web-vitals-come-valutare-lusabilita-di-una-pagina-web\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Core Web Vitals: come valutare l\u2019usabilit\u00e0 di una pagina web&#8221;<\/span><\/a><\/p>\n","protected":false},"author":3,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_mi_skip_tracking":false},"categories":[68,1],"tags":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.chi-siamo.com\/magazine\/wp-json\/wp\/v2\/posts\/1327"}],"collection":[{"href":"https:\/\/www.chi-siamo.com\/magazine\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.chi-siamo.com\/magazine\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.chi-siamo.com\/magazine\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.chi-siamo.com\/magazine\/wp-json\/wp\/v2\/comments?post=1327"}],"version-history":[{"count":3,"href":"https:\/\/www.chi-siamo.com\/magazine\/wp-json\/wp\/v2\/posts\/1327\/revisions"}],"predecessor-version":[{"id":1520,"href":"https:\/\/www.chi-siamo.com\/magazine\/wp-json\/wp\/v2\/posts\/1327\/revisions\/1520"}],"wp:attachment":[{"href":"https:\/\/www.chi-siamo.com\/magazine\/wp-json\/wp\/v2\/media?parent=1327"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.chi-siamo.com\/magazine\/wp-json\/wp\/v2\/categories?post=1327"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.chi-siamo.com\/magazine\/wp-json\/wp\/v2\/tags?post=1327"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}