Magazine Blog

Optimisation de site WordPress

Publié le 04 mars 2013 par Webpulser_team @WebpulserDev

Nul besoin d’étaler des courbes, graphiques et camemberts dans le but d’argumenter sur le temps de chargement; le pourcentage de visiteurs quittant le site après X seconde ,le nombre de pages vues et biensur le taux de conversion ( pour les intéressés, http://www.seomoz.org/blog/site-speed-are-you-fast-does-it-matter ) . C’est plutôt une question de bon sens d’avoir un site Web réactif, et encore plus aujourd’hui avec les visites sur mobile.

Optimisation de site WordPress

http://www.motortrend.com/roadtests/coupes/1302_2013_mercedes_benz_sls_amg_gt_first_test/photo_18.html

Les techniques d’optimisation Web sont pour être efficace à réaliser dès le début de son projet :

  • Utilisation minime du javascript ou de scripts allégés, déférer leur chargement.
  • Utilisation de sprite CSS pour limiter le nombre d’images.
  • Alléger ses images et les avoir à la bonne taille.

Mais si on ne s’est pas du tout préparer à cela, il existe tout de même des solutions, je prendrai ici l’exemple de PageSpeed et du plugin W3 Total Cache qui permettront d’accroitre considérablement le temps de chargement de votre site et sa fluidité lors de la visite de l’internaute.

Optimisation WordPress avec PageSpeed

Le module PageSpeed de Google pour Apache permet d’appliquer automatiquement des optimisations comme la minification CSS et Javascript, la création de sprite ou l’utilisation de l’encodage 64bits pour les images.

Commençons tout d’abord par l’installer :

wget https://dl-ssl.google.com/dl/linux/direct/mod-pagespeed-beta_current_amd64.deb
dpkg -i mod-pagespeed-*.deb
rm -rf mod-pagespeed-*.deb

puis l’activer :

a2enmod pagespeed
/etc/init.d/apache2 reload

Pour consulter les outils activés par défaut dans le core : https://developers.google.com/speed/docs/mod_pagespeed/config_filters

Le module Pagespeed est maintenant activé sur tout les sites présent sur le serveur. Si vous souhaitez ne l’activer que sur un site en particulier, il faut désactiver ModPagespeed dans les mods-enabled d’apache ( généralement placé sous /etc/apache2/mods-enabled/pagespeed.conf ), placer « ModPagespeed off ».

Il suffit d’ouvrir ensuite le .htaccess à la racine du site, pour l’activer et le désactiver sans avoir à redémarrer Apache ( pratique pour faire des tests ).

Voici le .htaccess avec tous les modules activés :

Modpagespeed on

ModPagespeedEnableFilters combine_css
ModPagespeedEnableFilters extend_cache
ModPagespeedEnableFilters rewrite_images
ModPagespeedEnableFilters rewrite_css
ModPagespeedEnableFilters rewrite_javascript
ModPagespeedEnableFilters outline_css
ModPagespeedEnableFilters outline_javascript
ModPagespeedEnableFilters move_css_above_scripts
ModPagespeedEnableFilters move_css_to_head
ModPagespeedEnableFilters flatten_css_imports
ModPagespeedEnableFilters make_google_analytics_async
ModPagespeedEnableFilters combine_javascript
ModPagespeedEnableFilters resize_mobile_images
ModPagespeedEnableFilters inline_preview_images
ModPagespeedEnableFilters remove_comments
ModPagespeedEnableFilters collapse_whitespace
ModPagespeedEnableFilters extend_cache_css
ModPagespeedEnableFilters extend_cache_images
ModPagespeedEnableFilters extend_cache_scripts
ModPagespeedEnableFilters sprite_images
ModPagespeedEnableFilters defer_javascript
ModPagespeedEnableFilters lazyload_images
ModPagespeedEnableFilters insert_dns_prefetch

Vous avez maintenant le module Pagespeed d’apache installé avec tous ses outils d’optimisation. Pour plus de détails sur ces outils : https://developers.google.com/speed/docs/mod_pagespeed/config_filters

Optimisation WordPress avec W3 Total Cache

Maintenant que PageSpeed est installé, il reste encore quelques améliorations à faire, notamment au niveau des Expires Headers, le plugin W3 Total Cache fait parfaitement l’affaire. Il va ajouter dans le htaccess tout ce que nous avons besoin pour optimiser cela. L’installation est la encore super simplifié, il suffit d’activer le plugin, mettre les bonnes permissions sur les fichiers. Si vous êtes sur un serveur, ajouter  » define(‘FS_METHOD’,'direct’);  » au wp-config.php .

Je conseille de désactiver le PageCache, qui est déjà pris en charge par PageSpeed.

Résultats de l’optimisation

Après toutes les modifications, il nous reste plus qu’a tester le site Web avec des outils spécialement dédié à savoir GTmetrix qui combine le Yslow et PageSpeed , et PingDom Tools pour le temps de chargement, le poids de la page..

Optimisation de site WordPress
   
Optimisation de site WordPress

Etape cruciale dans la création d’un site internet, voila notre moteur bien rodé pour subir des pics de milliers d’internautes sans surchauffe. A prévoir tout de même si le serveur n’a pas une mémoire vive énorme :

echo "# mod_pagespeed memory usage limitation
MaxKeepAliveRequests 50
MaxClients          100
MaxRequestsPerChild 500" \
    > '/etc/apache2/conf.d/pagespeed-optimization'
Optimisation de site WordPress

Mercedes-Benz-E-63-AMG
http://automover.blogspot.fr

Optimisation plugins WordPress

Pour analyser les statistiques de chargement des plugins WordPress, le plugin P3 (Plugin Performance Profiler) est idéal, il affiche le temps de chargement de chaque plugin et permet de détecter si certains sont trop lent.

Rédigé par Garry Ysenbaert


Vous pourriez être intéressé par :

Retour à La Une de Logo Paperblog

Ces articles peuvent vous intéresser :

  • Les plugins indispensables pour WordPress en 2013

    plugins indispensables pour WordPress 2013

    source : http://www.flickr.com/photos/jamesstewart/4624346156/ Comme avant de partir en randonnée, il est vitale de se prémunir des bons outils et accessoires... Lire la suite

    Par  Webpulser_team
    BLOG, HIGH TECH, INTERNET
  • Les problématiques de la formation WordPress

    problématiques formation WordPress

    "Celui qui a la prétention d'enseigner ne doit jamais cesser d'apprendre." _John Cotton DanaEnseigner c’est gratifiant ! Quel que soit le domaine de formation,... Lire la suite

    Par  Seomix
    BLOG, HIGH TECH, INFORMATIQUE, INTERNET
  • WordPress, ça tient pas la charge…

    WordPress, tient charge…

    WordPress, ça rame, c'est bien pour faire un petit blog, mais pas vraiment pour un vrai site ou un site ecommerce. Il suffit de lire chaque semaine ce type... Lire la suite

    Par  Seomix
    BLOG, HIGH TECH, INFORMATIQUE, INTERNET
  • Sauvegarder un blog WordPress avec Google Drive

    Sauvegarder blog WordPress avec Google Drive

    Google Drive pour WordPress est une nouvelle extension qui a fait son entrée dans l’annuaire des extensions de WordPress peu après la disponibilité de Google... Lire la suite

    Par  Chahidhamza
    HIGH TECH, IMAGE & SON , INFORMATIQUE, INTERNET, JEUX VIDÉO
  • Traduire WordPress avec Codestyling

    Traduire WordPress avec Codestyling

    Une traduction est une annexion. _Victor Hugo WordPress est polyglotte ! Si vous avez un site sous WordPress, vous devez certainement l’avoir dans sa version FR... Lire la suite

    Par  Wpformation
    BLOG, FORMATION, INTERNET, WEB2.0
  • WooCommerce, WordPress et e-Commerce

    WooCommerce, WordPress e-Commerce

    WooTheme a développé le plugin gratuit WooCommerce, qui permet de faire de votre WordPress un véritable e-Commerce aux multiples fonctionnalités Nous connaisson... Lire la suite

    Par  Wpformation
    BLOG, FORMATION, INTERNET, WEB2.0
  • Sauvegarder WordPress intégralement

    Sauvegarder WordPress intégralement

    Sauvegarder son site WordPress est une nécessité absolue. Vous avez passé tellement de temps à configurer votre blog, à le customiser et à écrire des articles,... Lire la suite

    Par  Wpformation
    BLOG, FORMATION, INTERNET, WEB2.0

A propos de l’auteur


Webpulser_team 48 partages Voir son profil
Voir son blog

l'auteur n'a pas encore renseigné son compte l'auteur n'a pas encore renseigné son compte

Magazines