Tag : seo

7 conseils pour optimiser le temps de chargement d’un site

On le sait tous l’optimisation d’un site est essentielle pour vos visiteurs qui prendront plus de plaisir à vous lire et à naviguer sur vos pages mais aussi pour le référencement car les robots iront plus vite et vous aurez une meilleure note sur le temps de chargement de vos pages. Il faut l’avouer l’optimisation d’un site est pénible, rasante mais vaut vraiment le coup! Voici quelques recommandations que je peux vous faire après avoir bien étudié le sujet.

Ne garder que l’essentiel

Le gain le plus facile est sans aucun doute enlever tout ce qui n’est pas nécessaire, et oui c’est le truc le plus con mais c’est certainement là que vous aurez le plus de chose à gagner! Il faut donc regarder vos pages et vous demander si vous utilisez bien tout ce que vous envoyez à votre visiteur. En regardant vous allez voir que le javascript et la feuille de votre formulaire de contact est chargé sur toutes les pages de votre site et pas uniquement sur votre page contact comme cela doit être (c’est un cas ultra classique pour les sites sous WordPress notamment).

Il y donc deux choses à faire :

virer les choses que vous n’utilisez pas
charger les scripts et feuilles de style uniquement sur les bonnes pages

Pour ceux sous wordpress vous pouvez utiliser des bouts de code comme cela pour optimiser le chargement des js et css de certains plugins qui ne sont pas utilisés partout sur le site, la solution est donc de ne les charger que sur les bonnes pages et donc les dé-enregistrer sur les autres :

Optimiser les images

Ah l’optimisation des images tout un roman… Premièrement il faut servir des images adaptées à la taille des écrans de vos visiteurs ainsi vous n’enverrez pas une image en 1980×800 à un utilisateur sur mobile. Ceci est globalement un peu complexe mais peut se gérer assez facilement avec le bon plugin. Personnellement sur Blogdecodesign.fr j’utilise le plugin « PB Responsive Images » et je suis très content du résultat même si forcément cela augmente un peu le besoin en espace disque sur le serveur.

Ensuite il faut compresser les images, encore une fois soit vous utilisez des images déjà compressées ou alors vous les recompressez sur le serveur mais c’est un peu plus complexe que de le faire initialement. Pour les compresser sur un mac j’utilise ImageOptim c’est pratique et efficace aussi bien avec des jpg que des png.

Pour les grosses images qui se situent sous la ligne de flottaison vous pouvez aussi différer l’affichage de l’image avec un code javascript defer comme celui-ci :

Chasser les requêtes mysql lentes

Vous ne le savez peut être pas mais sur votre site/blog vous avez certainement des requêtes sur vos bases de données, certaines requêtes peuvent être parfois lentes voir très lentes il faut donc les optimiser afin de réduire le temps de requête au maximum et ainsi gagner de précieuses secondes.
Pour trouver ses requêtes lentes cela n’est pas évident sauf si vous utilisez des plugins ou des scripts spécialisés dont c’est la fonction principale. Pour wordpress j’utilise l’excellent « Query Monitor » qui va vous afficher en live le temps consommé par chaque requête, c’est bien pratique pour savoir quoi optimiser en premier. Sur l’un de mes sites cela m’a permis de passer de 180 requêtes par pages à 70. Certes cela n’est pas le plugin qui va réduire le nombre de requêtes mais cela va vous permettre de réfléchir à la structure de vos requêtes, j’ai ainsi mutualisé beaucoup de requêtes identiques. En terme de gain en temps je suis passé de 2,5 secondes de requêtes MYSQL à 0,65 secondes vous voyez bien que l’optimisation était nécessaire!

Réduire votre feuille de style

La feuille de style est aussi un très bon angle pour optimiser votre site. Si vous regardez avec l’inspecteur de Google Chrome (clic droit « inspection de l’élément ») vous regardez dans l’onglet « audit » et vous allez constater que la page n’utilise que 15% des éléments de votre feuille de style, c’est logique mais cela vous coute en temps de chargement. Il faut donc partir à la chasse aux balises css que vous n’utilisez pas, pour moi j’ai pu réduire par deux le poids de ma feuille de style qui au fil des années s’était alourdie…

Pour les spécialistes vous pouvez aussi regarder du côté de Grunt Uncss pour optimiser efficacement votre feuille de style!

Vous devez aussi compresser votre feuille de style avec des outils en ligne qui font très bien le boulot comme cssminifier, cela permet de gagner facilement 25% de la taille du fichier.

Choisir des polices (font) légères

Certaines polices de caractères comme celles proposées par Google sont plus ou moins lourdes, il faut donc en choisir une légère et surtout ne pas sélectionner toutes les variations proposées…

Tip : Si vous voulez que votre site ne clignote pas au chargement de la page (flash of unstyled content (FOUC)), il faut mettre la feuille de style de google font au-dessus de la feuille de style de votre site.

Utiliser un système de cache

Si votre site peut être rendu momentanément statique il faut absolument envisager un système de cache, sur WordPress c’est facile de le faire avec un plugin spécifique. Aujourd’hui les plugins sont vraiment efficace et vous proposent même de minifier à la volée vos javascripts et vos différentes feuilles de style.

Utiliser un CDN

A le fameux CDN, tout le monde en parle mais pas beaucoup l’utilise et pourtant c’est un moyen de servir très rapidement vos fichiers statiques comme les images, les fichiers javascripts, et les feuilles de style. Pour ma part je pense utiliser prochainement Amazon Cloudfront en lien avec les fichiers que j’ai mis sur Amazon S3.

D’ailleurs à défaut de CDN vous pouvez déjà commencer avec un stockage des fichiers images sur Amazon S3, le temps de latence n’est pas celui d’un CDN mais cela certainement mieux que celui de votre serveur et cela lui donnera un peu d’air pour faire d’autres choses ! Sur l’un de mes sites j’ai hébergé 3 gigas d’images afin d’être plus efficace sur le chargement de celles-ci. Non pas que mon serveur ne soit pas à la hauteur mais il n’arrive pas à avoir la régularité d’Amazon S3.

Les outils en ligne pour tester

Afin de voir les impacts des différentes optimisations vous pouvez utiliser ces deux sites ils sont parfait et très pertinents :

Google Pagespeed Insights
Webpagetest

Voilà en ce qui concerne mon expérience personnelle sur le sujet de l’optimisation d’un site avec comme résultat un temps de chargement divisé pratiquement par deux, si vous avez des remarques ou d’autres amélioration n’hésitez pas à laisser un commentaire.

09-9-2015 | 1

« Mobile friendly » le nouveau label Google à avoir pour votre site

Google vient d’annoncer qu’ils allaient ajouter une mention précisant si votre site est adapté aux consultations sur mobile et tablette. Cette mention « mobile friendly » apparaitra donc sous le titre de votre page lors des recherches sur Google depuis un appareil mobile.

Afin de permettre aux éditeurs de vérifier si leur site est compatible avec ce nouveau label, Google propose un outil de validation qui se trouve ici. Cet outil va vous donner des informations sur la version mobile de votre site et vous permettra aussi de voir comment Google « voit » le site. L’utilisation de l’outil de validation est aussi utile pour valider si Google a bien accès aux fichiers CSS et JS de votre site, point important depuis quelques mois.

Google ne l’a pas annoncé comme cela mais logiquement on peut imaginer que ce label deviennent un critère de classement dans les résultats mobile du moteur de recherche, alors vous savez maintenant quoi faire!

20-11-2014 | Commentaires fermés

Buzzfeed a maintenant plus de trafic de Facebook que de Google

Voici un graphique très intéressant sur l’évolution des sources de trafic pour le site Buzzfeed. Certes la thématique de ce site fait que le contenu se partage facilement mais quoiqu’il en soit l’augmentation de trafic en provenance de Facebook prouve bien que l’on peut aussi avoir une stratégie sociale pour faire de l’acquisition de trafic.

Ceci remet en cause quelques principes de référencement et permet aussi aux sites internet de ne plus dépendre à 100% de Google. En revanche, on imagine bien que ceci est beaucoup plus complexe à mettre en place pour un site ecommerce…

05-2-2014 | Commentaires fermés

Google propose maintenant un outil pour désavouer les backlinks

Avec les mises à jour de Google et notamment celles relatives aux backlinks de mauvaise qualité, de nombreux webmasters se sont retrouvés avec une belle pénalité sans pouvoir parfois y faire grand chose. C’est notamment le cas de ceux qui avaient proposés des thèmes wordpress avec un lien dans le pied de page, dans ce cas nettoyer la base de backlinks était une vraie mission impossible.

L’outil très attendu par les webmasters devait permettre de dénoncer des liens non désirés et pénalisant pour le ranking d’un site. Google vient enfin de proposer un outil pour faire cela. Ce dernier s’appelle « Disavow Links » et se trouve dans Google WebmasterTools ici. Selon Google l’outil est à utiliser avec précaution et uniquement si la demande de retrait du lien n’a pas porté ses fruits.

Une fois le site choisi, il faut envoyer un fichier txt avec des informations comme celle ci-dessous :

# Contacted owner of spamdomain1.com on 7/1/2012 to

# ask for link removal but got no response
domain:spamdomain1.com
# Owner of spamdomain2.com removed most links, but missed these
http://www.spamdomain2.com/contentA.html
http://www.spamdomain2.com/contentB.html
http://www.spamdomain2.com/contentC.html

Google précise que cette demande de retrait prendra quelques semaines. Voici la vidéo de présentation de l’outil par Matt Cutts.

17-10-2012 | Commentaires fermés

Google propose plus d’information sur l’indexation d’un site

C’est intéressant car Google vient de proposer une nouvelle fonctionnalité à destination des webmasters via son outil webmastertools. Cet outil va permettre pour chaque éditeur de site de connaitre son niveau d’indexation dans Google. Un graphique avec des options avancées permet même de savoir le nombre de pages ignorées ou bloquées par un fichier robots.txt.

Notez que pour ceux qui utilisent des sitemaps qui documentent l’intégralité de leur site cette nouvelle information ne vous apportera pas grand chose de plus puisque Google donnait déjà l’information mais via l’interface dédiée aux sitemaps (encore fallait il avoir des sitemaps à jour) :

Donc pour afficher l’évolution de votre indexation dans Google il faut se connecter sur Webmaster Tools, puis aller dans Health puis Index Status. L’outil est simple mais fait ce que l’on attendait : savoir si son site était bien indexé dans Google! Ce que j’aimerai bien maintenant c’est connaitre les pages qui n’ont pas été sélectionnées afin de comprendre…

27-7-2012 | 7

Voici comment Google a tué la longue traine

Vous connaissez certainement la long tail ou longue traine en français. Le principe est que chaque mot peut un jour être une recherche dans un moteur de recherche, Google a longtemps été reconnu comme étant un acteur générant du trafic sur la long tail mais depuis quelques temps avec les mises à jour des outils de Google on peut dire que la longue traine a été reléguée au fond d’un tiroir…

Voici une infographie de SEOBOOK qui est très juste et présente parfaitement comment Google a tué peu à peu la longue traine :

06-12-2011 | 1

Impact du délais de chargement d’une page

On le sait tous le temps de chargement d’une page internet est de plus en plus important, pour l’utilisateur mais aussi pour Google qui a placé ce critère comme étant l’un des critères de classement d’une page. Donc plus votre site sera lent moins il aura de chance d’attirer les visiteurs et donc d’être bien classé dans l’index de Google.

Selon Jakob Nielsen il y a trois phases en fonction du temps de réponse d’un site internet :

-0,1 seconde, c’est le temps de l’instantané, l’utilisateur ne ressent rien il navigue sur le site naturellement sans forcément prendre conscience qu’il y a du téléchargement
-1 seconde, l’utilisateur sent le délais mais sait que la page est entrain de s’afficher
-10 secondes, de 1 à 10 secondes c’est la limite acceptable pour l’attente au delà l’utilisateur va partir du site

Google dans son outil webmastertools met d’ailleurs la limite entre un site rapide et un lent à 1,5 secondes comme on peut le voir sur le screen ci-dessous :

Alors pour identifier ce qui peut coincer ou bien être optimiser vous pouvez utiliser les outils suivants :

Pingdom :

Ou encore loadimpact :

Quelques actions qui vont améliorer le temps de chargement :

Taille des images

Souvent la taille des images est problématique, les images sont souvent lourdes et peuvent être optimisées (voir ces outils d’optimisation d’images).

Time to First Byte

Le Time to First Byte (à tester ici) est lui aussi parfois en cause, soit cela vient de votre hébergement qui n’est pas au top soit votre base mysql est trop lourde si vous êtes sous wordpress un bon moyen pour alléger le tout est d’effacer les « revisions » des articles, un plugin « better delete revision » fait très bien ce travail de nettoyage et l’ajout de cette ligne dans le fichier wp-config.php devrait interdire l’ajout des révisions :

define('WP_POST_REVISIONS', false);

Pour avoir fait l’opération le gain de la table wp_post est de 70% (55,9Mb à 17,4Mb)

Avant :

Après :

Sur l’un des blogs le TTFB est passé de 1000ms à 800ms après il faut faire vos propres tests mais réduire la taille de la base de données ne vous fera pas de mal.

Passer les images sur un sous domaine

Un navigateur web peut faire des téléchargements en parallèle alors si vous mettez vos fichiers statiques sur un sous domaine comme images.2803.fr vous allez être forcément plus rapide qu’avec un dossier comme www.2803.fr/images. Une première étape est de migrer les images du thèmes sur le sous-domaine et ensuite vous faite la même chose avec les images des articles donc du répertoire wp-content de wordpress, cela fera l’objet d’un prochain article.

Voilà comment faire pour optimiser « rapidement » le temps de chargement de vos pages, gagner quelques précieuses secondes et de faire en sorte que vous ne soyez pas pénalisé par Google et vos visiteurs aussi!

27-7-2011 | 12

SEO en entreprises, étude sur les pratiques

SEOmoz, une société bien connue de ceux qui font un peu de SEO vient de publier une étude sur l’usage du SEO par les entreprises. Le questionnaire avait 45 questions et plus de 10,000 personnes (de 90 pays différents) y ont répondu. Comme ils le précisent en préambule, pour certaines questions ils n’ont pu traiter que les USA et le UK compte tenu de la taille de l’échantillon.

L’étude évoque les aspects salaires, la répartition agence et fait maison, le spam, le paid link, les budgets… Une étude à lire en intégralité ici (les données brutes sont téléchargeables) ou bien à consulter sur cette infographie pour ceux qui veulent aller à l’essentiel.

Un très bon exemple de linkbait au passage!

22-11-2010 | Commentaires fermés