Tutioriel WordPress

Astuces pour optimiser un site WordPress

Dans cet article nous allons voir quelques modules et manipulations à mettre en place pour optimiser votre site WordPress.
Cela aura pour but d’améliorer le chargement de votre site, mais aussi votre référencement.

Yoast SEO

J’en avais parlé dans un article, mais Yoast SEO fait partie des indispensables si vous souhaitez améliorer votre référencement.

Le plugin est simple d’utilisation et vous indique au travers plusieurs étapes, comment le configurer correctement.

Lors de la saisie de vos contenus, vous pouvez consulter ce qu’il faut corriger pour que votre article remonte dans les moteurs de recherche.

Des indicateurs clairs de ce qu’il faut corriger

Si vous respectez bien ses consignes, vous verrez que vos articles remonterons plus facilement (en fonction de votre sujet évidement).

Autoptimize

Plugin très complet, qui vous donne la possibilité de mettre vos fichiers en cache, gérer comment sont chargés vos fichiers CSS et Javascript.
Il sera votre principal allié pour faire monter votre score.

Je ne peux pas vraiment vous donner de configuration précise, car c’est en fonction du site/thème utilisé. Mais généralement, je coche les cases :

  • Optimiser CSS/JS/HTML
  • Pour les images utiliser le Lazy-loading pour charger les images au fur et à mesure que l’utilisateur scroll
  • Mettre le jQuery en Async (ATTENTION cela peut générer des erreurs)
  • Tester de mettre un à un vos fichiers javascript en async ou defer
  • Utiliser les schema markup

    Les schémas sont des fichiers JSON qui, pour faire simple, permettent aux robots de comprendre plus facilement le sens des informations se trouvant sur votre site.
    Je vous invite à consulter le site schema.org pour consulter toutes les propriétés possibles.

    Optimiser vos images

    Ce qui reviendra souvent comme problème lorsque vous évaluez votre site, c’est la compression des images.
    Il existe plusieurs solutions:

    • Passer par un module comme Smush qui vous permettra de compresser vos images, forcer une résolution maximale (Smush gère aussi le Lazy-loading.)
    • Une autre solution si vous êtes sur un serveur dédié, est d’installer OptiPNG et JpegOptim pour le faire via votre serveur.

    Modifier le .htaccess pour gérer les caches

    Vous pouvez modifier la durée de mise en cache des différents types de fichiers via le .htaccess.

    Dans mon cas j’ai ajouté les lignes suivantes :

    <IfModule mod_headers.c>
     <FilesMatch "\.(ico|jpe?g|jpx|png|gif|swf|css|gz|svg|woff)$">
     Header set Cache-Control "max-age=31536000, public"
     </FilesMatch>
     <FilesMatch "\.(js)$">
     Header set Cache-Control "max-age=31536000, private"
     </FilesMatch>
    <filesMatch "\.(html|htm)$">
    Header set Cache-Control "max-age=31536000, public"
    </filesMatch>
    # Disable caching for scripts and other dynamic files
    <FilesMatch "\.(pl|php|cgi|spl|scgi|fcgi)$">
    Header unset Cache-Control
    </FilesMatch>
    </IfModule>

    Oui mais concrètement, ça donne quoi ?

    Voici mes résultats sur GTMetrix et sur Google PageSpeed :

    On est pas mal
    Résultat PageSpeed pour mobile - 84
    Il faudrait que je modifie le thème pour mobile
    Résultats PageSpeed pour PC - 99
    Sur PC on est pas mal

    Dans mon cas, ce blog n’atteint pas un score de 100%, mais on s’en rapproche.
    Il faut savoir qu’il est plus dur d’optimiser un site créé avec CMS si vous utilisez un thème qui n’est pas déjà créé correctement.
    Je n’ai pas encore trouvé la motivation de créer mon thème pour corriger les derniers détails.
    Si un jour j’y arrive… Je posterai les nouveaux résultats.

    Retirer les plugins superflu

    Dernier point, les différents plugins peuvent eux aussi vous poser problème. C’est pour cela qu’il faut en utiliser le moins possible.

    En effet, vous n’êtes pas à l’abri qu’un des plugins ne soit pas optimisé ou fasse appel à des scripts déjà chargés par votre site.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *