Vous êtes ici : Accueil | Interviews | Accélérez votre Thème WordPress avec Jonathan de GeekPress

Accélérez votre Thème WordPress avec Jonathan de GeekPress

Accélerer Wordpress

Savez-vous que la vitesse de chargement des sites internet a un impact sur le référencement ?

Et oui, c’est un des éléments pris en compte par les moteurs de recherche pour classer les différents résultats. Alors certes, ce n’est pas le critère de classement principal, mais je pense qu’il est bon d’exploiter tous les leviers pour faire les yeux doux à notre ami Google.

N’oublions pas également qu’améliorer la vitesse de chargement de votre site fournira une meilleure expérience utilisateur à vos visiteurs.

Si vous vendez quelque chose via votre site, un chargement plus rapide de vos pages impactera également sur vos ventes. Par exemple chez Amazon, un dixième de seconde de gagné sur le chargement de leurs pages équivaut à 1% de chiffre d’affaire en plus !

Incroyable n’est ce pas ?

Ok, ni vous ni moi ne sommes Amazon mais ne vous est-il pas arrivé de perdre patience lors du chargement d’une page ?

Suite au passage de WP Themes Pro sous Thesis, j’ai voulu améliorer la vitesse de chargement du blog. J’avoue ne pas avoir été un très bon élève…

Optimisez la vitesse de chargement de votre thème WordPress

Après avoir fait pas mal de recherches sur la question, j’ai décidé de poser quelques questions à Jonathan de GeekPress concernant l’optimisation des thèmes WordPress.

Voici la première interview vidéo de WP Themes Pro (soyez indulgent, c’est une première :))

Points clés abordés dans la vidéo

Revenons sur les différents points d’optimisation dont nous avons parlé avec Jonathan. Vous pourrez trouver ici différentes techniques et outils pour faire en sorte que votre site se charge plus rapidement.

Mesurer la vitesse de chargement – 6:45

Optimisation des images – 8:23

Les images sont ce qu’il y a de plus lourd dans une page HTML – Partager sur Twitter

Optimiser le code de son thème – 13:04

  • Créer des sprites CSS (combiner plusieurs images en une pour minimiser le nombre de requêtes). Voir SpriteMe.org pour vous aider à générer des sprites.
  • Utiliser qu’un seul fichier CSS (dans la mesure du possible) – Utilisez le plugin WP Minify
  • Charger le code CSS en haut du header et le code JS avant la balise </body>
  • Minifier le code HTML, CSS et JS

Installer un plugin de cache – 18:30

Note : Testez pour voir quel plugin fonctionnera le mieux pour vous, ne les installez pas tous en même temps !

Vous pouvez aussi…

Après l’enregistrement, nous nous sommes rendu compte que nous avons oublié de parler de quelques autres mesures. Notamment la mise en place d’un CDN sur WordPress (content delivery network) afin de répartir le chargement des fichiers utiles au thème à partir de plusieurs serveurs.

Il y a également la solution CloudFlare. Jonathan et moi l’utilisons sur nos blogs. Une fois configurer, ce service va mettre en cache votre site pour le servir plus rapidement à vos visiteurs.

Un autre avantage est qu’il permet de protéger votre site de différentes menaces (spammers, botnet, zombies etc). CloudFlare est aussi un service gratuit, alors profitez-en !

Daniel de SeoMix vous apprendra aussi à optimiser WordPress (son article parle de choses non abordées ici).

Programmez plus vite avec le Mémento WordPress !

Memento WordPressVous avez pu le voir à la fin de la vidéo, Jonathan est l’auteur du Mémento WordPress. C’est un petit dépliant édité par Eyrolles qui rassemble les fonctions que l’on utilise le plus lorsque l’on créé ou modifie un thème WordPress.

Si vous touchez au code de vos thèmes WordPress, je vous le recommande grandement. C’est toujours utile et ça permet de gagner du temps 🙂

Pour vous donner une idée, voici le sommaire du Mémento WordPress :

  1. Templates de page (par défaut)
  2. Marqueurs conditionnels
  3. Permaliens
  4. Récupérer les informations générales du site
  5. Fonctions de la boucle (loop)
  6. Personnaliser la requête d’une boucle (query_posts et WP_Query)
  7. Sticky Posts (articles en avant)
  8. Champs personnalisés
  9. Posts Formats (comme sur Tumblr)
  10. Modèles de pages
  11. Constantes de paramétrage
  12. Rôles et capacités
  13. Shortcodes
  14. Transients API (mettre des données en cache pour une durée limitée)
  15. Tâches planifiées (cron)
  16. Sécurité
  17. Internationalisation (traduction)

Obtenir le Mémento WordPress sur Amazon

 

Passez une agréable journée

Alex

Crédit photo : Rafale par Joseph Quan

Si vous avez apprécié cet article, inscrivez-vous à la newsletter

Recevez gratuitement les prochains articles et accédez à des ressources exclusives. Plus de 10000 personnes l'ont fait, pourquoi pas vous ?

C'est parti, je m'inscris !

32 commentaires Ajoutez le vôtre

  1. Salut,

    Sympa cette interview 🙂 L’article est intéressant surtout pour les images mais il y a plein de choses à rajouter sur les moyens d’amélioration de la perf. Je me permets de rajouter quelques tips pour le .htaccess parce que le temps de chargement s’améliore sévèrement avec quelques règles : http://tweetpress.fr/codewp/ameliorer-performance-wordpress-htaccess/

    Répondre
    • Bonjour Julien,

      Cet article n’est pas exhaustif, il y a effectivement d’autres leviers pour accélérer son site sous WordPress. Le but de l’article était de couvrir les premières mesures à prendre 🙂

      Merci pour ton lien !
      Alex

    • De rien 🙂 oui je sais que c’est une introduction à l’optimisation d’ailleurs avec ce qu’a indiqué Jonathan on a déjà une nette amélioration normalement.

  2. Petites astuces bien pratiques pour optimiser son blog à fort trafic. Merci.

    Répondre
  3. En voici une vidéo pleine de bon sens et de bonnes astuces. Et réalisée en plus par la dreamteam de WordPress.

    Par contre, il faut relativiser l’impact de la vitesse sur le SEO : cela va influer, mais uniquement sur les sites très lents qui seront pénalisés (plus de 10 secondes de temps de chargement) et les sites très rapides qui seraient légèrement favorisés (moins de 1 seconde de temps de chargement).

    PS : j’ai failli faire un arrêt cardiaque en entendant mon nom : c’est Roch, comme un Rock, pas comme une Roche ^^

    Et je confirme pour Julio l’expert sécurité : il peut te casser ton site en quelques minutes…

    Répondre
    • Salut Daniel,

      Au niveau des noms, je pense qu’avec Jonathan on a dû entendre beaucoup de choses ^^
      C’est noté pour Google, quoiqu’il en soit il faut toujours que ce soit rapide pour l’utilisateur 🙂

      Dès que la vidéo de l’intervention sera en ligne, je l’enverrai directement aux abonnés du blog !
      Je n’ai pu voir que le début mais ça valait vraiment le coup 🙂

      A+
      Alex

  4. Attention ! Une faille à été révéler dans w3-total-cache !!
    Pour les petits sites qui génère moins de 250 jours je recommande HyperCache 🙂
    Simple & Efficace ..

    Répondre
  5. De bons conseils pour améliorer les performances de site ou blog.
    C’est sur qu’il y a encore pas mal de choses à faire, mais pour commencer c’est déjà très bien.
    Avec l’importance que ça prend dans le seo, le temps de chargement des pages est vraiment pas a prendre à la légère.

    Merci pour l’article.

    Répondre
    • Merci pour ton retour Gilles 🙂
      Il y a effectivement d’autres choses à faire comme le CDN (Daniel de SEOMix a fait un très bon tuto sur le sujet).

      Bonne continuation
      Alex

  6. Le code doit être propre, après j’utilise W3 total cache et j’ai toujours de très bon résultat au GG pagespeed, mon dernier site à obtenu 92/100 !!

    Répondre
    • Félicitations 🙂

  7. Hello

    Sympa cette article, merci a vous 2.
    Mais une question se pose pour moi, sur un nouveau je souhaite intégrer de la vidéo daily dans mes articles pour monétiser et apporter un plus a mes articles.
    Savez vous si le chargement des vidéo daily a un impact sur le temps de chargement et si il y a un moyen d’accélérer le temps de chargement des vidéo daily ?

    Merci

    Répondre
    • Bonjour Phil,
      Merci pour ton commentaire 🙂

      Dailymotion utilise la balise iframe dans le code d’insertion de ses vidéos. Je viens de trouver un article sur les performances liées aux iframes, il devrait t’intéresser : http://www.aaronpeters.nl/blog/iframe-loading-techniques-performance

      Bonne continuation
      Alex

    • Ok merçi pour le lien 🙂

      Donc d’après se que j’ai compris cette solution est la plus performante :

      (function(d){
      var iframe = d.body.appendChild(d.createElement(‘iframe’)),
      doc = iframe.contentWindow.document;

      // style the iframe with some CSS
      iframe.style.cssText = « position:absolute;width:200px;height:100px;left:0px; »;

      doc.open().write( »);

      doc.close(); //iframe onload event happens

      })(document);

      Mais une question se pose, ou coller l’adresse de l’iframe ?
      Désolé un peut nul coté code 🙁

  8. Je vais tester tout ce qui est décrit dans cette article pour améliorer mon site!
    Merci des conseils

    Répondre
  9. De bon conseils pour réduire le temps de chargement.
    Par contre je ne suis pas convaincu sur certains points, comme utiliser un plugin pour minifier son code alors qu’on peut très bien le faire sans.
    Tout comme les plugins de cache, qui sont loin d’être parfait, long à paramétrer et au final il n’y pas vraiment de gain de temps.

    Répondre
  10. Etant débutant, je viens d’apprendre plusieurs choses qui vont m’être vraiment profitable pour améliorer la rapidité de mon blog.

    Mais ajouter un plugin de cache à wordpress ne va-t-il pas justement ralentir le site vu qu’ajouter des plugins ralentit wordpress?

    Répondre
  11. Et oui, on y pense vraiment pas beaucoup, et pourtant, on se donne du mal à optimiser dans le référencement…C’est un article très explicite et je pense que cela va surtout booster les sites WordPress pour être mieux positionnés.

    Répondre
  12. On peut tjs apporter des modifications mais suivant le thème utilisé on peut être limité. Tjs regarder avant d’acheter son theme.

    Merci pour les infos sur les outils pour le temps de chargement de la page.

    Rodolphe

    Répondre
    • Il n’y a pas de quoi 😉

  13. Très bonne interview article intéressant, mais je pense qu’il y’a encore quelques truc à régler qui peuvent améliorer considérablement un site sous wordpress, je prends en exemple la suite donnée par Julien Maury.
    Merci à tous pour ces formidable conseils.

    Répondre
  14. Etes-vous jumeaux?
    Merci en tout cas pour cette video 😉

    Répondre
    • Non pas du tout ^^
      A bientôt pour une prochaine vidéo 🙂
      Alex

  15. Bravo Alex ..
    Vous avez fait un bon travail
    merci pour le partage 🙂

    Répondre
    • Merci pour votre commentaire 🙂

  16. Bonjour Alex, merci pour ce super article. Mon blog commence justement à être loooooong à charger donc tes astuces vont me servir. Par contre je me pose une question sur le cache : tu proposes des pluggins pour le cache et après tu parles de CloudFlare ? CloudFlare est un supplément aux pluggins de cache pour améliorer la vitesse de chargement des pages? J’ai testé les 3 pluggins de cache que tu proposes et j’ai l’impression que mon blog charge plus rapidement avec DB cache reloaded mais WP m’indique cette erreur :wpdb class is redefined, plugin cannot work! Est-ce que ce pluggin est quand même adapté pour mon blog ? Je suis désolée de te poser pleins de questions ! Je te remercie par avance pour tes réponses

    Répondre
  17. Bonjour Alex. Bravo pour ta 1ère video c super intéressant. merci pour le résumé et les liens.merci à Jonathan pour ses précieux conseils. seul bémol au niveau du son c,est très difficile d.entendre jonathan. je partage et après les conseils mis en place je te ferai un retour!

    Répondre
  18. Bonjour à tous,
    Un petit bémol concernant les images, prendre soin d’avoir un écran calibré !
    En effet, sur un écran de moyenne qualité et non calibré, l’optimisation peut-être catastrophique (essayé sur des écrans d’un centre de formation 🙂
    J’ai constaté que les thèmes « one page » étaient bien plus long à charger, je pense que si vous avez beaucoup d’images à mettre n valeur, il faut réserver ce type de thèmes aux artistes peintres ou photographes. On est souvent plus patient pour ce type de sites car on sait que l’image prévaut sur le rédactionnel (et inversement)…

    Répondre
  19. Encore un article qui vient s’ajouter à la liste de ces ressources que vous mettez à notre disposition et qui sont toutes plus utiles les unes que les autres ! Merci de souligner des points auxquels on ne pense pas forcément lorsque l’on débute dans le domaine, merci de nous apporter tous ces conseils tellement enrichissants ! Merci à vous deux d’aider les gens comme moi 🙂
    Très bonne continuation !

    Répondre

Laisser un commentaire

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

La Marmite ne peut malheureusement pas fournir de support. Merci d'en tenir compte dans votre commentaire 😉

Si vous ne lui en voulez pas, donnez-lui un j'aime sur Facebook :



1 Shares
Share1
Tweet
Share