{"id":1338,"date":"2022-01-31T16:48:12","date_gmt":"2022-01-31T16:48:12","guid":{"rendered":"https:\/\/ursa.marketing\/?p=1338"},"modified":"2024-09-18T13:49:17","modified_gmt":"2024-09-18T13:49:17","slug":"guide-doptimisation-de-la-performance-dun-site-web","status":"publish","type":"post","link":"https:\/\/ursa.marketing\/fr\/guide-doptimisation-de-la-performance-dun-site-web\/","title":{"rendered":"Guide d\u2019optimisation de la performance d\u2019un site web"},"content":{"rendered":"

\u00c0 la base de toute strat\u00e9gie de marketing num\u00e9rique, un site web se doit de r\u00e9pondre \u00e0 des requis de performance tr\u00e8s pr\u00e9cis pour obtenir des r\u00e9sultats et du r\u00e9f\u00e9rencement sur les moteurs de recherche. En effet, Google a comme mission de classer les sites en fonction de leur pertinence et de leur accessibilit\u00e9, afin que les utilisateurs puissent avoir acc\u00e8s facilement \u00e0 l\u2019information recherch\u00e9e.\u00a0<\/span><\/p>\n

Or, en juin 2021, le g\u00e9ant Google a annonc\u00e9 que son algorithme de classement prendrait maintenant en compte les <\/span>Core Web Vitals <\/span><\/i>(signaux web essentiels). Concr\u00e8tement, cela impacte directement le positionnement SEO d\u2019un site web si celui-ci ne se classe pas dans les crit\u00e8res de classement du moteur de recherche.<\/span><\/p>\n

Dans cet article, nous vous donnons la cl\u00e9 pour g\u00e9n\u00e9rer des r\u00e9sultats significatifs aux yeux des moteurs de recherche gr\u00e2ce \u00e0 nos requis li\u00e9s aux objectifs de performance et aux fonctionnalit\u00e9s d\u2019un site web.<\/span><\/p>\n

Notre r\u00e8gle d\u2019or : avoir du bon contenu dans un bon contenant!<\/b><\/p>\n

\"du<\/p>\n

<\/h2>\n

Performance : <\/span>Core Web Vitals<\/span><\/i><\/h2>\n

 <\/p>\n

L\u2019optimisation de la qualit\u00e9 de l\u2019exp\u00e9rience utilisateur sur un site web est sans aucun doute l\u2019\u00e9l\u00e9ment le plus important contribuant au succ\u00e8s de celui-ci.<\/span><\/p>\n

Google offre des outils pour mesurer les performances des pages dans le but d\u2019optimiser l\u2019exp\u00e9rience utilisateur \u00e0 son plus haut potentiel. Ces outils fournissent de l\u2019information sur les m\u00e9triques essentielles \u00e0 toute exp\u00e9rience web\u00a0: les <\/span>Core Web Vitals<\/span><\/i> (litt\u00e9ralement les m\u00e9triques vitales du web).<\/span><\/p>\n

Les <\/span>Core Web Vitals<\/span><\/i> sont repr\u00e9sent\u00e9es par ces trois facteurs cl\u00e9s de l\u2019exp\u00e9rience utilisateur :<\/span><\/p>\n

\"core<\/p>\n

 <\/p>\n

 <\/p>\n

Largest Contentful Paint<\/i><\/b> (LCP)<\/b><\/em><\/p>\n

Elle mesure les performances du chargement d\u2019une page web en \u00e9valuant le temps de chargement n\u00e9cessaire pour afficher les \u00e9l\u00e9ments principaux sur l\u2019\u00e9cran de l\u2019utilisateur. <\/span>Nous recommandons qu\u2019il soit inf\u00e9rieur \u00e0<\/b> 2,5 secondes <\/b>suivant le d\u00e9but du chargement de la page.<\/span><\/p>\n

Interaction to Next Paint (INP)<\/i><\/b><\/p>\n

Elle \u00e9value la r\u00e9activit\u00e9 globale d\u2019une page aux interactions des utilisateurs en observant le d\u00e9lai n\u00e9cessaire pour r\u00e9pondre \u00e0 toutes les interactions (clic, appui et commandes au clavier) survenant au cours de la visite d\u2019un utilisateur sur la page. <\/span>Nous recommandons un r\u00e9sultat inf\u00e9rieur \u00e0<\/b> 2<\/strong>00 millisecondes.<\/b><\/p>\n

Cumulative Layout Shift<\/i><\/b>\u00a0 (CLS)<\/em><\/b><\/p>\n

Elle mesure la stabilit\u00e9 visuelle d\u2019une page web en analysant les changements de mise en page subis par les internautes. <\/span>Nous recommandons un r\u00e9sultat inf\u00e9rieur \u00e0 0,1<\/b>, voire le plus pr\u00e8s possible de 0.<\/span><\/p>\n

Bien que les <\/span>Core Web Vitals<\/span><\/i> soient les mesures essentielles \u00e0 prendre en consid\u00e9ration, nous conseillons de tenir \u00e9galement compte d\u2019autres mesures de performance, afin d\u2019atteindre un niveau de performance optimal.\u00a0<\/span><\/p>\n

Ces mesures sont\u00a0: <\/span>First Contentful Paint, Speed Index, Time to Interactive, Total Blocking Time <\/span><\/i>et<\/span> Time to First Byte. <\/span><\/i>Nos requis pour celles-ci sont \u00e9num\u00e9r\u00e9s dans le tableau suivant.<\/span><\/p>\n

\"Google<\/p>\n

 <\/p>\n

 <\/p>\n

Nos outils favoris pour la mesure de performance<\/span><\/h2>\n

Chez Ursa Marketing, nous avons quelques outils indispensables \u00e0 la mesure de performance des sites. Voici nos deux incontournables\u00a0:<\/span><\/p>\n


\n<\/span>Google PageSpeed Insights\u00a0 \u00a0 \u00a0 \"Google<\/strong><\/p>\n

Requis : 80% mobile, 90% ordinateur (<\/span>desktop<\/span><\/i>)<\/span><\/p>\n

Google PageSpeed Insights<\/b><\/a> est un outil permettant de tester la performance d\u2019une page web et de lister les points d\u2019am\u00e9lioration pour celle-ci \u00e0 l\u2019aide de recommandations techniques.<\/span><\/p>\n

Google Tag Manager\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 <\/strong>\"Google<\/p>\n

Google Tag Manager<\/b><\/a> (GTM)<\/span> est un <\/span>syst\u00e8me de gestion de balises<\/span><\/a> pour mettre \u00e0 jour rapidement et facilement les outils de mesure de performance et de suivi.<\/span><\/p>\n

Le syst\u00e8me de gestion du contenu (CMS) doit permettre la mise en place des balises n\u00e9cessaires pour l\u2019installation de GTM.<\/span><\/p>\n

Un seul conteneur doit \u00eatre install\u00e9 sur un site web. Si la solution CMS du fournisseur web d\u00e9pend d\u2019un conteneur existant, un acc\u00e8s administrateur doit \u00eatre partag\u00e9 avec le client et les deux parties devraient cohabiter dans le m\u00eame conteneur.<\/span><\/p>\n


\nL\u2019utilisation de la couche de donn\u00e9es GTM\u00a0<\/b><\/p>\n

Pour la mesure de conversion, chaque interacti<\/span>on importante d\u2019un<\/span> visiteur sur le site devrait \u00eat<\/span>re envoy\u00e9e s<\/span>ous forme<\/span> d\u2019\u00e9v\u00e9nement<\/span> dans la couche de donn\u00e9es de GTM (DataLayer).\u00a0<\/span><\/p>\n

Lorsque c\u2019est possible, il faut au<\/span>ssi transmettre les<\/span> d\u00e9tails sur le contexte. Par exemple, si l\u2019on consulte un v\u00e9hicule, son identifiant doit aussi <\/span>\u00eatre envoy\u00e9 dans<\/span> la couche de donn\u00e9es.\u00a0<\/span><\/p>\n

Voici quelques exemples d\u2019interac<\/span>tions importantes\u00a0:\u00a0<\/span><\/p>\n