Core Web Vitals : la formation
Deux heures avec votre équipe web, sur vos propres pages. Tarif fixe, sans limite de participants.
À quoi ressemble une masterclass avec moi
La masterclass apprend à votre équipe à trouver le problème. Au passage, on repère en général un ou deux points sur votre site, et vos développeurs peuvent les corriger dans la semaine. Si vous préférez avoir chaque fix documenté par écrit, c'est un audit.
-
Construite autour de votre site et de vos cas réels
Envoyez-moi votre URL, les pages sur lesquelles votre équipe travaille le plus et les problèmes qui la bloquent. Je vérifie le p75 du LCP, de l'INP et du CLS sur mobile, les groupes de pages signalés par Search Console, et la tendance sur les derniers mois. J'enregistre ensuite des traces de ces pages. Cela me prend environ une demi-journée.
-
Deux heures avec votre équipe
Pendant la première heure, j'explique comment le navigateur charge vos pages et gère un tap, directement sur les traces que j'ai enregistrées. Ensuite, l'un de vos développeurs partage son écran et prend la main ; je lui indique où cliquer. Invitez tous ceux qui développent le site. Si quelqu'un d'autre gère le tag manager, faites-le venir aussi.
-
L'enregistrement et les notes
Vous gardez l'enregistrement et les slides. En quelques jours, vous recevez aussi des notes sur ce qu'on a repéré, le plus important en premier. Ceux qui ont manqué la session peuvent s'en servir pour rattraper.
-
Un suivi, un mois plus tard
Optionnel. D'ici là, votre équipe a testé de son côté et sait où elle bloque. Elle apporte ses traces et fixe le programme pour deux heures de plus.
Ce que vos développeurs sauront faire après la formation
- Field data
Lire les chiffres que Google regarde
Lighthouse annonce 95, Search Console affiche un échec. Lighthouse n'est qu'un seul téléphone simulé sur un seul chargement de page. Google regarde vos vrais visiteurs au p75, et sur mobile. Votre équipe apprend à lire les deux, et à repérer les audits PageSpeed Insights qui ne feront pas bouger les field data. Use efficient cache lifetimes liste souvent les scripts de tags de Google lui-même, et personne ne peut modifier leurs en-têtes de cache.
- LCP
Comprendre pourquoi l'élément LCP apparaît tard
On repère le marqueur LCP dans le panneau Performance et on remonte jusqu'à la requête. Les sous-parties vous disent si le navigateur a découvert l'image tard, l'a chargée lentement, ou l'avait déjà sans pour autant l'afficher. Quand elle est découverte tard, c'est généralement un arrière-plan CSS ou un script de slider qui l'ajoute ; compresser l'image ne rattrapera pas ce retard.
- INP
Identifier le script derrière une interaction lente
« Problème d'INP : supérieur à 200 ms (mobile) » figure dans Search Console depuis des mois, et la trace montre une call stack remplie de fonctions minifiées. On prend une interaction lente et on la découpe en input delay, processing et presentation. Les Long Animation Frames identifient le script. Souvent, c'est un click handler qui re-render la moitié de la page, ou un event analytics exécuté avant le prochain paint.
- CLS
Trouver l'origine d'un layout shift
Un layout shift, c'est un élément de la page qui bouge alors que personne ne s'y attendait. L'élément qui a bougé est rarement la cause du shift. C'est autre chose qui l'a fait bouger : une image sans width ni height, un script qui ajoute du contenu au-dessus, ou une web font qui swap.
- Scripts tiers
Mettre un chiffre sur chaque tag
Vos développeurs ne gèrent pas le tag manager, alors chaque nouveau pixel arrive sur la page sans ticket. Votre équipe apprend à mesurer chacun d'entre eux, dans une trace et sur l'INP de vos vrais visiteurs. Ce chiffre, c'est ce que vous apportez au marketing.
- Releases
Vérifier une release dès le lendemain
Le LCP a grimpé après un deploy et personne ne l'a remarqué avant l'e-mail de Search Console. Search Console montre les 28 derniers jours ; à ce stade, la release responsable date déjà de plusieurs semaines. Le RUM le montre dès le lendemain, dans CoreDash ou dans l'outil que vous utilisez déjà.
What clients say
Loop
"Arjen somehow makes LCP optimization sound simple. We used his approach and our metrics were 40% better within a week."
Nathan Ziarczyk
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
Combien coûte une formation Core Web Vitals ?
1 500 € pour la masterclass, tarif fixe pour toute l'équipe. Cinq développeurs ou quinze, même prix. La session de suivi est à 750 € pour deux heures de plus. Il y a moins de préparation, cela correspond donc au taux horaire d'une power hour.
- Moi, et 17 ans passés à lire des traces
- Votre p75 sur mobile vérifié avant de commencer
- Aucune limite de participants
- L'un de vos développeurs au clavier pendant la deuxième heure
- L'enregistrement, les slides et les notes
Deux heures, toute votre équipe
Préparation incluse.
1 500 € HTsuivi 750 €
Réserver une masterclass
Envoyez-moi votre URL et quelques mots sur votre équipe.
-
Présentez votre équipe
Combien de personnes, votre stack technique et le problème qui revient tout le temps. Si vous avez une échéance, comme une grosse release ou le Black Friday, précisez-le.
-
On choisit une date
Je vous réponds sous 24 heures avec plusieurs créneaux. J'ai besoin d'environ une semaine de préparation, le premier créneau est donc généralement dans une ou deux semaines.
-
Le jour J
Google Meet, Zoom ou Teams, selon ce que votre équipe utilise. Prévoyez un développeur avec le site ouvert dans Chrome : c'est lui qui prend les commandes pendant la deuxième heure.
À quoi a ressemblé la formation chez Speak
Une agence digitale néerlandaise qui conçoit des sites pour ses clients
Les clients interrogent constamment leur agence sur les Core Web Vitals : pourquoi Search Console est dans le rouge, si le nouveau thème va régler le problème. Speak voulait que ses développeurs aient les réponses ; j'ai donc formé l'équipe directement sur les sites de leurs clients.
Un an plus tard, Sander Los m'écrivait : « Grâce aux concepts et aux suggestions de la formation, la vitesse de nos pages et l'expérience utilisateur se sont nettement améliorées. » Son équipe avait reconstruit la boutique en ligne d'un client avec ce qu'elle avait appris.
Pour une agence, la performance devient alors une prestation à intégrer aux devis, et certaines la facturent plus cher.
Questions qu'on me pose souvent
La masterclass
Qu'est-ce qu'une masterclass Core Web Vitals ?
Deux heures de formation en visio pour votre équipe web, sur vos propres pages. Dès la deuxième heure, c'est votre propre développeur qui enregistre les traces.
Nos développeurs doivent-ils déjà s'y connaître en performance ?
Non. Il leur suffit de connaître HTML, CSS et JavaScript, et d'avoir déjà ouvert les DevTools. Lire une trace Performance, c'est ce que j'enseigne. Un product owner ou un marketeur peut tout à fait suivre la première heure.
Peut-on tout couvrir en deux heures ?
Pas avec le même niveau de détail. La métrique qui pose problème sur votre site occupe la majeure partie des deux heures, et nous voyons le reste pour que vous sachiez où regarder. Pour l'INP, cela comprend le découpage du travail dans un click handler avec scheduler.yield().
Nous utilisons Next.js. Est-ce un problème ?
Le navigateur se moque de ce qui a généré la page : le fonctionnement est le même pour Next.js, Nuxt, Magento, Shopify ou WordPress. Et comme les exemples viennent de votre site, votre framework en fait partie : l'hydratation qui bloque le premier tap sur une page Next.js, ou une application Shopify qui charge son script sur chaque template.
Votre équipe
Combien de personnes peuvent participer ?
Autant que vous le souhaitez. Le tarif est par équipe. Au-delà de 20 personnes, la deuxième heure devient compliquée autour d'un seul écran ; nous calons donc le format au préalable.
Nous sommes une agence. Est-ce adapté pour nous ?
Oui. Choisissez le site client que votre équipe connaît le mieux, ou celui qui est dans le rouge en ce moment. Si votre équipe n'arrive pas à faire passer un site au vert après la formation, il existe un accompagnement dédié aux agences.
Pouvez-vous venir dans nos locaux ?
Oui, avec des frais kilométriques en plus. À distance, cela fonctionne tout aussi bien, car chacun voit la trace sur son propre écran.
Tarif et suite
Deux heures, est-ce suffisant ?
Pour apprendre à lire une trace, oui. La correction du site se fait ensuite pendant les sprints de l'équipe, et la session de suivi sert à débloquer ce qui coince.
Peut-on réserver une formation plus longue ?
Oui. Une demi-journée, une journée complète, ou un cycle avec une session par métrique. Tout format plus long que la masterclass fait l'objet d'un périmètre et d'un tarif définis avant de commencer.
Quelle est la différence avec un audit ?
Dans un audit, j'identifie les problèmes et je les documente, puis votre équipe développe les corrections. La masterclass apprend à vos développeurs à trouver les problèmes eux-mêmes, ce qui est particulièrement rentable pour une équipe appelée à travailler sur le même site pendant des années. Si vous avez une échéance proche, commencez par l'audit.
Et si nous restons bloqués par la suite ?
Réservez la session de suivi, ou une power hour pour un problème complexe. Si c'est plus vaste, optez pour un audit ou du conseil.
