Guide du débutant sur l'optimisation de la vitesse du site Web Réparez votre site lent

Publié: 2020-04-16

Vous ne savez pas comment augmenter la vitesse globale de votre site Web ?

La vitesse du site Web est la partie fondamentale du référencement moderne, et croyez-moi ; Il a un effet immédiat et significatif sur les classements.

Si vous avez déjà visité mon site Web TheGuideX, vous remarquerez que mon site se charge en moins d'une seconde (j'ai également joint le résultat GTmertix ci-dessous).

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Rapport de vitesse TheGuideX.com à l'aide de l'outil GTmetrix

Selon GTmetrix, le score PageSpeed ​​de TheGuideX.com est de 100 % et le score YSlow est d'environ 95 % avec un temps de chargement de 0,9 seconde et seulement 23 requêtes HTTP. C'est étonnant.

…et voici un autre rapport de TheVPNCoupon.com, où je blogue sur les VPN.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Rapport de vitesse TheVPNCoupon.com à l'aide de l'outil GTmetrix

Et selon GTmetrix, le score PageSpeed ​​​​de mon autre blog (TheVPNCoupon.com) est d'environ 99% et le score YSlow est de 95% avec des requêtes 23-HTTP et ce site Web se charge également en moins d'une seconde (bien qu'il ne faille que 800 ms pour charger ce site Internet).

Un site Web qui se charge en moins de 2 secondes est considéré comme une vitesse de chargement acceptable. Mais nous vous recommandons toujours d'optimiser votre site au maximum pour une meilleure vitesse de chargement.

Alors, que dois-je faire pour optimiser la vitesse de mon site ? Et faut-il des compétences techniques ou de développement pour optimiser votre site ?

La réponse est non; vous n'avez besoin d'aucune compétence technique ou de développement pour optimiser votre site Web. Vous pouvez facilement le faire en utilisant quelques plugins WordPress et CDN. Et pour optimiser votre site, vous avez d'abord besoin d'un meilleur plan d'hébergement Web.

La plupart des blogueurs amateurs ont échoué ici. Lorsqu'ils m'ont demandé d'optimiser leur site, j'ai remarqué qu'ils utilisaient des plans d'hébergement partagé bon marché sur leur site, et l'utilisation d'un plan d'hébergement bon marché ne peut jamais rendre un site Web rapide.

Si vous avez des connaissances de base sur les VPS, je vous recommande de commencer par déplacer votre site Web vers DigitalOcean ou Cloudways, et si vous souhaitez un hébergement basé sur cPanel, vous pouvez passer à SiteGround.

Obtenez 30 $ gratuits sur Cloudways en utilisant le coupon « TheGuideX »

Assurez-vous également d'utiliser un CDN sur votre site Web. Si vous recherchez un fournisseur de CDN gratuit, je vous recommanderai Cloudflare. Vous pouvez également utiliser ImageKit pour Image CDN (je l'utilise sur mon site Web et cela m'aide à optimiser les images en temps réel).

Avant d'approfondir les techniques d'optimisation de la vitesse, nous apprenons d'abord

Table des matières

Pourquoi la vitesse est-elle importante ?

Alors, combien de temps attendez-vous qu'un site Web se charge ?

Eh bien, selon les statistiques, la moitié d'entre nous et même en ce qui me concerne, je ne veux pas attendre deux secondes pour qu'un site Web se charge.

C'est pourquoi je voulais m'assurer que mon site Web se charge en une seconde ou aussi vite que possible. Et aujourd'hui, je vais partager exactement la même méthode, que j'utilise sur mon site web pour optimiser sa vitesse.

Mais pourquoi la vitesse d'un site Web est-elle importante ? Et quelle différence fait une fraction de seconde ?

La réponse? Cela fait une grande différence!

Mais comment cela fait une grande différence? Voyons un rapport détaillé pour en savoir plus sur l'importance de la vitesse.

1. Les sites Web lents tuent les conversions :

Un site Web lent peut tuer les conversions de votre site Web.

Imaginons que vous soyez un site Web de commerce électronique et que votre site Web prenne environ quatre secondes à se charger. Et selon divers rapports, 40% des personnes peuvent quitter votre site s'il met plus de trois secondes à se charger.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Une vitesse lente peut diminuer la conversion

Donc, dans ce sens, si votre site Web reçoit environ 1 00 000 de trafic par mois et qu'il faut environ quatre secondes pour charger votre site Web, il y a de nombreuses chances que jusqu'à 40 000 personnes abandonnent votre site.

Et de cette façon, vous perdrez 40% des personnes, et cela aura donc également un impact sur la conversion globale du site Web. De cette façon, la vitesse du site Web compte beaucoup pour augmenter les conversions.

2. Nous attendons de la vitesse et de l'expérience utilisateur :

Comme je l'ai déjà mentionné ci-dessus, 40 % des personnes quittent votre site Web si le chargement prend plus de trois secondes. Et quand il s'agit de moi, je quitte toujours le site, qui prend deux secondes ou plus à charger.

WTH attendre les deux secondes pour charger le site Web ?

Si je ne peux pas attendre deux secondes, je ne peux pas m'attendre à ce que mes lecteurs restent aussi longtemps.

Il existe deux principaux facteurs impliqués dans une bonne expérience utilisateur :

  1. Donner aux visiteurs ce qu'ils recherchent, et
  2. Donnez-leur vite.
how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Vitesse de chargement lente du site Web

Voici quelques facteurs de classement supplémentaires sur la nouvelle expérience de page de Google que vous pouvez envisager d'optimiser sur votre site Web.

Et dès que les visiteurs sont confus et frustrés, cela signifie que nous avons fait quelque chose de mal, et il n'y a rien de plus frustré qu'un temps de chargement lent.

Si vous voulez vraiment améliorer les performances globales de votre site Web, la vitesse de chargement du site Web devrait être votre priorité absolue.

3. La vitesse du site Web affecte votre classement Google :

Dernier point mais non le moindre, il domine le classement Google.

Google a déjà avoué qu'il s'efforçait de rendre l'ensemble du Web rapide. Ils ont pour mission de rendre le site Web super rapide, plus fiable et utile.

Cela ne peut être possible sans une bonne vitesse de chargement, et ils donnent la priorité aux sites ayant une vitesse de chargement rapide. Et à ma connaissance, ils ont annoncé en 2010 qu'ils accordaient un peu plus de préférence aux sites Web ayant une vitesse de chargement rapide.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization

Et selon un rapport de SERoundtable, si votre site Web prend plus de 2 secondes pour charger le contenu, Google peut limiter le nombre de robots qu'il envoie à votre site.

Si c'est le cas avec votre site, Google sera moins susceptible de préférer et de récupérer votre dernier article de blog ou de remarquer une mise à jour récente. Et cela nuira sûrement à votre site Web.

La vitesse compte donc, elle a un impact sur la conversion de votre site Web; cela affecte l'expérience utilisateur et affecte également le classement des moteurs de recherche.

Haut

À partir de maintenant, je suis sûr que vous avez appris à quel point un site Web à chargement rapide est important.

Et maintenant, avant de passer aux techniques spécifiques pour vous aider à optimiser la vitesse globale de votre site Web, prenons un moment pour passer en revue les outils qui vous aideront à analyser la vitesse de vos pages Web.

Outils de test de vitesse de site Web

D'accord, l'optimisation de la vitesse du site Web est donc importante ! Maintenant, comment savez-vous où vous en êtes ?

Autrement dit, votre site Web est-il lent ? Est-ce au milieu, ou est-ce rapide comme l'éclair (Félicitations alors, vous pouvez probablement arrêter de lire !).

La seule façon de le savoir est de tester votre site Web. Il existe de nombreux sites pour mesurer la vitesse de notre site Web, mais ici, dans ce guide, je ne partagerai que quelques outils que je préfère personnellement utiliser.

1. GTmetrix

GTmetrix est l'un des meilleurs outils pour vérifier les performances du site Web. Cet outil est une bonne option pour les utilisateurs occasionnels et les développeurs.

GTmetrix offre une conception conviviale avec un tas d'optimisations utiles et approfondies. Pour utiliser cet outil, il suffit de mettre un lien vers un site internet et de cliquer sur le bouton « Analyser » .

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Rapport GTmetrix de TheGuideX

Lorsque vous cliquez sur le bouton « Analyser », il vous faudra quelques secondes, voire une minute, pour recracher une analyse détaillée de votre site Web.

Vous obtiendrez le joli résumé, y compris;

  • Temps entièrement chargé
  • Requêtes HTTP
  • Taille totale de la page
  • Score PageSpeed
  • YScore lent
Apprenez à #accélérer votre site #WordPress avec les conseils qui comptent vraiment Click To Tweet

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
GTmetrix suggère des optimisations pour votre site Web

Et si vous creusez plus profondément dans le résultat GTmetrix et développez la section " recommandation" , il affichera des recommandations spécifiques à votre site Web. Vous pouvez également cliquer sur "Qu'est- ce que cela signifie?" pour en savoir plus sur ces erreurs et optimisations.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization

Outre les « recommandations » , il indique également le temps de recherche DNS de chaque fichier externe et interne utilisé par votre site Web. Si vous êtes développeur ou avez des compétences techniques, cela vous aidera à optimiser davantage votre site.

2. Pingdom

Pingdom est un autre outil le plus efficace et le plus efficace pour l'optimisation de la vitesse de WordPress. Si vous êtes un débutant ou un développeur, cet outil vous aidera à tester efficacement votre site Web et vous aidera avec les recommandations pour optimiser votre site.

Pour utiliser cet outil, entrez l'adresse de votre site Web, puis sélectionnez le « lieu de test». Une fois que vous avez choisi l'emplacement de test, cliquez sur le bouton " Démarrer le test" et il commencera à analyser la page.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Rapport Pingdom pour TheGuideX

Et similaire à GTmetrix, si vous creusez plus profondément, il vous montre diverses recommandations pour optimiser votre site Web. Et plus bas, vous pouvez trouver des informations sur les demandes spécifiques sur votre site, et l'analyse de la cascade.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization

Cet outil est vraiment utile pour improviser la vitesse de votre site Web - Mais il nécessite des connaissances avancées pour en bénéficier. Vous pouvez également lire un article sur l'analyse en cascade par KeyCDN pour en savoir plus à ce sujet.

3. Google PageSpeed ​​Insights

PageSpeed ​​Insight de Google est un autre meilleur outil pour tester votre site Web. Cet outil vous donne simplement des suggestions grâce auxquelles vous pouvez optimiser votre site Web, mais il ne partagera pas le résultat du test de vitesse de votre site Web.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Rapport Google PageSpeed ​​Insight pour TheGuideX

Cela a changé, cependant. Désormais, Google partagera le temps de chargement de la page pour First Contentful Paint (FCP) et DOM Content Loaded (DCL) . Vous pouvez en savoir plus sur ces mesures de vitesse sur la page officielle des développeurs de Google ici.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization

Si vous avez un faible score de vitesse de page et un temps de chargement médiocre, ce guide est fait pour vous ! Vous pouvez lire ce guide jusqu'à la fin pour optimiser correctement votre site Web sur Google PageSpeed ​​Insight et d'autres sites Web.

Vous pouvez également consulter notre autre guide sur la résolution de Flash of Invisible Text (FOIT) pour optimiser les polices de votre site Web.

4. Test de page Web

Le dernier outil, mais non le moindre, utilisé pour vérifier la vitesse du site Web est WebPageTest. Cet outil est l'un des outils de test de vitesse WordPress les plus avancés en termes de profondeur de fonctionnalité et de données qu'il fournit.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Résultat du test de la page Web pour TheGuideX

Lorsque vous vérifiez la vitesse de votre site Web à l'aide de l'outil WebPageTest, vous pouvez utiliser quelques paramètres avancés pour analyser votre site Web. Vous pouvez utiliser ces paramètres avancés pour ;

  • Simuler une connexion lente
  • Choisissez le type d'appareil et le navigateur
  • … configurer beaucoup plus

Si vous consultez ce tweet de John Mueller de Google Search, il recommande également l'outil WebPageTest pour vérifier la vitesse de chargement du site Web.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
John recommande WebPageTest

Si vous êtes confus avec ces options, je vous recommande d'essayer l'onglet "Test simple" . Dans l'ensemble, cet outil est le meilleur pour tester la vitesse de votre site Web, et si vous êtes un développeur, il vous aidera beaucoup à réparer votre site Web.

Haut

Jusqu'à présent, nous avons appris l'importance d'avoir un site Web à chargement rapide et les outils pour vérifier la vitesse du site Web.

Il est maintenant temps de partager les techniques pour optimiser correctement votre site Web.

Ici, dans ce tutoriel, je ne partagerai pas seulement les étapes pour utiliser un plugin de cache pour optimiser CSS, JS, HTML, ou pour utiliser CDN comme d'autres le font, mais je partagerai le moyen le plus accessible par lequel vous pouvez faire ces optimisations correctement.

Ces méthodes sont simples et plus simples avec des exemples ;

Mais avant de procéder avec ces méthodes, je vous recommande d'abord de faire une sauvegarde de votre site Web WordPress en utilisant le plugin Updraft Backup, qui est disponible gratuitement sur WordPress repo.

Une fois que vous avez pris la sauvegarde de votre site WordPress, nous pouvons continuer avec l'optimisation du site.

Alors comment faire…

Optimisez votre site Web

Maintenant, l'attente est terminée!

Ici, je partage les méthodes que j'utilise toujours sur mon site Web pour l'optimiser. Vous pouvez suivre les mêmes techniques pour optimiser votre blog, votre micro-niche et également votre boutique de commerce électronique.

1. Choisir un hébergement Web rapide et fiable

La toute première étape consiste donc à choisir un fournisseur d'hébergement Web fiable et rapide.

Comme je l'ai déjà mentionné, lorsque les gens me demandent d'optimiser leur site Web, je remarque qu'ils utilisaient des plans d'hébergement partagé bon marché sur leur site, et l'utilisation d'un plan d'hébergement bon marché ne peut jamais rendre un site Web rapide.

Donc, si vous utilisez un plan d'hébergement partagé bon marché, je vous recommanderai certainement de passer d'abord de votre fournisseur d'hébergement Web actuel à un fournisseur de confiance.

Si vous me demandez une plate-forme d'hébergement Web rapide et optimale, je recommanderai toujours DigitalOcean - Mais cela nécessite quelques compétences techniques pour gérer votre droplet DigitalOcean. Bien que ce soit facile et pour le rendre plus pratique, vous pouvez utiliser n'importe quel panneau de contrôle sur votre serveur (j'utilise personnellement DigitalOcean sur tous mes projets).

Ces panneaux peuvent inclure ServerPilot, VestaCP et bien d'autres - Mais je recommande toujours d'utiliser ServerPilot car c'est l'un des panneaux de contrôle les plus simples pour installer WordPress (vous pouvez cliquer ici pour obtenir un crédit gratuit de 10 $ sur ServerPilot).

Obtenez 100 $ gratuits sur DigitalOcean

Et si vous êtes débutant et que vous souhaitez un hébergement basé sur cPanel, vous pouvez également opter pour SiteGround. SiteGround est l'un des meilleurs fournisseurs d'hébergement Web de confiance pour les petites entreprises et les sites Web.

1.1 Hébergement recommandé

DigitalOcean

En ce qui concerne le fournisseur d'hébergement Web le plus rapide et le plus fiable, personne ne peut battre DigitalOcean. Ils sont parmi les meilleurs pour héberger votre blog WordPress.

Bien que vous deviez utiliser quelques panneaux pour gérer votre serveur facilement. Il peut inclure ServerPilot, ServerAvatar, EasyEngine, VestaCP et bien d'autres. Vous pouvez utiliser n'importe lequel d'entre eux, mais je vous recommande d'essayer ServerPilot.

Obtenez 100 $ gratuits sur DigitalOcean
Cloudways

Je crois que DigitalOcean est parfois un peu plus difficile à gérer, surtout quand on est débutant. Ainsi, au lieu de DigitalOcean, vous pouvez également essayer Cloudways, qui est un autre fournisseur d'hébergement Web incroyable sur le marché.

Ils proposent des plans d'hébergement Web gérés à un prix incroyable avec un certificat SSL gratuit, une migration de site Web gratuite et une assistance 24/7/365. Vous pouvez également utiliser le coupon " TheGuideX " pour obtenir 3 mois de plan d'hébergement géré gratuit.

Obtenez 30 $ gratuits sur Cloudways
SiteGround

SiteGround est aussi proche que n'importe quel hébergement Web parfait, et vous pouvez obtenir - la vitesse, les temps de disponibilité, l'assistance, les fonctionnalités et les prix étaient tous phénoménaux. Je les utilise sur quelques-uns de mes micro-blogs de niche, et j'ai un temps de réponse du serveur <200 ms et un rapport GTMetrix et Pingdom parfait.

SiteGround est le meilleur hébergement lorsque vous l'achetez pour 1 à 3 ans de plan promotionnel, mais c'est cher car il ne voulait pas surcharger leurs serveurs comme l'hébergement EIG.

Grab a commencé avec SiteGround @ seulement 3,95 $ / mois

1.2 Hébergement non recommandé

Hébergement mutualisé pas cher

Si vous vouliez que votre site Web soit rapide et optimisé, n'utilisez jamais de plans d'hébergement bon marché et partagés. La plupart des fournisseurs d'hébergement Web bon marché ne sont pas correctement optimisés et ils surchargent simplement leur serveur pour gagner quelques dollars.

Ainsi, ils ne rendront jamais votre site rapide. Si vous voulez un site Web à chargement rapide, je vous recommanderai toujours de garder une distance de six pieds par rapport aux fournisseurs d'hébergement bon marché.

…et tous les hôtes du GIE

Endurance International Ground, Inc. (EIG) est l'un des grands noms de l'industrie de l'hébergement Web. Ils exploitent plus de 75 sociétés d'hébergement sous leur direction.

Il peut inclure certaines des marques d'hébergement Web les plus populaires telles que HostGator, iPage, etc. Mais je ne vous suggérerais jamais d'essayer ces plates-formes d'hébergement Web.

2. Choisir un thème WordPress optimisé

Lors de la sélection d'un thème pour votre site Web WordPress, il est essentiel de sélectionner un thème optimisé pour la vitesse. Certains thèmes magnifiques et impressionnants sont mal codés et peuvent rendre votre site Web très lent.

Et si vous n'utilisez pas de thème optimisé sur votre site Web, il y a moins de chances que ces méthodes d'optimisation de la vitesse fonctionnent pour vous.

Je préfère généralement aller avec un thème qui a une interface utilisateur simple et propre plutôt que de préférer une animation flashy et énorme et un thème avec une mise en page complexe. Vous pouvez toujours ajouter ces fonctionnalités en utilisant un plugin WordPress fiable et de qualité.

Si vous avez besoin d'une recommandation de thème, je vous suggère de préférer un thème WordPress premium de StudioPress, MyThemeShop et GeneratePress. Les thèmes de ces places de marché sont optimisés et bien codés pour la vitesse et le référencement. (Personnellement, je préfère utiliser le thème GeneratePress sur mes sites Web)

Cliquez ici pour obtenir GeneratePress

Vous pouvez également consulter Astra, qui est un autre thème optimisé pour la vitesse et le référencement. Comme pour GeneratePress, ce thème est également livré avec de nombreuses options de personnalisation et est l'un des thèmes les plus téléchargés dans le repo WordPress avec plus de 700 000 installations actives.

2.1 Thèmes recommandés

GénérerPresse

GeneratePress est l'un des meilleurs thèmes légers et optimisés pour le référencement disponible gratuitement sur le marché WordPress.

Le thème est hautement personnalisable et vous pouvez créer tout type de site Web, qu'il s'agisse d'un site de blog, d'un site affilié Amazon ou d'un site Web d'entreprise. Avec l'aide de ses modules complémentaires premium, vous pouvez personnaliser n'importe quoi sur votre site Web.

Selon WordPress.org, le thème GeneratePress est actif sur plus de 2 00 000 sites et la taille de l'ensemble du thème est inférieure à 30 Ko. Je recommande fortement ce thème pour tout type de site Web.

Obtenez le module complémentaire GeneratePress Premium
Astra

Semblable à GeneratePress, Astra est un autre meilleur thème disponible gratuitement sur le marché WordPress. Le thème compte plus de 700 000 installations actives et ce thème peut fonctionner avec tous les constructeurs de pages, y compris Elementor, Thrive Architect et plus encore.

Astra est l'un des thèmes de configuration faciles ; il est également livré avec divers modèles prédéfinis parmi lesquels choisir et vous donne en outre le pouvoir de les personnaliser également pour vous créer un design unique. Vous pouvez faire beaucoup plus en utilisant leur add-on premium.

La taille du thème n'est que de 50 Ko, et au lieu de JQuery, il est uniquement construit sur vanilla JS, donc plus de problèmes de blocage de rendu de tout type.

Obtenez le module complémentaire Astra Premium
Studio Press (Genesis)

StudioPress est l'un des marchés de thèmes WordPress premium les plus populaires. Tous les thèmes StudioPress sont adaptés aux mobiles et ont un code propre et léger qui garantit que votre site est optimisé pour la vitesse.

Ils construisent le framework Genesis pour la vitesse et vous le remarquez immédiatement lorsque vous l'utilisez.

Obtenir le thème StudioPress

Jusqu'à présent, nous avons discuté d'un fournisseur d'hébergement Web fiable et rapide et d'un thème WordPress rapide et fiable.

Ces deux éléments sont essentiels pour passer à la troisième étape, qui consiste à optimiser votre blog/site Web à l'aide de quelques plugins WordPress.

3. Optimisation à l'aide de plugins WordPress

Donc, avant de discuter de l'optimisation de votre site Web WordPress à l'aide de quelques plugins, nous supposons que vous vous êtes déjà occupé de deux choses ;

  • Vous êtes sur un hébergeur suffisamment rapide.
  • Vous utilisez un thème WordPress codé rapide, optimisé et propre

Si vous cochez ces deux cases, vous pouvez procéder à l'optimisation de WordPress à l'aide de divers plugins et explorer des moyens complets d'accélérer la vitesse de chargement de votre site Web.

3.1 Optimisez votre site avec WP Rocket

Ainsi, le tout premier plugin que nous utilisons pour l'optimisation de la vitesse de WordPress est WP Rocket.

WP Rocket est l'un des meilleurs plugins de cache WordPress, ce qui permet d'accélérer le chargement de votre site Web. C'est un outil convivial pour les débutants avec de nombreuses personnalisations pour augmenter les performances de votre site Web en quelques clics.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
WP Rocket (page d'accueil)

Le plugin peut vous aider à optimiser ;

  • Optimisation de la page Web,
  • Création du cache de pages,
  • Compresser le HTML, CSS, JS du site web,
  • Combinaison de fichiers CSS et JS,
  • Activer le LazyLoad pour les images et les vidéos,
  • et de nombreux autres réglages d'optimisation.

Alors maintenant, nous avons compris les bases de l'utilisation de ce plugin. Nous allons maintenant vous montrer comment optimiser correctement votre site Web à l'aide du plug-in de cache WP-Rocket.

Si vous utilisez un autre plugin de cache, je ne vous recommanderai guère de passer à WP-Rocket.

C'est l'un des plugins les plus simples mais les meilleurs pour le cache, et même vous n'avez pas besoin de modifier leurs paramètres comme vous le faites avec d'autres plugins de cache. Un simple clic et vous êtes prêt à partir.

Obtenir WP Rocket

Alors…

Comment utiliser WP-Rocket efficacement ?

Vous trouverez de nombreuses fonctionnalités dans le plugin WP-Rocket, et vous êtes-vous déjà demandé quels paramètres vous devez activer sur votre site Web pour le rendre ultra rapide ?

Une fois que vous avez installé et activé le plugin WP-Rocket sur votre site WordPress, allez dans « Paramètres » > « WP Rocket » pour ouvrir la page de configuration.

Maintenant, cliquez sur les paramètres « Cache » pour définir le cache du site Web à l'aide du plugin WP-Rocket. (Cela affichera quelque chose comme ça)

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
WP Rocket (paramètre de cache)

Tout d'abord, vous devez activer le « Cache mobile», et si vous configurez le cache pour le commerce électronique, activez les paramètres « Cache utilisateur connecté ».

Remarque : La plupart des thèmes modernes prennent en charge la conception réactive, vous n'avez donc pas besoin d'activer l'option « Cache mobile séparé » dans la page « Cache »

Et puis réglez le « Cache Lifespan » sur « 10 heures ».

Une fois que nous en aurons terminé avec les paramètres de cache, nous passerons à « Optimisation des fichiers » d'où nous pourrons minifier HTML, CSS, JS, différer JS et combiner CSS et JS.

Ces paramètres sont l'un des paramètres les plus importants de WP-Rocket. Cela vous aidera également à diminuer la requête HTTP en combinant CSS & JS de votre site.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
WP Rocket (Optimisation des fichiers)

Lorsque vous cliquez sur la partie « Optimisation des fichiers », vous obtenez diverses options pour minimiser HTML, CSS, JS et les combiner dans moins de fichiers.

Et dans les " Paramètres de base", cochez les trois options pour " Réduire le HTML", " Combiner les fichiers de polices Google", " Supprimer les chaînes de requête". Cela n'affectera pas votre site Web - Mais lorsque vous activez les paramètres " Fichiers CSS " et " Fichiers JS ", assurez-vous que cela ne cassera pas votre site.

Parfois, ces paramètres peuvent casser votre conception frontale, et si jamais cela casse la conception de votre thème, décochez ces cases et cela réparera votre site Web.

Cochez maintenant l'option "Réduire CSS", "Combiner CSS" et "Optimiser la livraison CSS" dans les fichiers CSS pour réduire votre CSS et les combiner en moins de fichiers. Il résoudra également le problème « élimine le CSS bloquant le rendu » sur votre site Web.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
WP Rocket (Optimisation des fichiers)

De même, dans la section Fichiers JS , cliquez sur "Supprimer JQuery Migrate", "Réduire JS", "Combiner les fichiers JavaScript", "Charger JavaScript différé", puis activez le "Mode sans échec pour JQuery" dans la section JS différée.

Une fois que vous avez défini ces paramètres dans File Optimization , veuillez vider le cache et vous assurer qu'il ne détruirait pas votre site en visitant la page d'accueil ou n'importe quelle page de votre site Web.

Si ces paramètres nuisent à l'apparence générale de votre site, je vous recommande de désactiver ces paramètres et de vérifier une fois si votre serveur et votre thème sont compatibles avec le plugin WP-Rocket.

Après les paramètres d' optimisation des fichiers , vous obtiendrez les paramètres pour gérer le chargement différé et les médias. Cliquez sur l'option Média pour modifier les paramètres des médias ;

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
WP Rocket (Paramètres multimédias)

Ici, dans cette option, vous aurez une option pour activer le lazyload sur les images et les vidéos, et vous aurez également une option pour désactiver les intégrations, les emojis et activer la compatibilité WebP.

Je vous suggérerai d'activer les paramètres Lazyload pour les images, iframe et vidéos. Vous pouvez également remplacer les vidéos YouTube ou les iframes par des images (croyez-moi, cela rendra votre site Web ultra rapide).

Vous aurez également la possibilité de désactiver les emojis et les intégrations, la plupart du temps ils ne nous sont d'aucune utilité, et en désactivant les intégrations, vous économiserez les ressources de votre site Web, je vous recommande donc d'activer ces paramètres.

Comme vous pouvez le voir dans l'image ci-dessus, je n'utilise pas la mise en cache WebP, et si vous utilisez les images WebP sur votre site Web, vous pouvez l'activer pour une meilleure mise en cache des médias. Vous pouvez en savoir plus sur WebP ici.

Après les paramètres multimédias , vous aurez la possibilité d'activer le préchargement sur votre site Web.

Pourquoi le préchargement du cash est-il indispensable pour améliorer les performances de votre site ?

Le préchargement garantit que vos visiteurs obtiennent immédiatement les versions plus rapides et mises en cache de votre site. WP Rocket s'en charge automatiquement, et votre page d'accueil et tous les liens qui s'y trouvent seront préchargés

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
WP Rocket (cache de préchargement)

Si le préchargement est lent et qu'il ne se termine pas du tout, il y a deux raisons possibles. Assurez-vous de vérifier les paramètres de temps d'exécution PHP et de tâche de maïs pour résoudre ce problème.

Une fois que vous avez défini les paramètres de préchargement , vous aurez la possibilité de configurer les paramètres avancés. À partir des paramètres avancés, vous pouvez facilement gérer quelques paramètres qui peuvent inclure la désactivation du cache pour l'URL personnalisée ou les cookies personnalisés, l'agent utilisateur et la purge de l'URL souhaitée.

Après cela, vous aurez la possibilité de gérer l' optimisation de la base de données et le CDN, mais nous ignorerons ce paramètre ici. Et nous utilisons le plugin WP-Optimize pour optimiser efficacement la base de données, et nous vous montrerons comment implémenter CDN plus tard dans la section CDN.

Et encore une fois, après ces paramètres, vous aurez la possibilité de gérer l'API WordPress Heartbeat. Fondamentalement, l'API WordPress Heartbeat fournit une connexion pour le transfert de données en temps réel et la synchronisation entre le serveur et le navigateur.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
WP Rocket (Paramètres de rythme cardiaque)

Vous n'arrivez toujours pas à comprendre les paramètres du rythme cardiaque ? Ici, je partage quelques exemples où les paramètres de rythme cardiaque sont impliqués;

  • Sauvegardes automatiques et révisions dans l'éditeur WordPress,
  • Verrouillage de la publication - Lorsqu'un éditeur travaille sur un article particulier, il désactive la post-édition pour les autres auteurs.

Si vous utilisez un serveur avec peu de ressources, vous pouvez le désactiver pour économiser vos ressources, mais pour les petits sites Web, ce n'est pas un problème majeur.

Et maintenant, le dernier paramètre, mais non le moindre, dans le plugin WP-Rocket, est leurs paramètres de modules complémentaires . Si vous utilisez Facebook Pixel et Google Analytics sur votre site Web, cela vous aidera à les stocker localement sur votre serveur pour optimiser la vitesse du site.

Vous pouvez simplement l'activer pour améliorer le problème de mise en cache du navigateur sur votre site Web.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
WP Rocket (modules complémentaires)

Un autre excellent module complémentaire peut inclure l'intégration de votre site Web avec Cloudflare et Sucuri directement depuis le tableau de bord WP-rocket. Cela vous aidera à vider et à purger le cache de ces fournisseurs de CDN chaque fois que vous purgerez quelque chose sur votre site Web.

Fais-moi confiance; ce sont l'un des meilleurs paramètres qui rendront votre site Web très rapide. Si vous souhaitez accélérer le chargement de votre site Web, je vous suggérerai d'activer ces paramètres.

Pour l'instant, nous avons implémenté quelques optimisations à l'aide du plugin WP-Rocket.

Nous allons maintenant utiliser d'autres plugins comme WP-Optimize pour l'optimisation de la base de données et AssetCleanUp Pro pour une optimisation supplémentaire de la vitesse.

Haut

3.2 Optimisez votre site avec Asset CleanUp Pro

Une fois que vous avez optimisé votre site Web à l'aide de WP Rocket et vérifié le résultat GTmetrix & Pingdom, vous verrez une amélioration instantanée de la vitesse de chargement des pages.

Mais nous n'avons pas fini ici, j'ai déjà mentionné plus haut que nous devons optimiser notre site Web autant que possible.

Nous allons donc maintenant utiliser quelques autres plugins comme Asset CleanUp Pro pour optimiser davantage notre site Web (vous pouvez également utiliser la version gratuite d'Asset CleanUp pour l'optimisation, mais je suggérerais d'obtenir la version payante).

Grab Asset Cleanup Pro

Ce plugin peut vous aider à résoudre le problème Flash of Invisible Text (FOIT) sur votre site Web, et il bloque également l'accès au fichier XML-RPC et fait beaucoup plus de choses.

Comme nous avons déjà optimisé notre site avec WP Rocket, donc la modification de HTML, CSS & JS, et quelques autres paramètres sont bloqués, et nous ne pouvons pas les activer (C'est une bonne chose !)

Mais avant d'utiliser ce plugin sur "Live Site", je vous recommande d'aller dans " Asset CleanUp" puis de cliquer sur " Test Mode" pour activer le mode test.

L'activation du mode test peut aider vos visiteurs à parcourir votre site sans aucun paramètre Asset CleanUp pendant que vous procédez à la configuration du plug-in et que vous déchargez les CSS et JavaScript inutiles !

Une fois que vous avez activé le mode test, cliquez maintenant sur l'option Optimiser CSS , puis faites défiler jusqu'aux paramètres CSS chargés dynamiquement du cache , puis activez-le.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
AssetCleanUP (Optimiser CSS)

Une fois que vous l'avez fait, cliquez sur le bouton Enregistrer .

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
AssetCleanUP (Optimiser JS)

De même, dans la section Optimize JS, activez le JavaScript chargé dynamiquement du cache.

Ces options vous aideront à mettre en cache les valeurs dynamiques de CSS & JS. Cependant, vous n'aurez pas ces problèmes dans WordPress après avoir utilisé WP-Rocket.

Une fois que vous avez défini ces paramètres, cliquez sur les paramètres « Site-Wide Common Unloads » après l'option « CDN ».

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Asset CleanUp (déchargements communs à l'échelle du site)

Vous trouverez ici quelques options pour désactiver Emojis , Embeds , Dashicons , Gutenberg CSS Block Library , JQuery Migrate et Comment Reply Site-wide .

Comme vous pouvez le voir, nous avons déjà supprimé les Emojis, Embeds & JQuery Migrate à l'aide du plugin WP-Rocket. Donc, pour éviter tout conflit, nous n'activerons pas ces paramètres.

Mais si vous n'utilisez pas l'icône Gutenberg, Dashicons sur votre blog, vous pouvez les désactiver.

Et si vous n'utilisez pas WordPress en tant que blog, si vous ne voulez pas que les visiteurs laissent des commentaires, ou si vous avez remplacé les commentaires WordPress par défaut par une plateforme de commentaires telle que Disqus ou Facebook, vous pouvez également désactiver le « site de réponse aux commentaires ». large ” dans les paramètres.

Maintenant, nous allons passer à la section « Nettoyage de la source HTML » à partir de laquelle nous pouvons supprimer les éléments inutilisés de la section <head>.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Nettoyage des actifs (nettoyage de la source HTML)

À partir de ces paramètres, nous pouvons supprimer les éléments indésirables des sections <head>.

Ne vous inquiétez pas!

La suppression de ces éléments n'affectera en rien votre site.

J'ai supprimé plusieurs options de ces paramètres, notamment les commentaires RSS, les balises Meta Generator, les balises de version WordPress, l'API REST et les liens RSD.

Vous pouvez supprimer ces paramètres de votre site Web et cela ne nuira pas à votre site Web. Vous pouvez également supprimer le lien du flux RSS uniquement si vous ne l'utilisez pas.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Asset Cleanup Pro (optimisation des polices locales)

Et si vous utilisez la version premium d' Asset Cleanup Pro , vous pouvez modifier la valeur « Apply font-display CSS » de « Don't apply » à « Swap ». Cela peut empêcher votre site Web d'un flash de problème de texte invisible. Vous pouvez cliquer ici pour en savoir plus sur ce problème.

Vous pouvez également entrer l'URL des fichiers de police locaux dans la section de préchargement pour le charger instantanément. Lorsque nous préchargeons un fichier de police, nous augmentons explicitement la priorité de la ressource.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Asset Cleanup Pro (optimisation des polices Google)

Et après les paramètres d' optimisation des polices locales , vous verrez une option similaire dans les « polices Google». paramètre.

Sélectionnez simplement l'option " swap " dans les paramètres d'affichage de la police et activez également la préconnexion . L'activation de l'option de préconnexion indiquera et demandera au navigateur de se préconnecter à Google Fonts pendant qu'il charge le CSS, ce qui permet d'économiser du temps de chargement.

Vous pouvez également activer les paramètres de combinaison de plusieurs requêtes pour combiner plusieurs requêtes de polices en moins de requêtes.

Utilisez les plugins et les outils uniquement sur les pages nécessaires à l'aide de Asset CleanUp Pro.

Pour l'instant, nous avons effectué quelques optimisations à l'aide d'Asset CleanUp pour améliorer la vitesse de chargement du site - mais il existe quelques fonctionnalités plus étonnantes disponibles dans ce plugin dont nous ne sommes pas au courant.

Ces fonctionnalités peuvent inclure le chargement de plugins dans une publication spécifique du site Web.

En termes simples, supposons que vous utilisiez le « Contact Form 7 » (plugin le plus populaire pour créer un formulaire de contact) sur votre site Web et que vous l'utilisiez sur une « page de contact » spécifique sur votre site Web.

Mais le principal problème avec ce plugin est qu'il charge son fichier CSS & JS dans la section <head> de votre site et donc, il augmente deux requêtes supplémentaires sur toutes les pages (y compris la page de contact) - Mais nous n'en avons besoin que pour charger sur la page spécifique, et c'est la page de contact .

Par example; Si vous cochez TheVPNCoupon, j'utilise le plugin "Contact form 7" sur la page Contact et sur les autres articles/pages comme "Best Animated Movies", je n'utilise aucun formulaire de contact - mais il charge quand même le CSS & JS du plugin Contact Form 7 sur ces pages (vous pouvez vérifier dans l'image ci-dessous).

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Charge les fichiers inutiles du formulaire de contact 7

Mais comment pouvez-vous résoudre ce problème?

La solution est très simple, il vous suffit de publier la publication ou la page, puis de cliquer à nouveau sur l'option " Modifier la publication/la page ", puis ce plugin chargera tous les fichiers dans le tableau de bord de la publication WordPress.

Et puis déchargez le fichier CSS & JS spécifique de l'option Asset CleanUp.

Par example; Si je crée une page « Contactez-nous » sur mon site à l'aide du plug-in « Formulaire de contact 7 », je publierai la page une fois qu'elle sera prête, puis je cliquerai à nouveau sur l'option « Modifier la page » .

Une fois que nous avons cliqué sur la page d'édition, tous les fichiers demandés ou chargés lorsque quelqu'un charge la page de contact s'affichent.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Asset CleanUP (Optimiser la demande de plugin)

Nous allons maintenant apporter quelques modifications aux paramètres et décharger le CSS et le JS du formulaire de contact 7 de toutes les pages à l'exception de la page de contact (vous pouvez effectuer les mêmes réglages que nous avons effectués dans l'image ci-dessus).

Haut

3.3 Optimiser les images sur le site Web

Comme vous le savez, l'optimisation des images est l'un des facteurs les plus importants pour ralentir la vitesse de votre site Web. C'est la principale source de ralentissement des sites, nous devons donc toujours compresser nos images avant de les télécharger sur votre site Web.

Même lorsque vous consultez l'un de nos articles de blog sur TheGuideX,

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization

… les images sont plus lourdes que toute autre chose sur mon site Web.

Par conséquent, l'optimisation des images devrait entraîner les améliorations les plus significatives de la vitesse de votre site Web, et c'est le cas.

Nous savons tous que les images sont essentielles pour tout site Web, mais l'utilisation d'images de très haute qualité n'est pas recommandée. Ainsi, nous devons nous assurer que l'image que nous téléchargeons est correctement optimisée.

Vous devez compresser les images de manière à ne pas diminuer la qualité globale de votre image, mais seulement à en réduire la taille.

À cette fin, j'ai créé un site Web sur l'optimisation des images, et vous pouvez utiliser ce site pour optimiser vos images avant de les télécharger dans WordPress.

Pour optimiser correctement vos images, vous devez suivre ces cinq étapes ;

  • Téléchargez des images de la bonne taille.
  • Utilisez les sites Web d'optimisation d'images en ligne pour compresser les images ( recommandation : TinyPNG et ImageOptimizer.org).
  • Utilisez le plugin WordPress pour une optimisation supplémentaire ( Recommandation : « Compresser les images JPEG et PNG par TinyPNG »).
  • Utilisation du formatage d'image approprié.
  • Utilisation de CDN pour les images ( Recommandation : ImageKit)
Utiliser le bon type de format d'image

Les deux types d'images les plus couramment utilisés sur le Web sont les JPG et les PNG.

Et ils ne sont pas pareils;

  • JPEG : Les images JPEG sont utilisées sur les sites Web pour des images plus complexes contenant de nombreuses informations de couleur.
  • PNG : Les images PNG sont parfaites pour les images et les graphiques ayant peu d'informations sur les couleurs.
Exemple d'image JPEG
how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Exemple d'image JPEG
Détails de l'image
Format d'image JPEG
Taille de l'image 2.893kb
Taille d'image optimisée 607kb
% de compression d'image 79%
Description de l'image Image complexe avec beaucoup d'informations sur les couleurs.
Exemple d'image PNG
how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Exemple d'image PNG
Détails de l'image
Format d'image PNG
Taille de l'image 716kb
Taille d'image optimisée 173kb
% de compression d'image 75%
Description de l'image Image simple avec peu d'informations sur les couleurs

Dans les exemples ci-dessus, j'ai montré une image JPG avec une compression d'image de 79% et une image PNG avec un niveau de compression similaire - Mais la taille compressée de l'image JPEG est bien supérieure à la taille d'origine de l'image PNG en raison de leur complexité et d'un beaucoup d'informations sur les couleurs.

Ainsi, la prochaine fois que vous téléchargerez des images sur votre site Web, assurez-vous d'utiliser le bon format d'image.

Haut

3.4 Optimisation de la base de données à l'aide de WP-Optimize

À partir de maintenant, nous avons optimisé notre site en utilisant WP Rocket et Asset CleanUp, mais si vous pensez toujours que votre site Web prend beaucoup plus de temps à charger, vous pouvez optimiser votre base de données et supprimer les révisions de la publication.

Parfois, lorsque nous mettons à jour le contenu de notre site Web ou lorsque nous écrivons quelque chose sur l'éditeur WordPress, il enregistre automatiquement la révision de la publication dans notre base de données.

L'optimisation de la base de données est donc un autre processus très utile et important pour augmenter la vitesse d'un site Web.

Pour ce faire, nous utiliserons un plugin WordPress gratuit nommé « WP-Optimize ». Le plugin est développé par Team Updraft, qui a également développé un plugin incroyable, que je recommande pour la sauvegarde de votre site.

Pour utiliser ce plugin, installez simplement le plugin « WP-Optimize » depuis le repo WordPress.

Mais avant de procéder à l'optimisation de la base de données, je vous recommanderai toujours de faire d'abord une sauvegarde.

Une fois le plugin installé, je vous recommande de faire une sauvegarde de votre base de données puis d'aller dans « WP-Optimize » > « Base de données ». Et lorsque vous êtes sur la page de la base de données, cliquez sur « Exécuter toutes les optimisations sélectionnées » et cela commencera à optimiser la base de données.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
WP-Optimize (Optimisation de la base de données)

Cela prendra quelques minutes pour optimiser votre base de données, et une fois cela fait, il supprimera toutes les révisions de publication, les commentaires de spam, les commentaires en attente, les rétroliens, les publications supprimées et les brouillons automatiques.

Ne vous inquiétez pas!

Vos messages et brouillons resteront en sécurité. Il ne supprimera aucun de vos messages publiés ou brouillons sur votre site Web, mais il ne supprimera que les révisions. Vous êtes donc en sécurité.

Recommandations : J'utilise ce plugin au quotidien pour supprimer les spams et les commentaires en attente. Cela m'aide également à supprimer les révisions de publication et à optimiser efficacement la base de données.

Même lorsque j'écrivais cet article, WordPress a enregistré plus de 40 révisions dans une base de données, ce qui rend ma page d'éditeur d'articles très lente - Mais après avoir utilisé ce plugin, tout est corrigé. Et puis, j'ai recommencé à écrire cet article monstre.

Haut

3.5 N'utilisez pas ces plugins sur votre site Web

Certains plugins peuvent ralentir votre site Web et entraîner une utilisation élevée du processeur. Je vous suggérerai toujours de ne pas utiliser de plugins lourds sur votre site Web.

Ces plugins peuvent inclure ;

  • Vérificateur de lien brisé
  • Jet pack
  • Messages similaires
  • SumoMe
  • Ajoute ça
Haut

Dans cette étape, nous avons utilisé quelques plugins WordPress pour optimiser efficacement notre site, et si vous vérifiez le résultat GTmetrix & Pingdom de votre site Web, vous verrez une augmentation instantanée des performances.

Mais l'optimisation de la vitesse ne consiste pas uniquement à optimiser le site avec l'utilisation de certains plugins ou d'un thème WordPress à chargement rapide.

Il y a beaucoup plus de choses à faire si vous souhaitez augmenter les performances globales de votre site Web. Par exemple, en utilisant un CDN sur votre site Web et en servant les fichiers, images ou données à partir du serveur disponible le plus proche.

4. Utilisation d'un réseau de diffusion de contenu (CDN)

Avant d'expliquer comment vous pouvez utiliser un CDN pour augmenter les performances de votre site Web, nous allons d'abord apprendre ce qu'est un CDN et comment il peut aider à améliorer les performances du site Web.

Qu'est-ce qu'un CDN ou Content Delivery Network ?

Selon Akamai, un CDN (Content Delivery Network) est une plate-forme de serveurs hautement distribuée qui permet de minimiser les retards de chargement du contenu des pages Web en réduisant la distance physique entre le serveur et l'utilisateur. Cela permet aux utilisateurs du monde entier de visualiser le même contenu de haute qualité sans ralentir les temps de chargement.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Comment fonctionne CDN (Source de l'image : CrazyEgg)

Alors, comment cela peut-il aider à augmenter les performances du site Web ?

La réponse est; Chaque fois que vous visitez un site Web, il fait des demandes au serveur distant, et ce serveur répond avec les données. La transmission des données se fait sur l'internet public, et cela entraîne un certain retard.

Et si nous réduisons la distance entre votre machine locale et le serveur, cela réduira sûrement le temps de retard et augmentera les performances du site Web.

Par example; Si vous venez d'Inde et que vous visitez notre site TheGuideX, votre machine locale demande des ressources au serveur. Si j'héberge mon site Web sur un serveur proche des États-Unis. Ici, il faudra environ 200 à 300 ms pour demander les ressources , et cela entraîne un certain retard.

Mais que se passe-t-il si les données de mon site Web sont transmises à votre machine locale à partir d'un centre de données basé à Mumbai (ou d'un placard de centre de données pour vous). Cela réduira le temps de demande de 200-300 ms à 30-40 ms . De cette façon, nous pouvons définitivement éviter ces latences en diminuant considérablement la distance.

Nous avons donc maintenant compris l'utilisation du CDN sur notre site Web et comment il est essentiel d'augmenter les performances globales de notre site Web.

Nous allons maintenant discuter de certains CDN pour augmenter les performances de notre site Web ;

4.1 Utiliser Cloudflare sur le site Web

Le tout premier CDN que la plupart des gens utilisent sur leur site Web est Cloudflare.

Cloudflare a construit un vaste réseau mondial de centres de données qui mettent en cache le contenu statique plus près des utilisateurs et fournissent du contenu dynamique sur les liens backbone privés les plus rapides et les plus fiables.

Configurer Cloudflare sur votre nom de domaine est très simple ; il vous suffit de changer vos serveurs de noms de l'hôte actuel vers Cloudflare, puis vous pouvez facilement gérer votre DNS directement depuis Cloudflare.

Vous pouvez suivre cette vidéo pour configurer Cloudflare sur votre nom de domaine. Une fois que Cloudflare est actif sur votre nom de domaine, nous apporterons quelques modifications pour optimiser les performances de notre site Web.

Une fois que Cloudflare est actif sur votre nom de domaine, connectez-vous à votre compte Cloudflare, puis sélectionnez votre site Web dans le tableau de bord.

Maintenant, allez sur la page SSL/TLS et définissez le SSL sur Flexible . Vous pouvez également définir les paramètres SSL sur Complet - Mais avant de définir le paramètre SSL sur Complet, assurez-vous que votre site Web utilise déjà un SSL.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Paramètres SSL de Cloudflare

Si vous n'êtes pas sûr de cela, je vous recommanderai de définir les paramètres SSL sur Flexible. En mode flexible, les données sont cryptées entre la machine locale de l'utilisateur et Cloudflare uniquement ( Machine locale (sécurisée) -> Cloudflare (non sécurisé) -> Serveur Web ).

Mais si vous utilisez les paramètres SSL complets , les données sont cryptées de la machine locale à votre serveur ( Machine locale (sécurisée) -> Cloudflare (sécurisé) -> Serveur Web )

Une fois que vous avez configuré le SSL sur votre site Web, accédez aux paramètres du certificat Edge dans SSL et activez " Toujours utiliser HTTPS", " TLS 1.3 ", et activez les " Réécritures HTTPS automatiques".

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Cloudflare (Toujours utiliser HTTPS)

Nous avons maintenant terminé la configuration du SSL sur notre site Web en utilisant SSL. Après cette étape, cliquez sur les paramètres de vitesse , puis cliquez sur Optimisation sous les paramètres de vitesse .

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Cloudflare (Paramètres d'optimisation de la vitesse)

Une fois que vous êtes sur la page Optimisation dans Speed, activez la minification automatique pour JavaScript, CSS et HTML.

Et puis activez la compression Brotli sur votre site Web. Brotli est un algorithme de compression développé par Google et qui sert le mieux à la compression de texte.

Voici quelques fonctionnalités d'utilisation de la compression Brotli sur votre site Web.

  • Les fichiers JavaScript compressés avec Brotli sont 14 % plus petits que gzip.
  • Les fichiers HTML sont 21 % plus petits que gzip.
  • Les fichiers CSS sont 17 % plus petits que gzip.

Remarque : les images ne doivent pas être compressées ni par gzip ni par Brotli car elles sont déjà compressées, et les compresser à nouveau augmentera leur taille.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Cloudflare (Rocket Loader sous les paramètres d'optimisation de la vitesse)

Une fois que vous avez activé la compression Brotli sur votre site Web, vous pouvez faire défiler jusqu'à l'option Rocket Loader , puis l'activer. Par défaut, ce paramètre est activé, mais parfois ce plugin entre en conflit avec le plugin WP Rocket et peut causer des problèmes.

Nous passons maintenant aux paramètres de cache dans Cloudflare, puis définissons le niveau de mise en cache sur " Standard " et le cache du navigateur TTL sur " 1 an " respectivement.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Cloudflare (Paramètres de cache)

Une fois que vous avez activé ces paramètres, faites défiler jusqu'à Toujours en ligne et cliquez pour l'activer. Avec ces paramètres, si de toute façon votre serveur tombe en panne, Cloudflare servira les pages statiques de votre site Web à partir de leur cache.

Vous pouvez en savoir plus sur les paramètres recommandés ici.

Maintenant, la chose la plus importante est de configurer les Page Rules sur notre blog en utilisant Cloudflare.

Pour ce faire, ouvrez les paramètres Page Rules dans Cloudflare. Avec le plan gratuit de Cloudflare, nous ne pouvons créer que des règles de 3 pages, et si vous souhaitez créer plus de règles de 3 pages, vous devez acheter plus de règles de page auprès de Cloudflare.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Règles de page que j'utilise sur mon site Web

Comme vous pouvez le voir dans l'image ci-dessus, j'ai créé une règle de 3 pages sur mon site Web TheGuideX pour améliorer ses performances. Ces règles de 3 pages sont l'une des règles les plus importantes qui aident à optimiser notre site Web.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Cloudflare (créer une règle de page)

Maintenant, la première chose à faire est de cliquer sur le bouton Créer une règle de page affiché en bleu. Une fois que nous cliquons dessus, une page s'ouvrira à partir de laquelle nous pourrons créer notre première règle de page.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Création de notre première règle de page

Comme vous pouvez le voir dans l'image ci-dessus, dans le premier champ, nous devons entrer l'URL de la page où nous devons appliquer les paramètres de règle de page, puis nous devons choisir les paramètres dans le menu déroulant. Une fois que nous avons terminé, cliquez sur le bouton Enregistrer et déployer pour activer ces règles de page.

Règle de première page pour Cloudflare

Donc la première règle est;

  • URL : example.com/wp-login.php
  • Règle (à sélectionner dans la liste déroulante) : Niveau de sécurité, puis sélectionnez Élevé ou Je suis attaqué

Exemple;

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Cloudflare (règle de la première page)

Utilisation de cette règle de page

Cette règle de page ajoute une couche de sécurité supplémentaire à votre fichier wp-login.php. Chaque fois que quelqu'un essaie de se connecter à votre tableau de bord WordPress, il vérifie d'abord l'intégrité du navigateur et empêche les attaques par force brute sur votre site Web.

Nous pouvons également utiliser quelques plugins pour empêcher notre site Web des attaques par force brute, mais ces types de plugins nécessitent d'énormes ressources de site Web et peuvent ralentir votre site Web. Par conséquent, nous utilisons Cloudflare pour empêcher notre page de connexion des tentatives malveillantes.

Règle de deuxième page pour Cloudflare

La deuxième règle est;

  • URL : example.com/wp-admin/*
  • Règle (à sélectionner dans la liste déroulante) : Désactiver les performances

Exemple;

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Cloudflare (règle de la deuxième page)

Utilisation de cette règle de page

Cette règle de page a désactivé les performances dans le dossier wp-admin. Le désactiver désactivera la minification, Rocket Loader, Mirage et Polish sur le côté backend de votre site.

Règle de la troisième page pour Cloudflare

La troisième règle est;

  • URL : example.com/wp-content/*
  • Règle 1 : Browser Cache TTL => un an
  • Règle 2 : Toujours en ligne => Activé
  • Règle 3 : Niveau de cache => Tout mettre en cache
  • Règle 4 : Edge Cache TTL => un mois

Exemple;

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Cloudflare (règle de la troisième page)

Utilisation de cette règle de page

La troisième règle de page fonctionne dans le dossier wp-content et elle met en cache tout ce qui se trouve dans le dossier wp-content et le cache du navigateur expire TTL est le moment où Cloudflare demande au navigateur d'un visiteur de mettre en cache une ressource.

Jusqu'à l'expiration du délai, le navigateur charge les ressources du cache local, ce qui contribue à accélérer le site Web.

Et Edge Cache TTL est un paramètre qui contrôle la durée pendant laquelle les serveurs Cloudflare mettront en cache une ressource avant de demander la nouvelle copie.

Si vous avez implémenté les mêmes paramètres sur votre site Web à l'aide de Cloudflare, il y a de nombreuses chances que votre site Web commence à bien fonctionner sur GTmetrix et d'autres outils de test de vitesse de page.

Et jusqu'à présent, nous venons de partager un CDN pour améliorer les performances globales de notre site Web. Nous allons maintenant partager quelques autres CDN qui peuvent fonctionner avec Cloudflare CDN.

Haut

4.2 Utiliser ImageKit pour l'optimisation des images

Nous allons maintenant utiliser ImageKit pour optimiser nos images en temps réel. C'est l'un des réseaux CDN d'optimisation et de transformation d'image en temps réel qui aide le site Web à réduire la taille réelle des photos sans réellement avoir d'effet sur la qualité visuelle visible de l'image.

L'une des meilleures choses que j'ai le plus aimé dans ce CDN est l'intégration rapide avec l'application comme WordPress. Il offre des prix raisonnables, et j'ai trouvé que c'était une bien meilleure option à choisir pour une meilleure optimisation de l'image.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Tarification ImageKit

ImageKit propose trois types de tarification pour CDN, et vous pouvez le choisir en fonction des besoins de votre site Web (j'utilise le Forever Free Plan sur mon site Web).

Obtenez ImageKit gratuitement

Une fois que vous avez choisi la tarification et que vous vous êtes inscrit sur leur plate-forme, vous devez créer un End Point . Une fois que vous avez créé le point final , vous obtiendrez l' URL CDN (vérifiez l'image ci-dessous)

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
ImageKit (Création d'un point final)

Comme vous pouvez le voir, j'ai créé une URL CDN basée sur un serveur Web pour le nom de domaine TheGuideX . Mon URL CDN est https://ik.imagekit.io/tgx/

Si l'image originale est accessible sur https://theguidex.com/rest/of/the/path/image.jpg ,

Ensuite, la même image principale est accessible via l'URL ImageKit.io https://ik.imagekit.io/tgx/rest/of/the/path/image.jpg

Une fois que nous avons obtenu l'URL ImageKit, nous devons l'activer sur notre site Web WordPress. Pour ce faire, nous devons ouvrir les paramètres CDN de WP Rocket en visitant le panneau d'administration WordPress > Paramètres > WP Rocket > CDN,

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
WP Rocket (Paramètres CDN)

Une fois que nous sommes sur la page CDN, nous devons activer le CDN pour notre site Web, puis dans le champ entrer l'URL d'ImageKit et sur le paramètre " réserver pour" , changez-le en images.

Une fois que vous l'avez fait, WP Rocket ne réécrit que l'URL des images du nom https://theguidex.com vers https://ik.imagekit.io/tgx. Ainsi, vos images commenceront à se charger à partir de l'URL CDN en temps réel.

Une fois ces modifications apportées, nous allons maintenant effectuer quelques optimisations dans ImageKit pour de meilleures compressions et la livraison d'images.

Et pour ces ajustements d'optimisation, nous nous connectons à nouveau au tableau de bord ImageKit, puis cliquez sur les paramètres d'image.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
ImageKit (page des paramètres d'image)

Une fois sur la page Paramètres d'image , vous pouvez personnaliser les paramètres en fonction de vos besoins.

Ici, comme vous pouvez le voir, j'ai activé le " Utiliser le meilleur format pour la livraison d'images" et j'ai également activé la qualité d'image à 70%.

Vous pouvez également le définir selon vos besoins, mais je vous recommande de ne pas diminuer la taille des images en dessous de 70 %.

Si vous le souhaitez, vous pouvez également activer les paramètres de l'économiseur de données. Si un utilisateur de votre site Web utilise le mode Data Saver sur son navigateur, ImageKit utilisera différentes méthodes, y compris la réduction de la qualité et l'absence de prise en charge automatique du DPR, ce qui rend les images plus légères et se charge plus rapidement.

Et à côté des paramètres d' optimisation , vous aurez une option d' optimisation du réseau. Dans les paramètres d'optimisation du réseau, vous aurez la possibilité de servir la qualité des images en fonction du type de réseau des utilisateurs.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
ImageKit (optimisation du réseau)

La plupart du temps, les gens utilisent des appareils 4G. Examinez attentivement vos analyses pour en savoir plus sur le type de réseau. Si vous découvrez que des personnes utilisent le réseau le plus lent pour accéder à votre site Web, vous pouvez définir manuellement la qualité de livraison des images à partir d'ici.

Ce sont donc les paramètres les plus importants pour ImageKit, mais vous pouvez définir beaucoup plus de paramètres à partir de leur page Paramètres d'image .

Ces paramètres peuvent inclure le réglage manuel de la hauteur et de la largeur de l'image pour les appareils mobiles et de bureau, l'enregistrement d'une copie de vos images, etc., mais nous ne discuterons pas de ces paramètres dans cet article, et ils ne nous sont d'aucune utilité.

Nous allons maintenant passer à la troisième partie de l'utilisation d'un CDN sur notre site Web. Et dans cette étape, nous vous montrerons comment implémenter et utiliser Cloudfront sur notre site Web pour JS & CSS.

Haut

4.3 Utiliser Amazon Cloudfront pour JS et CSS

Comme vous le savez, Amazon CloudFront est l'un des CDN les plus populaires jamais obtenus, et les plus grands sites Web du monde s'appuient sur le service CDN Amazon CloudFront.

Ils disposent de 61 serveurs déployés dans le monde entier, capables de transmettre et de diffuser plus rapidement les images des sites Web à des emplacements spécifiques.

Tout d'abord, cliquez sur « Commencer avec Amazon Cloudfront» et inscrivez-vous sur leur site Web en utilisant votre identifiant Amazon existant, ou vous pouvez également utiliser un nouvel identifiant de messagerie pour vous inscrire sur leur plate-forme.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
AWS Cloudfront (Création d'une distribution)

Une fois connecté au compte Amazon AWS, recherchez Cloudfront (vous pouvez également cliquer ici pour visiter directement la page Cloudfront), puis cliquez sur « Créer une distribution » , puis sélectionnez la propriété Web et cliquez sur « Commencer ».

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization

Dans Nom de domaine d'origine, entrez votre nom de domaine. Dans ce cas, mon nom de domaine est https://theguidex.com, donc j'entre dans theguidex.com (sans www ni https).

À côté, vous devez entrer le chemin d'origine , entrer le chemin d'accès à votre dossier wp-content, puis sélectionner TLSv1 dans le protocole SSL et sélectionner " Match Viewer" dans le protocole d'origine.

Maintenant, faites défiler jusqu'à « Paramètres de distribution » , puis sélectionnez « Utiliser tous les emplacements périphériques » dans la catégorie de prix et définissez les paramètres SSL CloudFront par défaut.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Répartition AWS

Vous pouvez également définir la version HTTP prise en charge et la modifier en « HTTP/2, HTTP/1.1, HTTP/1.0 ». Une fois que vous avez fait ces réglages, cliquez sur « Créer une distribution ».

Il faudra quelques minutes pour créer une distribution dans Cloudfront, et une fois qu'elle est créée, vous devez attendre environ 5-6 heures (dans mon cas, cela prend 7-8 heures pour fonctionner correctement).

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Distribution en mode cloud

Allez à nouveau sur la page de distribution Cloudfront et vérifiez si votre distribution est correctement activée (elle apparaîtra dans le texte de couleur verte sous la section d'état).

Une fois activé, cliquez sur l' ID de votre domaine d'origine.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
AWS Cloudfront (Obtenir CDN)

Lorsque vous cliquez sur l'ID de distribution, une page similaire à celle que j'ai montrée dans l'image ci-dessus s'ouvre. Copiez le nom de domaine (affiché dans la case rouge) et collez-le dans la section CDN de WP Rocket.

Une fois que vous avez collé le nom de domaine dans WP Rocket, sélectionnez le réservé à => « Javascript/CSS ».

Vous avez maintenant configuré avec succès AWS Cloudfront sur votre nom de domaine.

Haut

Ces paramètres sont suffisants pour que votre site Web augmente ses performances dans Google PageSpeed ​​Insight, GTmetrix et Pingdom. Vous pouvez maintenant constater une croissance instantanée des performances de votre site Web.

Néanmoins, si vous ne savez pas comment augmenter la vitesse de votre site Web ou si vous avez besoin d'un service d'optimisation de la vitesse de votre site Web, vous pouvez me joindre à [email protected] .

Jusqu'à présent, nous avons fait presque tout ce qui était possible pour optimiser la vitesse de notre site Web. Mais si vous êtes un utilisateur avancé, je partage quelques méthodes supplémentaires qui vous aideront à augmenter la vitesse de votre site Web.

Mais si vous êtes débutant ou si vous n'avez aucune connaissance technique, je vous recommande de contacter votre support d'hébergement pour gérer ce genre de choses.

Réglage fin de WordPress pour la vitesse (avancé)

Dans cette méthode d'optimisation de la vitesse de WordPress, nous partageons quelques conseils avancés qui fonctionnent à merveille pour optimiser la vitesse de votre site Web.

1. Utilisez la dernière version de PHP

La première méthode pour optimiser votre site Web consiste donc à utiliser la dernière version de PHP. Le nouveau PHP 7 est deux fois plus rapide que ses prédécesseurs. C'est une énorme amélioration des performances dont votre site doit tirer parti.

Pourquoi utiliser la dernière version de PHP ?

Si vous ne savez pas pourquoi utiliser la dernière version de PHP sur votre site Web, voici la réponse. WordPress est principalement écrit en langage PHP, et PHP est un langage côté serveur.

Donc, si vous utilisez la dernière version de PHP sur votre site Web, vous pouvez augmenter les performances de votre site Web. La version la plus récente et stable de PHP est la v7.4 ; J'utilise même cette version de PHP sur ce site.

Vous pouvez voir quelle version de PHP votre site utilise en installant et en activant le plugin Version Info.

2. Limiter les révisions après

Parfois, nous oublions d'optimiser notre base de données à l'aide de plugins comme WP-Optimize, et comme je l'ai mentionné ci-dessus, lorsque j'écrivais cet article, il a enregistré plus de 40 révisions dans ma base de données.

Parfois, l'enregistrement automatique d'autant de révisions peut réduire les performances de votre site Web au pire niveau. Vous pouvez facilement limiter le nombre de révisions que WordPress conserve pour chaque article.

Ajoutez cette ligne de code à votre fichier wp-config.php.

 définir( 'WP_POST_REVISIONS', 4 );

3. Désactivez le hotlinking et le leeching de votre contenu

Parfois, si nous créons du contenu de qualité sur notre site Web, il est volé en utilisant RSS, et parfois d'autres sites Web diffusent vos images directement à partir de leurs URL sur votre site Web, au lieu de les télécharger sur leurs propres serveurs.

De cette façon, cela nuit à votre site car ils volaient la bande passante de votre site Web et vous n'en tirez aucun avantage.

Donc, dans ce cas, nous devons utiliser le code .htaccess pour bloquer le hotlinking des images afin d'économiser les ressources et la bande passante de votre site Web. Le code est le suivant ;

 #désactiver le lien direct des images avec l'option d'image interdite ou personnalisée
RewriteEngine sur
RéécritureCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?theguidex.com [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?google.com [NC]
Règle de réécriture \.(jpg|jpeg|png|gif)$ – [NC,F,L] 

Remarque : n'oubliez pas de remplacer theguidex.com par votre propre nom de domaine.

Vous pouvez également désactiver le flux RSS si vous ne l'utilisez pas sur votre site Web.

4. Utilisez le pare-feu de site Web de niveau DNS

Un autre facteur le plus important pour l'optimisation de la vitesse est l'utilisation d'un pare-feu de site Web de niveau DNS. Si vous vous en souvenez, j'ai créé une règle de page Cloudflare sur theguidex.com/wp-login.php pour augmenter la sécurité de ma page de connexion.

Eh bien, j'utilise également la version premium de Wordfence sur mon site Web, c'est un plugin fantastique, et il aide à bloquer les menaces, les attaques par force brute en temps réel mais sans aucun doute ; c'est un plugin lourd, et il faut beaucoup de ressources de mon site Web pour lutter contre les menaces.

Et pour éviter une utilisation élevée des ressources du processeur, j'utilise des pare-feu de site Web de niveau DNS sur mon site Web. Assurez-vous donc que vous utilisez des pare-feu de niveau DNS pour améliorer les performances de votre site Web et arrêter les menaces au niveau DNS.

5. Réduisez les appels de base de données

Cette étape est un peu plus complexe et nécessite des connaissances techniques pour réduire les appels à la base de données depuis votre thème. Il existe de nombreux thèmes mal codés qui ne suivent pas les directives de WordPress et font trop d'appels inutiles à une base de données.

Ces thèmes peuvent ralentir votre site Web et le réduire, réduire les appels à la base de données et augmenter les performances globales de votre site Web.

Même certains des thèmes codés propres et bien optimisés font des appels de base de données inutiles pour obtenir des informations de base de la base de données. Créez donc un thème enfant et ajoutez statiquement ces informations de base pour réduire le nombre d'appels à la base de données.

6. Divisez les commentaires en pages

Si vous recevez beaucoup de commentaires sur votre blog, alors tout d'abord, félicitations ! C'est un excellent signe de construction d'un grand public.

Mais l'inconvénient est que le chargement d'un message avec tous les commentaires peut ralentir la vitesse.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Diviser les commentaires en différentes pages

Dans ce cas, vous pouvez diviser les commentaires en différentes pages pour improviser davantage la vitesse de vos pages Web. Le processus est simple, allez simplement dans Paramètres » Discussion et cochez la case à côté de l'option « Diviser les commentaires en pages ».

7. Vérification de la compression GZIP

La compression GZIP est un autre facteur crucial pour augmenter la vitesse d'un site Web. Si vous utilisez le plugin wp rocket sur votre site Web, il l'active automatiquement pour vous.

La compression GZIP est activée côté serveur et aide à compresser la taille des fichiers HTML, JS et CSS. Cela ne fonctionnera pas sur les images car celles-ci sont déjà compressées d'une manière différente.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Vérifier la compression GZIP

Vous pouvez utiliser des outils comme Vérifier la compression GZIP pour vérifier si votre site Web utilise GZIP ou non.

Si votre site n'utilise pas GZIP, vous pouvez utiliser ce code dans votre fichier .htaccess pour activer GZIP sur votre site Web. Mais assurez-vous que vous utilisez le serveur apache sur votre site avant d'utiliser ce code.

 # Compresser HTML, CSS, JavaScript, Texte, XML et polices
  AddOutputFilterByType DEFLATE application/javascript
  AddOutputFilterByType DEFLATE application/rss+xml
  AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
  AddOutputFilterByType DEFLATE application/x-police
  AddOutputFilterByType DEFLATE application/x-font-opentype
  AddOutputFilterByType DEFLATE application/x-font-otf
  AddOutputFilterByType DEFLATE application/x-font-truetype
  AddOutputFilterByType DEFLATE application/x-font-ttf
  AddOutputFilterByType DEFLATE application/x-javascript
  AddOutputFilterByType DEFLATE application/xhtml+xml
  AddOutputFilterByType DEFLATE application/xml
  AddOutputFilterByType DEFLATE font/opentype
  AddOutputFilterByType DEFLATE font/otf
  AddOutputFilterByType DEFLATE font/ttf
  AddOutputFilterByType DEFLATE image/svg+xml
  AddOutputFilterByType DEFLATE image/x-icon
  AddOutputFilterByType DEFLATE texte/css
  AddOutputFilterByType DEFLATE texte/html
  AddOutputFilterByType DEFLATE texte/javascript
  AddOutputFilterByType DEFLATE text/plain
  AddOutputFilterByType DEFLATE texte/xml

  # Supprimer les bogues du navigateur (nécessaire uniquement pour les très anciens navigateurs)
  BrowserMatch ^Mozilla/4 gzip-only-text/html
  BrowserMatch ^Mozilla/4\.0[678] sans gzip
  BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
  En-tête ajouter Vary User-Agent

8. Utiliser la prélecture

La prélecture des ressources est une autre excellente technique d'optimisation pour augmenter les performances de votre site Web. Nous pouvons l'utiliser pour indiquer au navigateur les ressources dont l'utilisateur pourrait avoir besoin à l'avenir, avant même qu'il n'en ait besoin.

En tant que développeur, nous connaissons mieux les applications que le navigateur. Nous utilisons donc ces informations pour informer le navigateur des ressources principales.

Par example,

 < lien rel = " prefetch " href = " image.png " >

9. Réduisez l'utilisation des polices Web

Parfois pour rendre un texte accrocheur, on utilise plusieurs polices web – Mais le plus gros inconvénient d'utiliser trop de polices web est que cela augmente le temps de rendu de la page. Cela ajoute également une requête HTTP supplémentaire aux ressources externes. Et d'une manière générale, vous souhaitez réduire au minimum les requêtes HTTP.

how to optimise website, optimise the loading time of blog, optimize wordpress website, optimize wordpress website speed, slow loading wordpress, speed optimization, website optimization wordpress, Wordpress speed optimization
Limitation des polices Web

Comme vous pouvez le voir dans l'image ci-dessus, je n'utilise que quatre polices Web sur mon site Web, dont j'ai réellement besoin. Vous devez également vous assurer que votre blog n'utilise pas des tonnes de polices Web inutiles pour réduire le temps de rendu de votre page.

Haut

Maintenant c'est ton tour

Parmi les différentes façons d'optimiser vos blogs WordPress, j'ai partagé quelques techniques d'optimisation, que j'utilise personnellement sur mon propre site Web pour l'optimisation de la vitesse. Ces méthodes sont simples et faciles à mettre en œuvre.

Et maintenant, il est temps d'investir une heure pour améliorer la vitesse de votre site WordPress.

Et croyez-moi, une fois que vous aurez soigneusement optimisé votre blog en utilisant ces méthodes, les performances de vos sites Web augmenteront et cela améliorera également le temps de chargement global du site Web.

J'espère que cet article vous donnera une clarification claire sur certains des moyens efficaces d'augmenter la vitesse de votre blog WordPress, et si vous avez trouvé cet article utile, faites-le nous savoir dans la section des commentaires. Et si vous utilisez une autre méthode pour optimiser votre site Web, faites-le moi savoir dans la section des commentaires ci-dessous.