Formazione sui Core Web Vitals
Due ore con il tuo team web, sulle tue pagine. Prezzo fisso, nessun limite di partecipanti.
Come si svolge una masterclass con me
Una masterclass insegna al tuo team a trovare il problema. Di solito troviamo una o due cose sul tuo sito durante la sessione, e i tuoi sviluppatori possono risolverle nella stessa settimana. Se preferisci che ogni correzione venga messa per iscritto, ti serve un audit.
-
Basato sul tuo sito e sui tuoi casi
Inviami il tuo URL, le pagine su cui il tuo team lavora di più e i problemi su cui si bloccano. Controllo il p75 per l'LCP, l'INP e il CLS su mobile, quale gruppo di pagine viene segnalato da Search Console e il trend degli ultimi mesi. Poi registro le tracce di quelle pagine. Mi ci vuole circa mezza giornata.
-
Due ore con il tuo team
Nella prima ora spiego come il browser carica le tue pagine e gestisce un tap, usando le tracce che ho registrato. Poi uno dei tuoi sviluppatori condivide lo schermo e prende il controllo, e io gli dico dove cliccare. Invita tutti quelli che sviluppano il sito. Se qualcun altro gestisce il tag manager, porta anche loro.
-
La registrazione e gli appunti
Ti tieni la registrazione e le slide. Entro pochi giorni ricevi anche gli appunti su ciò che abbiamo trovato, dai più importanti in giù. Chi ha perso la sessione può rimettersi in pari con quelli.
-
Un follow-up, un mese dopo
Opzionale. Per allora il tuo team ha provato a fare da solo e sa dove si blocca. Portano le loro tracce e fissano l'agenda per altre due ore.
Cosa sanno fare i tuoi sviluppatori dopo il corso
-
Field data
Leggere i numeri che guarda Google
Lighthouse dice 95, Search Console dice fallito. Lighthouse è un singolo telefono simulato su un singolo caricamento di pagina. Google guarda i tuoi visitatori reali al p75, e su mobile. Il tuo team impara a leggere entrambi, e quali audit di PageSpeed Insights non sposteranno i field data. Use efficient cache lifetimes elenca spesso gli script dei tag di Google stesso, e nessuno può cambiare i loro header di cache.
-
LCP
Scoprire perché l'elemento LCP appare in ritardo
Troviamo il marcatore LCP nel pannello Performance e andiamo a ritroso fino alla richiesta. Le sottoparti ti dicono se il browser ha trovato l'immagine tardi, l'ha caricata lentamente, o se la aveva ma non l'ha ancora renderizzata. Quando viene trovata tardi, di solito è un background CSS o uno script di uno slider che la aggiunge, e comprimere l'immagine non recupererà quel tempo.
-
INP
Dare un nome allo script dietro un'interazione lenta
"INP issue: longer than 200ms (mobile)" è in Search Console da mesi, e la traccia mostra uno stack di chiamate pieno di nomi di funzioni minificati. Prendiamo un'interazione lenta e la dividiamo in input delay, processing e presentation. I Long Animation Frames danno un nome allo script. Spesso è un click handler che renderizza di nuovo mezza pagina, o un evento di analytics che viene eseguito prima del paint successivo.
-
CLS
Trovare dove inizia un layout shift
Un layout shift è un elemento sulla pagina che si sposta quando nessuno se lo aspettava. L'elemento che si è spostato raramente ha causato lo shift. Qualcos'altro lo ha fatto spostare, come un'immagine senza larghezza e altezza, uno script che aggiunge contenuto sopra di esso, o un web font che fa swap.
-
Terze parti
Assegnare un numero a ogni tag
I tuoi sviluppatori non hanno il controllo del tag manager, quindi ogni nuovo pixel arriva sulla pagina senza un ticket. Il tuo team impara a misurarli tutti, in una traccia e nell'INP dei tuoi visitatori reali. Quel numero è ciò che porti al marketing.
-
Rilasci
Controllare un rilascio il giorno dopo
L'LCP è salito dopo un deploy e nessuno se n'è accorto finché Search Console non ha inviato l'email. Search Console mostra gli ultimi 28 giorni, quindi a quel punto il rilascio che l'ha causato è vecchio di settimane. I RUM lo mostrano il giorno dopo, in CoreDash o in qualsiasi cosa tu stia già usando.
What clients say
DPG Media
"Arjen can explain the most complicated performance problems, and you can tell he loves this stuff. It made learning the hard parts fun."
Ashkan Malekloo
Jamie Oliver Group
"After the training we finally understood why our INP was failing, and which interactions we had to make cheaper."
Nicole Keep
Loop
"Arjen somehow makes LCP optimization sound simple. We used his approach and our metrics were 40% better within a week."
Nathan Ziarczyk
Quanto costa un corso sui Core Web Vitals?
1.500 € per la masterclass, fissi, per tutto il team. Cinque sviluppatori o quindici, stesso prezzo. Il follow-up è di 750 € per altre due ore. C'è meno da preparare, quindi equivale circa alla tariffa oraria di una power hour.
- Me, e 17 anni passati a leggere tracce
- Il tuo p75 su mobile controllato prima di iniziare
- Nessun limite di partecipanti
- Uno dei tuoi sviluppatori alla tastiera nella seconda ora
- La registrazione, le slide e gli appunti
Due ore, tutto il tuo team
Preparazione inclusa.
1.500 € IVA esclusafollow-up 750 €
Prenota una masterclass
Mandami il tuo URL e due righe sul tuo team.
-
Parlami del tuo team
Quante persone siete, con cosa sviluppate e quale problema continua a ripresentarsi. Se c'è una scadenza, come un grosso rilascio o il Black Friday, menzionala.
-
Scegliamo una data
Rispondo entro un giorno con qualche data. Mi serve circa una settimana per prepararmi, quindi la prima è di solito tra una o due settimane.
-
Il giorno stesso
Google Meet, Zoom o Teams, quello che usa il tuo team. Assicurati che uno sviluppatore abbia il sito aperto su Chrome. Prenderà lui il controllo nella seconda ora.
Com'è stato il corso in Speak
Un'agenzia digitale olandese che costruisce siti per i suoi clienti
I clienti chiedono continuamente alla loro agenzia informazioni sui Core Web Vitals: perché Search Console è rosso, se il nuovo tema risolverà il problema. Speak voleva che i propri sviluppatori avessero la risposta, quindi ho formato il team sui siti dei loro stessi clienti.
Un anno dopo Sander Los mi ha scritto: "Grazie ai concetti e ai suggerimenti del corso, la velocità delle nostre pagine e l'esperienza utente sono migliorate significativamente." Il suo team aveva ricostruito il webshop di un cliente con ciò che aveva imparato.
Per un'agenzia, le performance diventano quindi un lavoro che puoi preventivare, e alcune agenzie lo fanno pagare di più.
Le domande che mi fanno
La masterclass
Cos'è una masterclass sui Core Web Vitals?
Due ore di formazione per il tuo team web in videochiamata, sulle tue pagine. Dalla seconda ora è un tuo sviluppatore a registrare le tracce.
I nostri sviluppatori devono già sapere di performance?
No. Devono conoscere HTML, CSS e JavaScript e aver aperto i DevTools in passato. Leggere una traccia Performance è ciò che insegno. Un product owner o un marketer possono seguire bene la prima ora.
Riesci a coprire tutto in due ore?
Non con la stessa profondità. Qualsiasi metrica fallisca sul tuo sito si prende la maggior parte delle due ore, e il resto ottiene quanto basta per sapere dove guardare. Per l'INP questo include dividere il lavoro in un click handler con scheduler.yield().
Usiamo Next.js. Fa differenza?
Al browser non importa cosa ha generato la pagina, quindi funziona allo stesso modo per Next.js, Nuxt, Magento, Shopify o WordPress. E dato che gli esempi vengono dal tuo sito, il tuo framework è lì dentro: l'hydration che blocca il primo tap su una pagina Next.js, o un'app Shopify che carica il suo script su ogni template.
Il tuo team
In quanti possono partecipare?
Quanti ne vuoi. Il prezzo è per team. Sopra le 20 persone la seconda ora diventa affollata attorno a un unico schermo, quindi parliamo prima del formato.
Siamo un'agenzia. Funziona per noi?
Sì. Scegli il sito cliente che il tuo team conosce meglio, o quello che sta fallendo in questo momento. Per un sito cliente che il tuo team non riesce a far diventare verde dopo il corso, c'è il supporto per le agenzie.
Puoi venire nel nostro ufficio?
Sì, aggiungendo un rimborso chilometrico. Online funziona altrettanto bene, perché tutti vedono la traccia sul proprio schermo.
Prezzi e cosa succede dopo
Due ore sono abbastanza?
Per imparare a leggere una traccia, sì. La correzione del sito avviene poi negli sprint del tuo team, e il follow-up serve per qualsiasi cosa su cui si bloccano.
Possiamo prenotare un corso più lungo?
Sì. Mezza giornata, una giornata intera, o una serie con una sessione per metrica. Qualsiasi cosa più lunga della masterclass viene concordata con uno scope e un prezzo prima di iniziare.
In cosa differisce da un audit?
Un audit sono io che trovo i problemi e li metto per iscritto, e il tuo team sviluppa le correzioni. La masterclass insegna loro a trovare i problemi da soli, il che ripaga di più per un team che lavorerà sullo stesso sito per anni. Con una scadenza in arrivo, inizia con l'audit.
E se poi ci blocchiamo?
Prenota il follow-up, o una power hour per un singolo problema difficile. Se è qualcosa di più grande, un audit o una consulenza.
