[{"data":1,"prerenderedAt":974},["ShallowReactive",2],{"site-nav":3,"article-core-web-vitals-lcp-inp-cls":109,"article-linked-core-web-vitals-lcp-inp-cls":802,"cta-service-optimisation-vitesse-site-web-nantes":973},{"services":4,"rubriques":92},[5,13,20,27,34,41,47,55,61,67,74,80,86],{"path":6,"title":7,"navTitle":8,"summary":9,"color":10,"order":11,"category":12},"\u002Fservices\u002Fcreation-site-vitrine-nantes","Création de site vitrine à Nantes","Site vitrine","Un site sur mesure, rapide et accessible, qui présente votre activité et transforme les visites en demandes de contact.","jaune",1,"creation",{"path":14,"title":15,"navTitle":16,"summary":17,"color":18,"order":19,"category":12},"\u002Fservices\u002Fcreation-site-e-commerce-nantes","Création de site e-commerce à Nantes","Site e-commerce","Une boutique en ligne sur Shopify, WooCommerce ou PrestaShop, pensée pour vendre : catalogue, paiement, livraison et SEO.","vert",2,{"path":21,"title":22,"navTitle":23,"summary":24,"color":25,"order":26,"category":12},"\u002Fservices\u002Frefonte-site-internet-nantes","Refonte de site internet à Nantes","Refonte de site","Moderniser votre site sans perdre votre référencement : audit, plan de redirections, nouveau design et migration des contenus.","orange",3,{"path":28,"title":29,"navTitle":30,"summary":31,"color":32,"order":33,"category":12},"\u002Fservices\u002Fwebdesign-ux-ui-nantes","Agence UX\u002FUI design et webdesign à Nantes","Webdesign UX\u002FUI","Recherche utilisateur, parcours, maquettes, prototype testé et design system : des interfaces claires, accessibles et prêtes à développer.","rose",4,{"path":35,"title":36,"navTitle":37,"summary":38,"color":39,"order":40,"category":12},"\u002Fservices\u002Fdeveloppement-web-sur-mesure-nantes","Agence de développement web sur mesure à Nantes","Développement sur mesure","Applications métier, extranets, MVP SaaS, API et intégrations : du code sur mesure, testé, documenté et qui vous appartient.","chartreuse",5,{"path":42,"title":43,"navTitle":44,"summary":45,"color":18,"order":46,"category":12},"\u002Fservices\u002Feco-conception-web-nantes","Éco-conception de site web à Nantes","Éco-conception","Audit RGESN, pages allégées, compatibilité avec les anciens appareils et déclaration d’écoconception : un site plus sobre, mesuré, sans allégation invérifiable.",6,{"path":48,"title":49,"navTitle":50,"summary":51,"color":52,"order":53,"category":54},"\u002Fservices\u002Freferencement-naturel-seo-nantes","Agence SEO à Nantes : référencement naturel","Référencement SEO","Audit, contenus, maillage, référencement local et suivi Search Console : un SEO mesuré, sans promesse de position, pour être trouvé à Nantes et au-delà.","bleu",7,"visibilite",{"path":56,"title":57,"navTitle":58,"summary":59,"color":39,"order":60,"category":54},"\u002Fservices\u002Foptimisation-vitesse-site-web-nantes","Optimisation de la vitesse de site web à Nantes","Vitesse & Core Web Vitals","Mesure des Core Web Vitals, audit, plan d’action chiffré et correctifs sur votre technologie : des pages plus rapides, vérifiées sur les données réelles.",8,{"path":62,"title":63,"navTitle":64,"summary":65,"color":32,"order":66,"category":54},"\u002Fservices\u002Faccessibilite-numerique-nantes","Accessibilité numérique et audit RGAA à Nantes","Accessibilité (RGAA)","Audit RGAA, corrections, déclaration d’accessibilité et formation : rendre votre site utilisable par tous et répondre à vos obligations.",9,{"path":68,"title":69,"navTitle":70,"summary":71,"color":10,"order":72,"category":73},"\u002Fservices\u002Fmaintenance-site-internet-nantes","Maintenance de site internet à Nantes","Maintenance & hébergement","Mises à jour, sécurité, sauvegardes, hébergement en Europe et petites modifications : votre site reste rapide, sûr et à jour.",10,"exploitation",{"path":75,"title":76,"navTitle":77,"summary":78,"color":52,"order":79,"category":73},"\u002Fservices\u002Finfrastructure-cloud-nantes","Infrastructure cloud scalable à Nantes","Infrastructure cloud","Une architecture évolutive hébergée en Europe, décrite en code, qui monte en charge et se relève d’une panne : pour les boutiques et applications à fort trafic.",11,{"path":81,"title":82,"navTitle":83,"summary":84,"color":25,"order":85,"category":73},"\u002Fservices\u002Faudit-securite-site-web-nantes","Audit de sécurité de site web à Nantes","Audit de sécurité","HTTPS, extensions, comptes, sauvegardes et contrôles guidés par l’OWASP : un audit de sécurité priorisé, vérifié après corrections, et la remise en état d’un site piraté.",12,{"path":87,"title":88,"navTitle":89,"summary":90,"color":32,"order":91,"category":73},"\u002Fservices\u002Fautomatisation-processus-nantes","Agence d’automatisation des processus à Nantes","Automatisation & API","Vos outils reliés par des workflows n8n et des API — CRM, facturation, boutique, formulaires —, avec une IA qui propose et une personne qui valide.",13,[93,97,101,105],{"path":94,"title":95,"navTitle":96,"color":52,"order":11},"\u002Fjournal\u002Frubrique\u002Fseo-visibilite-locale","Être trouvé : SEO et visibilité locale","SEO & visibilité locale",{"path":98,"title":99,"navTitle":100,"color":32,"order":19},"\u002Fjournal\u002Frubrique\u002Fux-contenus-accessibilite","Être compris : UX, contenus et accessibilité","UX, contenus & accessibilité",{"path":102,"title":103,"navTitle":104,"color":18,"order":26},"\u002Fjournal\u002Frubrique\u002Fdesign-conversion-ecommerce","Être choisi : design, conversion et e-commerce","Design, conversion & e-commerce",{"path":106,"title":107,"navTitle":108,"color":10,"order":33},"\u002Fjournal\u002Frubrique\u002Fprojet-web-budget-methode","Durer : budget, méthode, performance et sécurité","Projet, sécurité & durée",{"id":110,"title":111,"author":112,"body":113,"cover":770,"coverAlt":770,"date":771,"dateModified":770,"description":772,"extension":773,"faq":774,"featured":787,"head":770,"keyword":788,"meta":789,"navigation":790,"ogImage":770,"path":791,"robots":770,"rubrique":792,"schemaOrg":770,"seo":793,"services":795,"sitemap":798,"stem":799,"summary":800,"__hash__":801},"journal\u002Fjournal\u002Fcore-web-vitals-lcp-inp-cls.md","Core Web Vitals : LCP, INP et CLS expliqués simplement","equipe-fogg",{"type":114,"value":115,"toc":759},"minimark",[116,133,141,146,154,222,236,247,253,257,266,269,291,295,298,359,368,380,389,393,402,478,487,490,501,508,512,521,524,560,569,573,582,591,632,639,643,652,655,675,692,696,709,712,721,725,752],[117,118,119,120,124,125,128,129,132],"p",{},"Les Core Web Vitals sont trois indicateurs définis par Google pour mesurer l’expérience réelle des visiteurs d’une page. Le LCP (",[121,122,123],"em",{},"Largest Contentful Paint",") mesure la vitesse d’affichage du contenu principal : il est bon jusqu’à 2,5 secondes. L’INP (",[121,126,127],{},"Interaction to Next Paint",") mesure la réactivité aux clics, aux touchers et au clavier : bon jusqu’à 200 millisecondes. Le CLS (",[121,130,131],{},"Cumulative Layout Shift",") mesure la stabilité de la mise en page : bon jusqu’à 0,1.",[117,134,135,136,140],{},"Une page les réussit quand, pour chacun, au moins 75 % des visites respectent le seuil. Google s’en sert dans son classement, sans qu’ils remplacent la pertinence d’un contenu. Ce guide, qui prolonge ",[137,138,139],"a",{"href":94},"nos articles pour être trouvé sur Google",", explique comment les lire, les tester gratuitement et les améliorer.",[142,143,145],"h2",{"id":144},"trois-indicateurs-trois-questions","Trois indicateurs, trois questions",[117,147,148,149,153],{},"Chaque indicateur répond à une question de vos visiteurs. Les trois sigles ont chacun ",[137,150,152],{"href":151},"\u002Fglossaire#lcp","leur définition dans notre glossaire du web"," ; voici l’essentiel.",[155,156,157,176],"table",{},[158,159,160],"thead",{},[161,162,163,167,170,173],"tr",{},[164,165,166],"th",{},"Indicateur",[164,168,169],{},"La question du visiteur",[164,171,172],{},"Bon",[164,174,175],{},"Médiocre",[177,178,179,194,208],"tbody",{},[161,180,181,185,188,191],{},[182,183,184],"td",{},"LCP — chargement",[182,186,187],{},"« La page s’affiche-t-elle vite ? »",[182,189,190],{},"2,5 s ou moins",[182,192,193],{},"Plus de 4 s",[161,195,196,199,202,205],{},[182,197,198],{},"INP — réactivité",[182,200,201],{},"« Répond-elle quand je touche un bouton ? »",[182,203,204],{},"200 ms ou moins",[182,206,207],{},"Plus de 500 ms",[161,209,210,213,216,219],{},[182,211,212],{},"CLS — stabilité visuelle",[182,214,215],{},"« Le contenu reste-t-il en place ? »",[182,217,218],{},"0,1 ou moins",[182,220,221],{},"Plus de 0,25",[117,223,224,228,229,235],{},[225,226,227],"strong",{},"Le LCP"," retient le plus grand élément visible à l’écran — une image, une vidéo, une image de fond ou un bloc de texte — et mesure le temps écoulé, depuis le début de la navigation, jusqu’à son affichage. Il cesse de chercher dès que le visiteur clique ou touche l’écran, fait défiler la page ou tape au clavier (",[137,230,234],{"href":231,"rel":232},"https:\u002F\u002Fweb.dev\u002Farticles\u002Flcp",[233],"nofollow","définition du LCP",").",[117,237,238,241,242,235],{},[225,239,240],{},"L’INP"," observe toutes les interactions de la visite : clics, touchers et touches du clavier, mais ni le survol ni le défilement. Il retient la plus lente, en écartant une valeur extrême par tranche de 50 interactions (",[137,243,246],{"href":244,"rel":245},"https:\u002F\u002Fweb.dev\u002Farticles\u002Finp",[233],"fonctionnement de l’INP",[117,248,249,252],{},[225,250,251],{},"Le CLS"," additionne les décalages inattendus de la pire rafale : des décalages espacés de moins d’une seconde, sur cinq secondes au plus. Un mouvement qui survient moins d’une demi-seconde après un clic, un toucher ou une frappe au clavier, comme un menu qui s’ouvre, ne compte pas.",[142,254,256],{"id":255},"les-seuils-et-la-règle-des-75","Les seuils, et la règle des 75 %",[117,258,259,260,265],{},"Une même page n’est pas vécue de la même façon par tous : un visiteur sur la fibre, un autre en 4G dans le tramway nantais, un troisième sur un vieux téléphone. Google ne juge donc ni la meilleure visite ni la moyenne, mais le 75ᵉ centile : classez les visites de la plus rapide à la plus lente, c’est la valeur qui sépare les trois quarts les plus rapides du quart restant. Selon l’équipe Chrome, ce choix ",[137,261,264],{"href":262,"rel":263},"https:\u002F\u002Fweb.dev\u002Farticles\u002Fdefining-core-web-vitals-thresholds",[233],"assure qu’une majorité de visites atteint l’objectif sans que quelques valeurs extrêmes faussent le résultat",".",[117,267,268],{},"À retenir :",[270,271,272,279,285],"ul",{},[273,274,275,278],"li",{},[225,276,277],{},"Mobile et ordinateur sont mesurés séparément",", avec les mêmes seuils.",[273,280,281,284],{},[225,282,283],{},"Les trois indicateurs doivent être bons"," : dans la Search Console, le plus mauvais des trois donne son état à un groupe de pages.",[273,286,287,290],{},[225,288,289],{},"Les données réelles couvrent les 28 derniers jours"," de visites.",[142,292,294],{"id":293},"tester-votre-site-données-réelles-ou-laboratoire","Tester votre site : données réelles ou laboratoire",[117,296,297],{},"Les données réelles, dites « de terrain », viennent des visites d’utilisateurs de Chrome, réunies dans le rapport CrUX : elles font le verdict. Les tests « de laboratoire » chargent la page une fois, sur un appareil et une connexion simulés : ils aident à trouver les causes.",[155,299,300,313],{},[158,301,302],{},[161,303,304,307,310],{},[164,305,306],{},"Votre question",[164,308,309],{},"L’outil",[164,311,312],{},"Ce qu’il mesure",[177,314,315,326,337,348],{},[161,316,317,320,323],{},[182,318,319],{},"Mes pages passent-elles les seuils ?",[182,321,322],{},"Rapport Core Web Vitals de la Search Console",[182,324,325],{},"Les visites réelles, par groupe de pages",[161,327,328,331,334],{},[182,329,330],{},"Et cette page précise ?",[182,332,333],{},"PageSpeed Insights, partie haute",[182,335,336],{},"Les visites réelles de l’adresse, ou de tout le site",[161,338,339,342,345],{},[182,340,341],{},"Pourquoi est-elle lente ?",[182,343,344],{},"PageSpeed Insights, partie basse (Lighthouse)",[182,346,347],{},"Un chargement simulé",[161,349,350,353,356],{},[182,351,352],{},"Qu’est-ce qui ralentit ce clic ?",[182,354,355],{},"Outils de développement de Chrome",[182,357,358],{},"Votre propre visite, en direct",[117,360,361,362,367],{},"Le ",[137,363,366],{"href":364,"rel":365},"https:\u002F\u002Fsupport.google.com\u002Fwebmasters\u002Fanswer\u002F9205520?hl=fr",[233],"rapport Core Web Vitals de la Search Console"," regroupe les adresses qui offrent une expérience similaire, souvent les pages d’un même modèle, et classe chaque groupe « Bon », « Amélioration nécessaire » ou « Médiocre ». Faute de visites suffisantes — cas d’un site récent ou peu visité —, il affiche « Aucune donnée disponible ».",[117,369,370,375,376,379],{},[137,371,374],{"href":372,"rel":373},"https:\u002F\u002Fdevelopers.google.com\u002Fspeed\u002Fdocs\u002Finsights\u002Fv5\u002Fabout?hl=fr",[233],"PageSpeed Insights"," montre d’abord les données réelles de l’adresse testée, ou de tout le site si elle manque de visites : l’évaluation est réussie si les trois indicateurs sont bons, ou le LCP et le CLS faute de données sur l’INP. Plus bas, la note sur 100 d’un test Lighthouse sert au diagnostic, pas au verdict. Ce test ne clique nulle part : il ne mesure pas l’INP, mais le ",[121,377,378],{},"Total Blocking Time"," (TBT), un indicateur voisin qui ne le remplace pas.",[117,381,382,383,388],{},"Dans les outils de développement de Chrome, enfin, le ",[137,384,387],{"href":385,"rel":386},"https:\u002F\u002Fdeveloper.chrome.com\u002Fdocs\u002Fdevtools\u002Fperformance\u002Foverview",[233],"panneau consacré aux performances"," affiche en direct le LCP de votre visite, en désignant l’élément retenu, et son CLS, puis l’INP dès que vous interagissez. Il peut aussi les comparer aux données réelles.",[142,390,392],{"id":391},"améliorer-le-lcp-afficher-plus-tôt-le-contenu-principal","Améliorer le LCP : afficher plus tôt le contenu principal",[117,394,395,396,401],{},"Le LCP se décompose en quatre temps, que ",[137,397,400],{"href":398,"rel":399},"https:\u002F\u002Fweb.dev\u002Farticles\u002Foptimize-lcp",[233],"le guide d’optimisation de web.dev"," invite à mesurer un par un :",[155,403,404,420],{},[158,405,406],{},[161,407,408,411,414,417],{},[164,409,410],{},"Étape",[164,412,413],{},"Ce qui se passe",[164,415,416],{},"Ce qui l’allonge souvent",[164,418,419],{},"Les leviers",[177,421,422,436,450,464],{},[161,423,424,427,430,433],{},[182,425,426],{},"1. Réponse du serveur",[182,428,429],{},"Le premier octet de la page arrive",[182,431,432],{},"Redirections, serveur lent, aucun cache",[182,434,435],{},"Cache de pages, CDN, moins de redirections",[161,437,438,441,444,447],{},[182,439,440],{},"2. Découverte",[182,442,443],{},"Le navigateur repère l’image principale",[182,445,446],{},"Image appelée par un script ou chargée en différé",[182,448,449],{},"Image dans le HTML, priorité haute",[161,451,452,455,458,461],{},[182,453,454],{},"3. Téléchargement",[182,456,457],{},"L’image arrive",[182,459,460],{},"Fichier lourd ou trop grand pour l’écran",[182,462,463],{},"Format récent, taille adaptée",[161,465,466,469,472,475],{},[182,467,468],{},"4. Affichage",[182,470,471],{},"L’élément apparaît à l’écran",[182,473,474],{},"Feuilles de style et scripts bloquants",[182,476,477],{},"Scripts différés, rendu côté serveur",[117,479,480,481,486],{},"Sur une page bien optimisée, la réponse du serveur et le téléchargement pèsent chacun environ 40 % du LCP, les deux autres temps moins de 10 % chacun. Sur les sites lents, la répartition est tout autre : dans ",[137,482,485],{"href":483,"rel":484},"https:\u002F\u002Fweb.dev\u002Fblog\u002Fcommon-misconceptions-lcp",[233],"une analyse des données réelles de Chrome",", mise à jour en août 2024, pour le site médian au LCP médiocre (LCP sur une image, valeurs au 75ᵉ centile), le premier octet arrivait après 2,27 secondes et le navigateur attendait encore 1,29 seconde avant de commencer à télécharger l’image… qui n’a ensuite demandé que 350 millisecondes. Compresser l’image ne ferait gagner qu’une partie de ces 350 millisecondes : il faut d’abord accélérer la réponse du serveur et faire découvrir l’image plus tôt.",[117,488,489],{},"L’image principale doit donc figurer dans le HTML, avec ses dimensions et une priorité haute, sans chargement différé :",[491,492,497],"pre",{"className":493,"code":495,"language":496},[494],"language-text","\u003C!-- L’image principale : dans le HTML, prioritaire,\n     dimensions déclarées, sans loading=\"lazy\" -->\n\u003Cimg src=\"\u002Fimages\u002Faccueil.avif\" width=\"1600\" height=\"900\"\n     fetchpriority=\"high\" alt=\"La salle du restaurant, côté Loire\">\n","text",[498,499,495],"code",{"__ignoreMap":500},"",[117,502,503,504,507],{},"Réservez ",[498,505,506],{},"fetchpriority=\"high\""," à une ou deux images au plus ; une image appelée par la feuille de style ou par un script se signale plus tôt avec une balise de préchargement. Côté serveur, des pages générées à l’avance sont servies sans calcul : c’est l’une des raisons pour lesquelles nous recommandons un site statique pour un site vitrine.",[142,509,511],{"id":510},"améliorer-linp-répondre-vite-à-chaque-geste","Améliorer l’INP : répondre vite à chaque geste",[117,513,514,515,520],{},"Entre le geste et la réponse, trois délais s’additionnent : l’attente avant que le navigateur ne s’occupe du geste, l’exécution des scripts qui y répondent, puis l’affichage de la nouvelle image. Tous trois dépendent du fil principal du navigateur, qui exécute aussi les scripts de la page : un travail qui l’occupe plus de 50 millisecondes y forme une ",[137,516,519],{"href":517,"rel":518},"https:\u002F\u002Fweb.dev\u002Farticles\u002Foptimize-long-tasks",[233],"« tâche longue »",", pendant laquelle le geste du visiteur attend.",[117,522,523],{},"Les leviers :",[270,525,526,532,538,544,550],{},[273,527,528,531],{},[225,529,530],{},"Charger moins de JavaScript au démarrage",", y compris celui des services tiers (chat, widgets d’avis, balises marketing), qui s’exécute souvent sur le même fil que vos boutons.",[273,533,534,537],{},[225,535,536],{},"Découper les tâches longues"," pour rendre la main au navigateur, qui peut alors traiter un clic en attente.",[273,539,540,543],{},[225,541,542],{},"Montrer la réaction d’abord"," — bouton enfoncé, indicateur de chargement —, puis faire le travail moins urgent.",[273,545,546,549],{},[225,547,548],{},"Garder une page légère"," : plus elle contient d’éléments, plus chaque mise à jour de l’affichage coûte.",[273,551,552,555,556,265],{},[225,553,554],{},"Animer en CSS"," plutôt qu’en JavaScript, comme l’explique ",[137,557,559],{"href":558},"\u002Fjournal\u002Fanimations-site-web-utiles-ou-nuisibles","notre article sur le coût caché des animations",[117,561,562,563,568],{},"Pour vérifier, interagissez avec la page pendant son chargement : c’est souvent là que le fil principal est le plus occupé, rappelle ",[137,564,567],{"href":565,"rel":566},"https:\u002F\u002Fweb.dev\u002Farticles\u002Foptimize-inp",[233],"le guide de web.dev pour optimiser l’INP",". Ralentissez aussi le processeur dans les outils de développement de Chrome : leur panneau des performances liste chaque interaction enregistrée.",[142,570,572],{"id":571},"améliorer-le-cls-une-page-qui-ne-bouge-pas","Améliorer le CLS : une page qui ne bouge pas",[117,574,575,576,581],{},"Chaque décalage reçoit un score : la part de l’écran touchée, multipliée par la distance parcourue. Dans l’exemple de ",[137,577,580],{"href":578,"rel":579},"https:\u002F\u002Fweb.dev\u002Farticles\u002Fcls",[233],"la documentation du CLS",", un bloc qui occupe la moitié de l’écran et descend d’un quart de la hauteur de l’écran touche 75 % de la surface, sur 25 % de distance : 0,75 × 0,25 = 0,1875, soit déjà plus que le seuil de 0,1.",[117,583,584,585,590],{},"Les causes fréquentes ont chacune leur parade, détaillée dans ",[137,586,589],{"href":587,"rel":588},"https:\u002F\u002Fweb.dev\u002Farticles\u002Foptimize-cls",[233],"le guide d’optimisation du CLS"," :",[270,592,593,599,605,616,622],{},[273,594,595,598],{},[225,596,597],{},"Images et vidéos sans dimensions"," : déclarez leur largeur et leur hauteur, ou un rapport d’aspect en CSS.",[273,600,601,604],{},[225,602,603],{},"Publicités, vidéos et cartes intégrées"," : réservez leur place dès le départ, sans la refermer s’il n’y a rien à afficher.",[273,606,607,610,611,615],{},[225,608,609],{},"Contenus insérés en haut de page après l’affichage"," — bandeau promotionnel, formulaire, alerte : réservez leur place, ou affichez-les en surimpression ou plus bas dans la page. Les bandeaux cookies en sont un cas fréquent : ",[137,612,614],{"href":613},"\u002Fjournal\u002Fbandeau-cookies-regles-cnil","notre guide du bandeau cookies conforme à la CNIL"," montre comment l’afficher sans décaler la page.",[273,617,618,621],{},[225,619,620],{},"Polices web"," : une police de secours aux proportions ajustées évite que le texte ne bouge à l’arrivée de la police définitive.",[273,623,624,627,628,631],{},[225,625,626],{},"Animations de position ou de taille"," : animez plutôt ",[498,629,630],{},"transform",", qui ne décale pas la mise en page.",[117,633,634,635,638],{},"Enfin, un test Lighthouse ne voit pas un décalage provoqué après le chargement, au défilement par exemple ; les données réelles, si. Et une page compatible avec le cache de navigation (",[121,636,637],{},"back\u002Fforward cache",") revient intacte, sans nouveau décalage, quand le visiteur clique sur « Précédent ».",[142,640,642],{"id":641},"core-web-vitals-et-référencement-ce-quil-faut-en-attendre","Core Web Vitals et référencement : ce qu’il faut en attendre",[117,644,645,646,651],{},"Google est clair sur le principe : ",[137,647,650],{"href":648,"rel":649},"https:\u002F\u002Fdevelopers.google.com\u002Fsearch\u002Fdocs\u002Fappearance\u002Fpage-experience?hl=fr",[233],"les Core Web Vitals sont utilisés par ses systèmes de classement",", alors que les autres aspects de l’expérience de page n’aident pas directement à mieux se classer. Il l’est tout autant sur les limites : il n’existe pas de signal unique d’expérience de page, Google cherche toujours à afficher le contenu le plus pertinent, même si l’expérience est médiocre, et de bons résultats dans la Search Console ne garantissent pas d’apparaître en tête des résultats.",[117,653,654],{},"Concrètement :",[270,656,657,663,669],{},[273,658,659,662],{},[225,660,661],{},"Un départage, pas un raccourci."," Quand beaucoup de pages répondent aussi bien à une recherche, une bonne expérience peut faire la différence, selon Google ; elle ne compense pas un contenu moins utile.",[273,664,665,668],{},[225,666,667],{},"Une évaluation surtout page par page",", avec quelques évaluations à l’échelle du site : corrigez d’abord les modèles de pages qui comptent.",[273,670,671,674],{},[225,672,673],{},"Pas de score parfait à poursuivre"," : pour Google, viser la note maximale pour le seul SEO n’est pas forcément le meilleur usage de votre temps.",[117,676,677,678,682,683,687,688,691],{},"Si votre site n’apparaît pas du tout dans Google, la vitesse est rarement en cause : cherchez d’abord ",[137,679,681],{"href":680},"\u002Fjournal\u002Fpourquoi-mon-site-n-apparait-pas-sur-google","pourquoi vos pages ne sont pas indexées",". Une chute brutale de trafic s’explique, elle aussi, rarement par des indicateurs calculés sur 28 jours : ",[137,684,686],{"href":685},"\u002Fjournal\u002Fbaisse-de-trafic-google-trouver-la-cause","notre méthode de diagnostic d’une baisse de trafic sur Google"," passe les pistes en revue. Enfin, la performance n’est qu’un chantier de ",[137,689,690],{"href":48},"notre accompagnement en référencement naturel",", aux côtés des contenus, du maillage et de la visibilité locale.",[142,693,695],{"id":694},"ce-qui-évolue-les-navigations-douces","Ce qui évolue : les navigations « douces »",[117,697,698,699,702,703,708],{},"Sur les sites conçus comme des applications, JavaScript change le contenu et l’adresse sans recharger la page : c’est une navigation « douce » (",[121,700,701],{},"soft navigation","). Un site Nuxt, la technologie que nous utilisons, fonctionne ainsi après la première page. Jusqu’ici, CrUX n’enregistrait que le premier chargement et lui rattachait tous les clics et décalages de la visite. Chrome 151, sorti en juillet 2026, sait désormais les détecter, et ",[137,704,707],{"href":705,"rel":706},"https:\u002F\u002Fweb.dev\u002Fblog\u002Fcrux-experimental-soft-navs",[233],"depuis la publication de CrUX d’octobre 2026",", annoncée le 13 octobre, des versions expérimentales des trois indicateurs en tiennent compte.",[117,710,711],{},"Pour la plupart des sites, les valeurs ne bougent pas ou presque : seuls 7 à 11 % des origines (en pratique, des sites) utilisent ces navigations pour plus de la moitié de leurs pages vues. Pour les autres, l’écart est net : sur Android, parmi les sites dont 75 à 100 % des navigations sont douces, la part de ceux qui ont un bon LCP passe de 26 % à 87 %. Ces sites ne sont pas plus rapides pour autant : sur tout site, les pages suivantes réutilisent ce qui a déjà été téléchargé.",[117,713,714,715,720],{},"Pendant cette évaluation, ni les scores officiels ni la Search Console ne changent ; Google vise une sortie de la phase expérimentale en mai 2027, sous réserve des retours, après quoi la Search Console passera à ces nouvelles données. Les seuils, eux, n’ont pas bougé : ce sont toujours ceux de web.dev et de l’aide de la Search Console. Google s’engage d’ailleurs à ne modifier les Core Web Vitals stables qu’une fois par an au plus, avec préavis (",[137,716,719],{"href":717,"rel":718},"https:\u002F\u002Fweb.dev\u002Farticles\u002Fvitals",[233],"cycle de vie des indicateurs",") : méfiez-vous des « nouveaux seuils » annoncés sans source officielle.",[142,722,724],{"id":723},"par-où-commencer","Par où commencer ?",[726,727,728,734,740,746],"ol",{},[273,729,730,733],{},[225,731,732],{},"Ouvrez le rapport Core Web Vitals"," de la Search Console et repérez, sur mobile comme sur ordinateur, les groupes de pages en échec et l’indicateur en cause. Sans données réelles, testez directement vos pages clés.",[273,735,736,739],{},[225,737,738],{},"Testez une adresse type"," de chaque groupe dans PageSpeed Insights, puis dans les outils de développement de Chrome.",[273,741,742,745],{},[225,743,744],{},"Corrigez d’abord ce qui touche le plus de pages"," — un modèle de pages avant une page isolée —, en vérifiant chaque correctif en laboratoire.",[273,747,748,751],{},[225,749,750],{},"Attendez quatre semaines"," avant de juger sur les données réelles.",[117,753,754,755,758],{},"Vous préférez confier ce diagnostic ? ",[137,756,757],{"href":56},"Notre service d’optimisation des Core Web Vitals"," part des données réelles de vos visiteurs, classe les correctifs par gain attendu et vérifie le résultat 28 jours plus tard.",{"title":500,"searchDepth":26,"depth":26,"links":760},[761,762,763,764,765,766,767,768,769],{"id":144,"depth":19,"text":145},{"id":255,"depth":19,"text":256},{"id":293,"depth":19,"text":294},{"id":391,"depth":19,"text":392},{"id":510,"depth":19,"text":511},{"id":571,"depth":19,"text":572},{"id":641,"depth":19,"text":642},{"id":694,"depth":19,"text":695},{"id":723,"depth":19,"text":724},null,"2026-11-04","Core Web Vitals : ce que mesurent le LCP, l’INP et le CLS, les seuils de Google, comment tester votre site et améliorer chaque indicateur, sans jargon.","md",[775,778,781,784],{"question":776,"answer":777},"L’INP a remplacé le FID : qu’est-ce que cela change ?","Le FID ne mesurait que la première interaction d’une visite, et seulement l’attente avant que le navigateur commence à la traiter. L’INP observe tous les clics, touchers et frappes au clavier, jusqu’à l’affichage de la réponse à l’écran : il est donc plus exigeant. Il est devenu un Core Web Vital le 12 mars 2024 : le FID a alors quitté la Search Console, puis PageSpeed Insights et le rapport CrUX, qui ont cessé de le fournir le 9 septembre 2024. Un audit qui parle encore de FID s’appuie donc sur des repères dépassés.",{"question":779,"answer":780},"Pourquoi mes Core Web Vitals sont bons sur ordinateur mais pas sur mobile ?","Les seuils sont les mêmes, mais les deux types d’appareils sont mesurés séparément, et un téléphone dispose souvent de bien moins de puissance qu’un ordinateur, avec une connexion plus variable. Le JavaScript s’y exécute plus lentement, ce qui pèse sur l’INP comme sur le LCP. Un site vérifié seulement sur l’ordinateur de son prestataire peut donc décevoir sur le terrain : testez-le sur un téléphone d’entrée de gamme, ou ralentissez le processeur dans les outils de développement de Chrome.",{"question":782,"answer":783},"Les Core Web Vitals tiennent-ils compte des visiteurs sur iPhone ?","Pas dans les données de Google. Le rapport CrUX, qui alimente la Search Console et PageSpeed Insights, ne retient que des utilisateurs de Chrome, et Chrome sur iPhone en est exclu, car il repose sur le moteur de Safari. Depuis Safari 26.2, sorti le 12 décembre 2025, le LCP et l’INP sont toutefois mesurables dans tous les grands navigateurs : un outil de mesure installé sur votre site peut donc les relever chez vos visiteurs sur iPhone. Le CLS, lui, reste propre aux navigateurs basés sur Chromium, comme Chrome ou Edge.",{"question":785,"answer":786},"Combien de temps faut-il pour voir une amélioration dans la Search Console ?","Comptez environ un mois. Les valeurs du rapport portent sur les 28 derniers jours de visites : une correction mise en ligne aujourd’hui ne pèse d’abord que sur une petite partie de la période. Le bouton « Démarrer le suivi » lance une surveillance de 28 jours, au terme de laquelle le problème est considéré comme résolu si plus aucune URL ne le présente ; il ne déclenche ni réindexation ni autre action de Google. Les tests en laboratoire, eux, montrent l’effet d’un correctif immédiatement.",false,"Core Web Vitals",{},true,"\u002Fjournal\u002Fcore-web-vitals-lcp-inp-cls","seo-visibilite-locale",{"title":794,"description":772},"Core Web Vitals : LCP, INP et CLS expliqués",[796,797],"optimisation-vitesse-site-web-nantes","referencement-naturel-seo-nantes",{"loc":791,"lastmod":771},"journal\u002Fcore-web-vitals-lcp-inp-cls","La page s’affiche-t-elle vite, réagit-elle tout de suite, reste-t-elle stable ? Le LCP, l’INP et le CLS répondent à ces trois questions : voici comment Google les mesure, comment les tester et par où commencer pour les améliorer.","ZFAP6TiBtEdBLoF7q7zxguEms-BVxvv6olK2kmByYhM",{"rubrique":803,"author":805,"articles":815,"surround":966},{"path":94,"title":95,"navTitle":96,"color":52,"promise":804,"service":797},"Apparaître là où vos clients cherchent : Google, Maps et, désormais, les moteurs de réponse IA.",{"id":806,"avatar":770,"bio":807,"extension":808,"kind":809,"linkedin":770,"meta":810,"name":811,"role":812,"stem":813,"__hash__":814},"auteurs\u002Fauteurs\u002Fequipe-fogg.yml","Nous concevons, développons et référençons des sites internet dans notre studio à Nantes : le design, le code et le SEO sont faits par la même équipe. Dans notre journal, nous partageons ce que nos projets nous apprennent, sans jargon ni recette miracle.","yml","Organization",{},"L’équipe FOGG","Designers et développeurs web à Nantes","auteurs\u002Fequipe-fogg","meeZrKeERqL_z9wDxs9-KEBQVU-S_fJG72JEtKhFKbQ",[816,822,828,833,837,844,852,854,861,867,871,876,881,887,893,899,905,911,917,923,929,935,941,948,954,960],{"path":558,"title":817,"summary":818,"date":771,"rubrique":819,"services":820},"Animations sur un site web : utiles ou nuisibles ?","Certaines animations guident vos visiteurs, d’autres ralentissent la page, les distraient ou leur donnent le vertige. Voici nos critères pour faire le tri, les règles d’accessibilité à connaître et la façon d’animer sans alourdir votre site.","ux-contenus-accessibilite",[821,796],"webdesign-ux-ui-nantes",{"path":823,"title":824,"summary":825,"date":771,"rubrique":819,"services":826},"\u002Fjournal\u002Farborescence-site-web-methode-et-exemples","Arborescence d’un site web : la méthode, avec des exemples","Avant de dessiner la moindre page, il faut décider lesquelles existent et comment elles s’emboîtent. Voici notre méthode pour construire l’arborescence d’un site, avec trois exemples commentés et deux façons simples de la tester.",[821,827],"creation-site-vitrine-nantes",{"path":685,"title":829,"summary":830,"date":771,"rubrique":792,"services":831},"Baisse de trafic sur Google : comment en trouver la cause","Mesure faussée, erreur technique, mise à jour de Google, Aperçus IA ou simple saisonnalité : voici comment trouver la cause d’une baisse de trafic Google, dans l’ordre, et quoi faire ensuite.",[797,832],"maintenance-site-internet-nantes",{"path":613,"title":834,"summary":835,"date":771,"rubrique":819,"services":836},"Bandeau cookies : les règles de la CNIL à respecter en 2026","Refuser aussi simplement qu’accepter, expliquer les finalités, conserver le choix : voici ce que la CNIL attend d’un bandeau cookies en 2026, ce qui a changé cette année et comment le rendre accessible sans ralentir votre site.",[832,821],{"path":838,"title":839,"summary":840,"date":771,"rubrique":841,"services":842},"\u002Fjournal\u002Fbouton-de-retractation-obligatoire","Bouton de rétractation obligatoire : ce qui change depuis le 19 juin 2026","Depuis le 19 juin 2026, une boutique en ligne doit permettre à ses clients particuliers d’exercer leur droit de rétractation depuis le site, par un bouton « renoncer au contrat ici ». Voici ce que disent les textes, qui est concerné et comment l’intégrer sans alourdir votre parcours.","design-conversion-ecommerce",[843,832],"creation-site-e-commerce-nantes",{"path":845,"title":846,"summary":847,"date":771,"rubrique":848,"services":849},"\u002Fjournal\u002Fci-cd-pipeline-de-deploiement","CI\u002FCD, c’est quoi ? Le pipeline de déploiement expliqué","Intégration continue, livraison ou déploiement continus : ce que recouvre la CI\u002FCD, à quoi ressemble un pipeline pour un site ou une application, ce que votre entreprise y gagne et comment le sécuriser.","projet-web-budget-methode",[850,851],"infrastructure-cloud-nantes","developpement-web-sur-mesure-nantes",{"path":791,"title":111,"summary":800,"date":771,"rubrique":792,"services":853},[796,797],{"path":855,"title":856,"summary":857,"date":771,"rubrique":848,"services":858},"\u002Fjournal\u002Feco-conception-web-rgesn","Éco-conception web : ce que demande le RGESN","Le référentiel officiel de l’éco-conception web compte 78 critères, mais aucune loi n’oblige une entreprise à l’appliquer. Voici ce qu’il demande vraiment à un site vitrine ou à une boutique, et comment fixer un budget de poids, mesurer sans se tromper et publier sa déclaration.",[859,860],"eco-conception-web-nantes","refonte-site-internet-nantes",{"path":862,"title":863,"summary":864,"date":771,"rubrique":848,"services":865},"\u002Fjournal\u002Fn8n-make-zapier-quel-outil-d-automatisation","n8n, Make ou Zapier : quel outil pour automatiser vos tâches ?","Zapier pour démarrer sans technicien, Make pour les flux qui se ramifient, n8n pour garder la main sur vos données : ce qui distingue vraiment ces trois outils, de la facturation à la maintenance, prix relevés le 4 novembre 2026.",[866,851],"automatisation-processus-nantes",{"path":680,"title":868,"summary":869,"date":771,"rubrique":792,"services":870},"Pourquoi mon site n’apparaît pas sur Google ? Causes et solutions","Site trop récent, réglage qui bloque Google, page explorée mais non retenue, classement trop faible : voici comment trouver la cause avec deux outils gratuits, puis la corriger.",[797,827],{"path":872,"title":873,"summary":874,"date":771,"rubrique":848,"services":875},"\u002Fjournal\u002Fpreparer-son-site-au-black-friday","Préparer son site au Black Friday : tenir le pic de trafic","Estimer le pic, le simuler, mettre en cache, prévoir la montée en charge et organiser le jour J : la méthode pour que votre boutique tienne au moment où elle vend le plus, avec un plan sur trois semaines.",[850,843],{"path":877,"title":878,"summary":879,"date":771,"rubrique":841,"services":880},"\u002Fjournal\u002Fsite-vitrine-ou-site-e-commerce","Site vitrine ou site e-commerce : comment choisir ?","Un site vitrine prépare la vente, une boutique en ligne la conclut. Voici comment choisir selon votre offre, votre budget et votre temps, et quelles solutions existent entre les deux.",[827,843],{"path":882,"title":883,"summary":884,"date":771,"rubrique":848,"services":885},"\u002Fjournal\u002Fsite-wordpress-pirate-que-faire","Site WordPress piraté : que faire dans les premières heures ?","Redirections, pages de spam, alerte de Google : quand un site WordPress est piraté, les premières heures comptent. Voici quoi faire, dans l’ordre, et ce qu’il ne faut surtout pas effacer.",[886,832],"audit-securite-site-web-nantes",{"path":888,"title":889,"summary":890,"date":891,"rubrique":848,"services":892},"\u002Fjournal\u002Fchoisir-son-agence-web-a-nantes","Choisir son agence web à Nantes : 12 questions à poser avant de signer","Portfolio, prix, bon contact : ces critères ne suffisent pas. Douze questions révèlent comment une agence travaille vraiment et ce que vous posséderez à la fin.","2026-10-29",[827],{"path":894,"title":895,"summary":896,"date":897,"rubrique":841,"services":898},"\u002Fjournal\u002Fshopify-woocommerce-prestashop-quelle-solution-choisir","Shopify, WooCommerce ou PrestaShop : quelle solution choisir ?","Trois solutions sérieuses, trois logiques différentes : voici comment comparer coûts, souplesse et propriété des données pour choisir la vôtre sans regret.","2026-10-27",[843],{"path":900,"title":901,"summary":902,"date":903,"rubrique":819,"services":904},"\u002Fjournal\u002Frediger-les-textes-de-son-site-internet","Rédiger le contenu d’un site internet : être compris en cinq secondes","Un visiteur décide en quelques secondes s’il reste sur votre page. Voici la méthode que nous suivons pour écrire des textes de site clairs, utiles et bien référencés, avec un exemple avant\u002Faprès.","2026-10-24",[821,827],{"path":906,"title":907,"summary":908,"date":909,"rubrique":792,"services":910},"\u002Fjournal\u002Freferencement-local-nantes-google-business-profile","Référencement local à Nantes : guide pour apparaître dans Google Maps","Pertinence, distance, notoriété : Google classe les entreprises locales selon trois critères. Voici comment les travailler quand vos clients sont à Nantes.","2026-10-22",[797],{"path":912,"title":913,"summary":914,"date":915,"rubrique":848,"services":916},"\u002Fjournal\u002Fdevis-site-internet-comparer-deux-propositions","Devis de site internet : comment comparer deux propositions","Deux devis pour le même site, deux montants qui vont du simple au double : avant de choisir le moins cher, vérifiez qu’ils décrivent bien le même projet.","2026-10-20",[827,860],{"path":918,"title":919,"summary":920,"date":921,"rubrique":841,"services":922},"\u002Fjournal\u002Fsite-vitrine-elements-indispensables","Site vitrine efficace : les 10 éléments qui transforment une visite en contact","Un site vitrine n’a qu’une mission : donner envie de vous contacter. Voici les dix éléments qui font la différence, et comment vérifier ceux de votre site.","2026-10-17",[827,821],{"path":924,"title":925,"summary":926,"date":927,"rubrique":819,"services":928},"\u002Fjournal\u002Fmaquette-prototype-design-system-etapes-du-webdesign","Zoning, wireframe, maquette de site web, prototype : les étapes du webdesign","Entre la première réunion et la mise en ligne, un site passe par plusieurs états : zoning, maquettes, prototype, design system. À quoi sert chaque étape, que validez-vous, et pourquoi c’est là que se font les vraies économies.","2026-10-15",[821],{"path":930,"title":931,"summary":932,"date":933,"rubrique":792,"services":934},"\u002Fjournal\u002Fseo-ia-etre-cite-par-les-moteurs-de-reponse","SEO et IA : comment apparaître dans ChatGPT et les Aperçus IA","Aperçus IA, Mode IA, ChatGPT ou Perplexity citent leurs sources. Voici ce qui aide vraiment un site à en faire partie, documentation officielle à l’appui.","2026-10-13",[797],{"path":936,"title":937,"summary":938,"date":939,"rubrique":848,"services":940},"\u002Fjournal\u002Fmaintenance-site-internet-que-prevoir","Maintenance de site internet : que prévoir après la mise en ligne ?","Un site n’est pas terminé le jour de sa mise en ligne. Voici ce qu’il faut prévoir pour qu’il reste sûr, rapide et bien référencé, et comment s’organiser.","2026-10-10",[832],{"path":942,"title":943,"summary":944,"date":945,"rubrique":819,"services":946},"\u002Fjournal\u002Feuropean-accessibility-act-ce-qui-change-pour-votre-site","European Accessibility Act : ce que la loi sur l’accessibilité numérique change pour votre site","Depuis le 28 juin 2025, l’accessibilité est obligatoire pour de nombreux services en ligne, à commencer par la vente aux particuliers. Qui est concerné, quelles règles appliquer, quels risques, et par où commencer.","2026-10-08",[947,843],"accessibilite-numerique-nantes",{"path":949,"title":950,"summary":951,"date":952,"rubrique":848,"services":953},"\u002Fjournal\u002Fcahier-des-charges-site-internet-en-une-page","Cahier des charges de site internet : un modèle en une page","Inutile d’écrire quarante pages : un cahier des charges d’une seule page, honnête et précis, suffit à cadrer un site vitrine et à obtenir des devis comparables.","2026-10-06",[827,851],{"path":955,"title":956,"summary":957,"date":958,"rubrique":841,"services":959},"\u002Fjournal\u002Ffiche-produit-e-commerce-qui-vend","Fiche produit e-commerce : l’anatomie d’une page qui vend","Titre, photos, prix, avis, bouton d’achat : chaque bloc d’une fiche produit répond à une question de l’acheteur. Voici comment les assembler pour qu’elle vende.","2026-10-03",[843,821],{"path":961,"title":962,"summary":963,"date":964,"rubrique":792,"services":965},"\u002Fjournal\u002Frefonte-site-sans-perdre-son-referencement","Refonte de site et SEO : comment ne pas perdre son référencement","Une refonte mal préparée peut faire perdre une bonne partie du trafic venu de Google. Inventaire, redirections, préproduction, suivi : la méthode pour l’éviter.","2026-10-01",[860,797],[967,970],{"title":846,"path":845,"stem":968,"description":969,"children":-1},"journal\u002Fci-cd-pipeline-de-deploiement","CI\u002FCD, c’est quoi ? Nous expliquons sans jargon l’intégration, la livraison et le déploiement continus, la préproduction, les indicateurs DORA et la sécurité.",{"title":856,"path":855,"stem":971,"description":972,"children":-1},"journal\u002Feco-conception-web-rgesn","Éco-conception web : ce que demande le RGESN, s’il est obligatoire, comment fixer un budget de poids, mesurer sans se tromper et rédiger sa déclaration.",{"path":56,"title":57,"summary":59,"color":39},1793879329105]