camel design logo transparent

WordPress accélérer son site et améliorer son référencement

Pour améliorer son référencement et accélérer son site Wordpress sous un serveur apache, il vous suffit d’activer la compression Gzip de votre hébergement Wordpress et la mise en cache de vos données pour les robots de référencement dans un premier temps et ajouter une extension de compression de vos images pour réduire la taille de votre contenu et qu’il soi transmit plus rapidement.

Comment optimiser WordPress ? ME DIREZ VOUS !

Simplement avec quelques règles à ajouter dans votre fichier htaccess présent d’origine à la racine de votre hébergement Wordpress, si vous avez indiqué une structure de permalien dans les paramètre de votre Wordpress (back-office => réglages => permaliens : nous vous conseillons : Titre de la publication).

Pour ce faire éditer votre fichier « .htaccess » à la racine de votre installation Wordpress, de base il comporte ceci :

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress

Il ne faut pas toucher à cette partie ! ces règles font fonctionner vos redirections Wordpress avec votre structure de permaliens choisie dans vos paramètres. Juste passer une ligne et ajouter ceci en dessous :

<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType text/css "access 1 month"
ExpiresByType text/html "access 1 month"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/x-icon "access 1 year"
ExpiresByType application/pdf "access 1 month"
ExpiresByType application/javascript "access 1 month"
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresDefault "access 1 month"
</IfModule>

<ifModule mod_headers.c>
<filesMatch "\.(ico|jpe?g|png|gif|swf)$">
Header set Cache-Control "public"
</filesMatch>
<filesMatch "\.(css)$">
Header set Cache-Control "public"
</filesMatch>
<filesMatch "\.(js)$">
Header set Cache-Control "private"
</filesMatch>
<filesMatch "\.(x?html?|php)$">
Header set Cache-Control "private, must-revalidate"
</filesMatch>
</ifModule>

<IfModule mod_headers.c>
   Header unset Etag
   Header set Connection keep-alive
</IfModule>
FileETag None

# BEGIN GZIP COMPRESSION
<IfModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file \.(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</IfModule>
# END GZIP COMPRESSION

<IfModule mod_deflate.c>
  # Compress HTML, CSS, JavaScript, Text, XML and fonts
  AddOutputFilterByType DEFLATE application/javascript
  AddOutputFilterByType DEFLATE application/rss+xml
  AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
  AddOutputFilterByType DEFLATE application/x-font
  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 text/css
  AddOutputFilterByType DEFLATE text/html
  AddOutputFilterByType DEFLATE text/javascript
  AddOutputFilterByType DEFLATE text/plain
  AddOutputFilterByType DEFLATE text/xml
  # Remove browser bugs (only needed for really old browsers)
  BrowserMatch ^Mozilla/4 gzip-only-text/html
  BrowserMatch ^Mozilla/4\.0[678] no-gzip
  BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
  Header append Vary User-Agent
</IfModule>

Enregistrer votre fichier et remplacer le dans votre hébergement Wordpress à la racine de votre site ! et voila rien qu’avec cette simple manipulation vous avez :

  • Activer la compression GZIP de vos contenus, il seront donc moins lourd, ils prendront donc moins d’espace sur votre hébergement et seront chargés plus rapidement
  • Activer la mise en cache de vos données par les robots de syndication, ils n’ont donc pas besoin de repasser tout le temps seulement en cas de changement d’un contenu. Et cela fonctionne également pour vos visiteurs ! leur navigateur enregistre vos données lors du premier passage et si ils reviennent sur votre site le cache prend le relais et ne recharge que le nécessaire, donc lors des nouvelles visites le site est chargé beaucoup plus rapidement.
  • Nous avons également désactiver les etags, et donc de réduis le nombre de requêtes et votre bande passante utilisée.

ET LES IMAGES ? Comment les compresser?

Avec la modification mise en place dans le htaccess nous compressons déjà le contenu distribué, mais nous pouvons encore améliorer la distribution de vos images en installant un plugin de compression des images pour Wordpress. Il en existe des tas, mais personnellement j’utilise : Imagify

Rendez vous dans votre back office wordpress et allez dans « Extensions => Ajouter » et rechercher : Imagify, installer et activer le !

De base, imagify vous accorde la compression gratuite de 25mo d’image par mois et 50mo si vous créez un compte gratuit chez eux et ensuite vous avez le choix :

  • Attendre le mois d’après pour récupérer votre limite gratuite.
  • Payer un abonnement mensuel ou annuel, si vous ajouter énormément de photo (si vous êtes photographe ou graphiste par exemple).
  • Acheter un pack de data plus gros à l’unité, exemple : 5go, 10go, ect…

Imagify compresse toutes vos images ! Celle déjà présente sur votre wordpress et les nouvelles à venir lors de leurs uploads et vous avez même une option pour ajouter des dossiers à scanner sur votre hébergement pour compresser leur contenu image : utile pour compresser les images présente d’origine dans votre thème ou si vous stocker des images dans dossier à part pour votre marketing.

Le plugin imagify propose 3 niveau de compression pour vos image wordpress :

  • Normal : optimiser sans perte, vos images seront optimisées sans aucun changement visible. Si vous souhaitez des images d’une qualité parfaite, nous vous recommandons ce niveau.
  • Agressif : permet une optimisation idéale de vos images sans perte de qualité notable. Cela permettra une réduction importante du poids initial avec une légère perte de la qualité d’image qui n’est pas perceptible à l’œil humain.
  • Ultra : Ce niveau appliquera toutes les optimisations disponibles pour une compression des images maximale. Cela permettra de considérablement réduire le poids initial. Parfois, la qualité de l’image pourra être légèrement dégradée.

Voila, après avoir mit en place votre htaccess et votre plugin de compression d’image vous verrez un gain significatif sur la vitesse de chargement de votre site Wordpress et google ainsi que vos visiteurs vous en seront reconnaissant.

Facebook
Twitter
LinkedIn
Reddit
WhatsApp
Email

Besoin d'explication, d'aide ou de support sur un article ?

Virement bancaire

BANQUE : WIZE
BÉNÉFICIAIRE : Mr GOVIN Mathieu
IBAN : BE49 9678 0454 7971
BIC : TRWIBEB1