Guide de l’optimisation de site web avec Cloudflare 2019
Guide d’optimisation Tout en Un avec Integration Cloudflare 2019 pour accélérer votre site web et augmenter la vitesse de chargement de votre page Web! Tout en un Guide d’optimisation pour votre CMS préféré avec Cloudflare. L’intégration est entièrement basée sur les meilleures pratiques applicables aux sites Web CMS, sites Web généraux et blogs au format HTML, en se concentrant principalement sur l’optimisation de votre site web pour les images, l’optimisation SEO pour le référencement, l’optimisation de votre site web pour les appareils mobiles, ainsi que différents types d’outils d’optimisation à partir de plugin GRATUITS disponibles sur Internet, les processus de correction et de test d’optimisation de site web, certains site web doivent posséder des enregistrements DNS/clé API pour réaliser les tests et des tonnes de conseils d’optimisation fondamentaux pour votre site web.
Toutefois, les résultats concernant la vitesse des sites Web sur serveur dédiés peuvent varier les uns des autres, mais ne vous inquiétez pas, vous constaterez une amélioration de la vitesse d’affichage en suivant nos recommandations. Indispensable, effectuer une sauvegarde est une pratique obligatoire à réaliser systématiquement avant d’apporter des modifications à votre site Web. Je vais aborder les raisons les plus importantes pour lesquelles le temps de chargement des pages de votre site Web est très avantageux pour votre entreprise. Les utilisateurs n’abandonneront pas votre site Web mais passeront plus de temps sur votre site.
Avant de creuser le sujet, nous aborderons les facteurs qui affectent le plus la vitesse de chargement d’un site web avec un aperçu général des statistiques des internautes. La toute première chose à savoir c’est que les internautes n’ont pas beaucoup de patience et le temps de chargement des pages est fondamental. C’est comme si nous cliquions sur un lien ou si nous entrions l’URL et attendions une seconde, deux, trois et c’est tout. Les statistiques de Google indiquent que 50% des utilisateurs s’attendent à ce qu’un site mobile se charge en 2 secondes et 53% sont susceptibles d’abandonner la page si le temps de chargement est supérieur à 3 secondes. C’est une très courte période, si l’on considère que le temps de chargement moyen d’une page d’accueil, sur un appareil mobile, est de 19 secondes (sur un réseau 3G). Les temps de chargement sur les ordinateurs de bureau ou les ordinateurs sont plus rapides et le temps de chargement moyen est de 5 secondes, mais cela reste trop long.
La sélection du bon hébergement est le facteur clé de votre site Web Web CMS et est donc un élément crucial, à ne pas négliger, même si vous avez déjà un hébergement. Passer à un meilleur fournisseur d’hébergement accélérera votre temps de chargement WordPress de plusieurs secondes. En général, avec des prix bas, vous obtenez des performances faibles et c’est ce que nous ne voulons pas. Voyons donc les options d’hébergement disponibles et expliquons les différences.
Si vous n’avez pas de site CMS, lisez le guide. Les principales techniques d’optimisation de la vitesse sont expliquées pas à pas dans ce guide et peuvent être appliquées à tout type de site Web.
Il est vrai que les temps de chargement varient pour diverses raisons, par exemple, la vitesse de l’internet du visiteur, son emplacement et la lourdeur ou la surabondance de notre site Web. Nous n’avons que très peu à faire en ce qui concerne la vitesse de l’internet, mais nous pouvons nous occuper d’autres aspects et améliorer l’expérience de chacun. Dans notre guide, nous verrons comment optimiser notre site Web WordPress pour plus de rapidité, de rapidité et de légèreté, alors commençons !
La base
Lorsqu’il est question de la vitesse de votre site Web le plus rapidement possible, nous devons le construire sur de bonnes bases ou de bonnes fondations. Tout comme vous construisez une maison, construire sur du sable mouvant équivaut à avoir des problèmes dès le début. Il faut construire sur des bases solides, de sorte que votre site Web durera longtemps et sans aucun problème. Les trois choses les plus importantes à vérifier sont :
- L’hébergement
- Le design
- Les plugins
Hébergement SaaS pour CMS
La sélection du bon hébergement est le facteur clé de votre site Web CMS et est donc un élément crucial, à ne pas négliger, même si vous avez déjà un hébergement. Passer à un meilleur fournisseur d’hébergement accélérera votre temps de chargement de votre CMS de plusieurs secondes. En général, avec des prix bas, vous obtenez des performances faibles et c’est ce que nous ne voulons pas. Voyons donc les options d’hébergement disponibles et expliquons les différences.
Hébergement mutualisé
C’est la solution d’hébergement la plus répandue car elle est peu coûteuse. Mais comme nous l’avons mentionné, avec des prix bas, vous obtenez une performance inférieure. Sur un hébergement partagé typique, il existe des milliers de comptes sur un serveur physique, ce qui signifie que les ressources du serveur sont partagées entre tous les sites Web créés par ces comptes d’hébergement.
La configuration du serveur des hôtes partagés est souvent très limitée et vous n’avez pas beaucoup de marge de manœuvre pour configurer selon vos besoins. Le serveur est préconfiguré spécifiquement, généralement très générique dans les paramètres, et il devrait exécuter votre CMS sans problème. Des problèmes surviennent plus tard lorsque, par exemple, faute de mémoire ou sous la forme d’une restriction des paramètres PHP, un plugin peut avoir besoin de fonctionner correctement.
Hébergement géré
Il s’agit maintenant d’une mise à niveau importante de l’hébergement partagé, car votre site Web dispose d’un espace plus important et de davantage de ressources, mais son coût est plus élevé. Sur l’hébergement géré, les serveurs sont moins peuplés, ce qui se traduit par davantage de ressources de serveur pour votre site. Ces serveurs sont généralement optimisés pour exécuter votre CMS de manière aussi fluide que possible. Ils disposent de plus de mémoire, de puissance de traitement, d’une sécurité accrue et d’un système de mise en cache dédié.
VPS ou serveurs dédiés
Avec les serveurs dédiés, vous avez le contrôle complet de l’ensemble du serveur avec toutes ses ressources et avec le VPS, vous obtenez une partie du serveur car vous partagez toujours la machine serveur physique avec d’autres. Lorsque nous parlons d’optimisation de la vitesse de la page pour votre CMS, il n’y a pas de limite côté serveur lorsque vous configurez votre CMS sur VPS ou sur un serveur dédié. Vous savez exactement combien de ressources sont disponibles pour votre site Web et vous pouvez le configurer à votre guise. Vous pouvez également mettre en œuvre des fonctionnalités et des technologies de pointe avant que les fournisseurs d’hébergement standard ne les prennent en charge (ce qui peut prendre plusieurs années de retard par rapport à la technologie logicielle du serveur).
Ces deux options offrent à présent un contrôle et des ressources optimal, mais elles se vendent également à des prix plus élevés et exigent des compétences techniques plus avancées pour les configurer et les entretenir à long terme. Les serveurs VPS ou dédiés peuvent également être gérés, vous n’avez donc pas besoin d’être administrateur de serveur pour cela. Ils s’appliquent principalement aux sites Web à fort trafic.
Si vous envisagez un hébergement en particulier, je vous suggérerais l’option d’hébergement géré de votre CMS, qui devrait également pouvoir être mise à l’échelle (c’est-à-dire l’allocation de davantage de ressources du serveur), à tout moment.
Une optimisation de base de site Web gratuite, que chaque société d’hébergement décente offre maintenant, consiste à mettre à niveau la version PHP vers la version 7.x. Assurez-vous que votre site CMS fonctionne sur des versions PHP inférieures à 7, telles que 5.6 ou même antérieures, contactez votre support d’hébergement et demandez-leur de le mettre à jour à la dernière version stable, dès que possible. Au cas où ils n’auraient pas la possibilité d’utiliser PHP 7. x, je vous conseillerais de ne pas les utiliser. PHP 7 est une amélioration importante en termes de vitesse et de performances et il est très facile de passer à cette technologie, profitez-en !
Rappelez-vous toujours qu’un bon choix d’hébergement vous épargnera beaucoup de difficultés et si vous rencontrez un problème, un bon service client devrait pouvoir vous aider, alors je vous recommande également de ne pas oublier de choisir un prestataire qui offre un bon support conforme aux RGPD.
Design web et Thème de votre CMS
D’accord, nous devons choisir un bon thème CMS pour notre site. Nous commençons toujours par la conception du thème et c’est correct. Nous devrions d’abord regarder autour de quelques thèmes que nous aimons, car nous voulons que notre site soit génial et qu’un bon design soit la première chose que le visiteur verra. La deuxième chose est bien sûr la fonctionnalité du thème. Votre thème sélectionné ou les plugins recommandés par le thème offrent-ils les fonctionnalités dont nous avons besoin? Si c’est le cas, rien de mieux! Le travaill commence ici! Mais ce que nous oublions presque toujours, c’est de vérifier la rapidité avec laquelle le thème se charge et ses performances globales.
Vous pouvez tester le temps de chargement en phase de démonstration et nous verrons rapidement si le thème est optimisé pour la vitesse ou non. Nous pouvons vérifier avec des outils de vitesse de page et comment les utiliser (voir plus bas), mais pour le moment, je veux seulement que vous conscient de cette étape supplémentaire avant de procéder aux vérification de votre interface web. Il est certain que le temps de chargement des pages de démonstration pourra probablement être amélioré, donc si vous n’obtenez pas un score parfait, ne vous inquiétez pas, aucun thème CMS n’obtiendra un score parfait à 100%, sauf s’il a très peu de contenu en démonstration. En règle générale, vous devez ignorer les thèmes qui figurent avec des scores dans le rouges (scores de 50 ou moins sur les outils de vitesse de page).
Un bon équilibre entre la conception du thème et les fonctionnalités et la vitesse du thème. Par exemple, tout thème CMS vide contenant un peu de texte se chargera très rapidement, mais un thème saturé comportant de nombreuses fonctionnalités (dont la plupart ne seront peut-être pas nécessaires), contenant beaucoup de contenu multimédia, se chargera beaucoup plus lentement. C’est ce que nous visons lorsque nous sélectionnons un thème CMS de bonne célérité et performant.
Plugins CMS
Vous pouvez me demander maintenant « Combien de plugins sont disponibles ? ». La quantité n’est pas un problème avec disponibilité des plugins pour CMS, mais la qualité du code et l’impact du plugin sur le système. Nous pouvons avoir 30 ou même 60 plugins activés, chacun d’eux gérant une fonctionnalité spécifique (avec un bon code) et le site fonctionnant correctement. Mais d’autre part, si vous n’avez que 5 plugins actifs et l’un d’eux pourrait encombrer votre système et ralentir votre CMS.
Passer en revue les codes de chaque plugin est une bonne idée, mais très peu pratique. Ce n’est pas possible pour tout le monde et même un développeur ou un programmeur n’a pas beaucoup de temps à passer là-bas (si vous voulez, vous le pouvez).
Je recommande toujours de ne pas installer et activer seulment les plugins dont vous pensez avoir besoin.
Tout d’abord, réfléchissez-y: votre site a-t-il vraiment besoin de cette fonctionnalité supplémentaire? Par exemple, si vous avez besoin d’un shortcode pour un bouton, consultez d’abord la documentation de votre thème. Peut-être que le thème a un shortcode pour ce thème et vous n’aurez pas besoin d’installer et d’activer un plugin de bundle de shortcode complet pour un shortcode à un seul bouton. C’est un petit exemple, mais je souhaite que vous réfléchissiez avant d’installer et d’activer chaque nouveau plugin. Un seul plugin inapproprié suffit à rendre votre site plus lourd et donc plus lent. De plus, cela pourrait conduire à une faille de défaut de conception et de sécurité en cas de défaut de mise à jour. Même un petit plugin avec une ligne de code non optimisée peut avoir des conséquences fâcheuses !
Un élément important sur laquelle vous pouvez compter, lors de la sélection des plugins, est le vaste partage mondial et par conséquent une énorme communauté de votre CMS. Sans une connaissance correcte du codage, une bonne règle consiste à s’en tenir aux plugins populaires avec de nombreuses installations actives, un bon score moyen et des critiques positives. Cela facilitera votre sélection et vous garantira une ligne de sécurité !
Optimisation de la vitesse de la page de votre CMS
Prêt ? attachez-vous, faites une sauvegarde de votre site WordPress, avant de commencer. Mieux vaut prévenir que guérir !
Maintenant, soyez conscient d’une chose, vous n’atteindrez jamais un score 100/100 dans les outils de vitesse de page. Courir après le score 100/100 n’est pas du tout une bonne idée, ni même possible sur certains sites. Tout dépend du type de contenu affiché sur votre site et du type de visiteurs. Si votre site ne contient qu’un peu de texte et une image, un équilibre parfait est tout à fait possible. Mais si vous avez une longue page, un peu comme celle que vous lisez en ce moment, avec un peu de contenu multimédia et d’autres intégrations d’applications tierces, comme un surligneur de code, etc., la note de 100 n’est pas dans votre ligne de mire. Vous ne devriez pas non plus suivre cet exemple 😉
De la folie? pourquoi ça ne serait pas une bonne idée d’aller à 100/100? Parce que, si vous suivez vraiment les instructions des outils de vitesse de page et optimisez tout, votre site pourrait ne pas fonctionner correctement. Si vous commencez à déplacer tous les fichiers JS et CSS bloquant le rendu vers le pied de page, le CSS clignotant s’affichera (le contenu sans index-Z apparaîtra en premier et lorsque le CSS se chargera, le site « clignotera » avec des comportements inatendus! Je déteste ça même si ça ne plait pas à Google!), il en ira de même avec les codes JS, qui peuvent modifier les éléments DOM après le chargement du code JS.
Concentrez-vous sur le temps de chargement de la page, le nombre de demandes, la taille de la page plutôt que sur les cartes de pointage A, B, C ou 90/100.
De cette façon, si vous commencez à suivre les instructions à l’aveuglette et continuez d’optimiser votre site web pour un meilleur temps de chargement, juste pour obtenir le score parfait … vous risquez de casser votre site. Le score pagespeed parfait n’est qu’un simple nombre, il n’a absolument aucune valeur si vos visiteurs se retrouvent avec un site endommagé. Nous devons rechercher l’équilibre entre la vitesse de la page et l’expérience utilisateur.
C’est vraiment bien de voir les numéros de classement dans le vert avec le score le plus élevé, mais NE le faites PAS dans un objectif de score.
Outils de vitesse de page
En matière d’optimisation de la vitesse de la page, cela peut être très difficile, mais heureusement, nous disposons des outils en ligne gratuits qui nous simplifient la vie et nous conseillent ce qu’il faut faire pour améliorer la vitesse de nos sites Web.
La règle première d’optimisation de la vitesse de votre site web est la suivante: Toujours prendre une mesure de référence avant!
Exécutez n’importe lequel des outils que nous verrons dans la section ci-dessous, après chaque étape d’optimisation, et gardons une trace des améliorations. De cette façon, vous pouvez comprendre quelles tâches ou quels réglages apportent les améliorations les plus importantes. Vous devez également exécuter des tests plusieurs fois pour connaître le temps de chargement moyen car la logique consiste à utiliser pour la première fois un outil ou un simple ordinateur ou client mobile exploité par une personne qui consulte le site Web avec l’intégralité des ressources à afficher. La première exécution n’est donc jamais le résultat définitif.
La chose la plus simple à comprendre pour nous tous est que les pages se chargent différemment, en fonction de l’emplacement du serveur d’hébergement. Par exemple, mon serveur est situé en Europe et mon visiteur vient des Etats Unis, la page se chargera plus lentement que pour un visiteur européen. Ce problème peut être facilement résolu avec un CDN (réseau de distribution de contenu), mais nous y reviendrons un peu plus loin dans l’article. Pour le moment, je tiens simplement à dire que cette question est la même pour les visiteurs du monde entier mais également pour les outils d’optimisation de la vitesse des pages. Certains outils vous permettent également d’effectuer le test à partir de différents emplacements. Vous pouvez ainsi voir en quoi cela affecte le temps de chargement.
Les outils de vitesse de page que nous allons utiliser sont :
- Google PageSpeed Insights
- GTmetrix
- Web Page Test
- Pingdom
Il existe également d’autres outils, mais ce sont les plus populaires, les plus faciles à comprendre et les meilleurs, alors regardons de plus prés.
Google PageSpeed Insights
Comme le titre de cet outil le dit, il s’agit d’un produit de Google. Toute autre introduction est donc sans valeur. Juste à côté du score (voir section ordinateurs de bureau et mobiles) et des instructions utiles sur la manière d’améliorer le temps de chargement de votre page, nous pouvons également tirer une conclusion sur le fait que Google aime voir sur un site Web. Quelles propriétés souhaite-t-il voir optimisée sur un site Web afin de bien figurer dans les résultats des moteurs de recherche ?
Il indiquera le temps de réponse de votre serveur. Si des images ou des fichiers de ressources non optimisés (JS ou CSS) sont présents, il générera un fichier zip avec leurs équivalents optimisés, que vous pourrez remplacer sur votre serveur. Par gain de temps, j’utilise cet outil comme optimiseur d’image! Nous examinerons l’optimisation des images et du code ultérieurement, histoire de savoir que Google PageSpeed peut vous aider.
Cependant, Google PageSpeed Insights ne vous donne pas les informations détaillées, contrairement aux autres outils, mais c’est un bon point de départ, qui couvre tous les aspects importants de l’optimisation de la vitesse de traitement des pages. Il répertoriera toutes les étapes qui amélioreront le plus votre site.
Après avoir exécuté cet outil sur mon site et obtenu un score de 90 pour les ordinateurs de bureau et de 80 pour les mobiles, des améliorations sont donc possibles selon Google (mais je ne le souhaite pas). La liste des suggestions d’optimisation possibles comprend :
Éliminer le code JavaScript et CSS bloquant le rendu dans le contenu d’entête
Tirer parti de la mise en cache du navigateur
GTmetrix
GTmetrix affiche des informations intéressantes et détaillées étape par étape sur les éléments optimisés et ceux qui ne le sont pas. Chaque détail d’optimisation est répertorié et évalué sur une échelle de 0 à 100. La liste est classée par ordre d’importance des ressources. Par conséquent, si vous suivez les tâches d’optimisation de haut en bas et ajustez celles qui n’ont pas un score de 100%, vous serez certainement sur la bonne voie pour accélérer votre site web… aussi vite que possible !
GTmetrix génère également des scores en utilisant les outils de test PageSpeed et YSlow pour votre page et affiche les tâches à améliorer. Le rapport en cascade est une fonctionnalité solide qui représente graphiquement le chargement de votre site et vous permet de repérer rapidement les goulots d’étranglement. Dans l’image ci-dessous, vous pouvez voir que mon serveur dédié a pris 56 ms pour répondre à la connexion. C’est trop long ? non !
GTmetrix propose également différents point de consultation à travers le monde pour tester votre site!
Après avoir exécuté cet outil sur mon site, j’ai obtenu un score de 90 pour PageSpeed et un score de 80 pour YSlow (assez correct).
Pour rappelle, ne vous contentez pas des cartes de pointage.
Nous allons utiliser l’outil GTmetrix pour mesurer les progrès en matière d’optimisation !
Pingdom
Pingdom, un peu comme GTmetrix, affiche toutes les optimisations, données et informations nécessaires, mais de manière différente. Vous obtiendrez le même résumé de base des données que sur l’outil GTmetrix (sans le score YSlow). Maintenant, avec Pingdom, nous pouvons tester la vitesse de la page à partir de 4 emplacements différents dans le monde et les résultats sont différents pour chaque emplacement, ce qui montre que l’emplacement du serveur est important, mais nous pourrons également améliorer cela (avec plus tard, Cloudflare CDN dans un article spécifique).
Pingdom affiche également des informations importantes, telles que la taille du contenu ou le nombre de demandes effectuées, filtrées par type de contenu, ainsi que le nom de domaine et le rapport de cascade.
Après avoir exécuté cet outil sur mon site et obtenu Performance Grade de 94 (pas mal).
WebPageTest
L’outil WebPageTest a beaucoup plus d’options de configuration que les outils précédents. Vous pouvez choisir plus d’emplacements, une vitesse Internet spécifique peut être sélectionnée, vous pouvez activer / désactiver quelques options du navigateur et vous pouvez respectivement tester des clients spécifiques.
Il affichera un rapport en cascade détaillé avec toutes les informations sur chaque exécution (par défaut, WebPageTest effectue 3 exécutions, mais vous pouvez le modifier dans les paramètres). Il affichera une note de A à F pour chacun de ces facteurs d’optimisation de la vitesse:
- Premier octet (temps de réponse)
- Keep-alive activé
- Compresser le transfert (gzip)
- Compresser les images
- Cache le contenu statique
- Utilisation efficace du CDN
Vous pouvez creuser le détail, en vérifiant tous les onglets de résultat, où vous trouverez beaucoup d’informations utiles. J’utilise cet outil lorsque j’ai besoin d’un rapport détaillé ou si j’ai besoin de tester un emplacement de connexion spécifique, sinon je pense que le GTmetrix dispose d’informations plus concises.
À des fins de référencement, il s’agit des résultats du point de départ des outils de vitesse de page que nous allons utiliser pour mesurer les progrès de l’optimisation de la vitesse.
Optimisation de l'image
Pour être honnête, il s’agit de l’aspect le plus ignoré de la performance des sites Web. En même temps, il peut apporter la plus grande amélioration à la vitesse de votre site. Si vous n’avez jamais pensé à optimiser les images avant de les télécharger sur votre site web, il s’agit d’une première étape impérative pour l’optimisation de votre temps de chargement de votre site web.
Le téléchargement d’images volumineuses et souvent surdimensionnées / non optimisées, centralisées dans un unique dossier de votre site Web. Par exemple, votre rendu d’image ne dépasse pas 600 x 400 px sur votre site et vous téléchargez une image de 1920 x 1080 px (ou même plus!). Maintenant, vous vous demandez quelles peuvent être les conséquences et quelles conséquences si vous répétez cette erreur plusieurs fois ? votre site sera lent.
La première chose à faire est de redimensionner les images à la taille souhaitée. Sur mon site, la taille d’image à afficher ne sera jamais supérieure à 1024 x 780 px. Je redimensionne donc l’image à cette taille.
« C’est tout, le travail a été fait, non? » Nous devons encore améliorer les images. Il existe une variété d’outils permettant d’optimiser (compresser) l’image sans perdre sa qualité (non visible à l’œil humain). Ceux-ci aideront également à réduire considérablement la taille du fichier image, ce qui le rendra plus rapide à charger.
Il existe 2 méthodes de compression d’image, qui peuvent être effectuées manuellement ou avec des plugins CMS
Petit guide pour l'optimisation d'image
Choisissez le format d’image correct
les formats d’image les plus populaires pour une utilisation en ligne sont JPEG et PNG. Vous économiserez beaucoup sur la taille du fichier image en sélectionnant le format d’image approprié. Vous devriez utiliser :
Le format .jpg pour les photos, les images avec des dégradés et les images avec des millions de couleurs.
Le format .png pour les images avec des couleurs limitées (logos, graphiques complexes, autres graphiques) et les images avec transparence.
Redimensionner vos images – Comme je l’ai déjà mentionné ci-dessus, vous devez d’abord redimensionner les images avant de les télécharger sur votre site web. Vérifiez la taille de l’espace du conteneur dans lequel vous utiliserez l’image et redimensionnez-la en conséquence. Vous pouvez redimensionner les images avec un logiciel de retouche d’image, tel que Photoshop ou GIMP.
Compressez vos images
Maintenant, cela peut être fait facilement avec un outil de compression d’image en ligne ou avec un plugin CMS:
Outil de compression en ligne:
Je recommande l’outil en ligne Compressor. Téléchargez simplement votre image sur l’application Compressor et, après le traitement, téléchargez l’image optimisée, que vous devrez ensuite télécharger sur votre site web. Cela semble un peu fastidieux ? oui. Comparativement à TinyJPEG ou TinyPNG, cet outil est le meilleur car la qualité de la compression est parfaitement avec Compressor. Il existe donc de nombreux plugins CMS qui peuvent simplifier ce processus.
Plugin de compression d’image CMS:
Encore une fois, j’ai testé les plugins de compression d’image les plus populaires et trouvé: ShortPixel Image Optimizer le meilleur dans tout le lot des plugins proposés. Après avoir installé le plug-in, vous devrez demander une clé API pour pouvoir utiliser le plug-in (processus très simple). Les paramètres par défaut du plugin sont excellents, vous n’avez donc pas besoin de configurer quoi que ce soit, allez simplement dans Médias -> Bulk ShortPixel et cliquez sur le bouton “Démarrer l’optimisation”. Toutes les nouvelles images téléchargées seront également optimisées. Remarque: la version gratuite de ce plugin ne permet que 100 optimisations d’image / mois. Si vous avez besoin de plus, vous devrez passer à leur forfait payant.
Enfin, je ne saurais trop recommander que vous utilisiez uniquement les plugins mentionnés ci-dessus, mais il en existe de nombreux autres comme SmushIT et Image Optimizer.
Personnellement, je n’utilise aucun plug-in d’optimiseur d’image, car il ajoute des fichiers JS et CSS supplémentaires, ce que je ne souhaite pas. Par contre, j’ai trouvé l’outil serveur litlleutils sur plateforme de serveur Linux Debian 9; j’ai soigneusement testé son efficacité. 1 ou 2 Ko pour la qualité d’image si nécessaire. Très bien codé. A vous de faire votre choix suivants cos moyens et compétences.
Utilisez un CDN
Utiliser un CDN pour la gestion du cache, le téléchargement d’images et de vidéos, le stockage, la manipulation, l’optimisation et la gestion des ressources numériques
Les images et les vidéos sont des éléments courants dont nous avons besoin pour tous les gestions de contenu, mais la plupart du temps, nous ne pouvons pas tous les stocker sur nos serveurs partagés ou gérés, ce qui présente naturellement des limitations en termes d’espace disque. Même sur un espace disque illimité, stocker et servir des images n’est pas du tout une bonne idée. Dans ce cas, nous pouvons utiliser des CDN d’images libres et de vidéo. Dans mon cas, j’utilise Cloudflare, ce qui est plus que suffisant pour moi et qui s’applique également à de nombreux autres sites web. Il existe d’autres CDN similaires avec forfait gratuit, mais je recommande Cloudflare car j’ai trouvé que le support des comptes gratuits est adapté à des besoins de base! D’autre part, votre site sera plus rapide, car le réseau mondial CDN Cloudflare s’occupera de tous vos actifs. Cela permettra également d’améliorer vos scores de référencement aussi.
Les principales fonctionnalités de Cloudflare sont:
- Gestion DNS
- Optimisation du cache
- Temps d’accès réduit
- Protection DDoS
- Certificat SSL
Une autre fonctionnalité intéressante à propos de Cloudflare est que j’utilise uniquement l’image sélectionnée de mon serveur dédié, et toutes les autres images, comme les images de page, que vous regardez en ce moment, sont toutes en cache sur Cloudflare. De cette façon, j’optimise ma bande passante, mon espace d’hébergement tout en réduisant les coûts énergie.
Images optimisées Google PageSpeed
C’est une façon vraiment amusante d’optimiser vos images existantes sur votre site web. Si vous avez suivi les étapes ci-dessus, comme je l’ai mentionné, dans la section Guide pratique de l’optimisation des images, vous avez probablement déjà optimisé les images. Par conséquent, Google PageSpeed ne vous montrera aucune image. Bon travail ! Vous pouvez toujours lire cette section à titre informatif seulement.
