Accueil Système d'exploitationWindows Astuce : Comment optimiser son site ou blog ?

Astuce : Comment optimiser son site ou blog ?

Par francky

Tout le monde le sait, un internaute n’aime pas attendre. Il aime que les pages Web qu’il visite s’affichent le plus rapidement possible. Une lenteur de votre blog ou site intervient et c’est des visiteurs qui s’en vont. Alors quand on a un espace personnel bien à nous et que l’on souhaite le rendre populaire, il faut en permanence l’optimiser afin que celui-ci s’affiche le plus rapidement possible. Dans ce cas, il faudra trouver alléger vos images sans en négliger la qualité, ne pas alourdir vos pages avec des lignes de codes inutiles, des informations qui ne sont pas nécessaires ou redondante, … Bref votre site doit être le plus léger possible.

Comment on fait pour optimiser ?

Avant de se lancer dans des opérations qui ne seraient pas forcément nécessaires ou au contraire vous donner l’effet inverse, il est donc indispensable de savoir ce qu’il faut optimiser.

Pour cela, j’ai découvert une astuce fort sympathique. Grâce à Firebug et Google Page Speed, 2 extensions pour firefox, vous saurez très rapidement quelles sont les modifications à apporter pour optimiser votre site internet.

Google Page Speed, qui est en fait une extension de firebug, analysera la page de votre choix et vous indiquera précisément les images trop lourdes, les feuilles de style (css) à revoir, et les diverses autres modifications à apporter afin de rendre le surf plus agréable et rapide pour vos visiteurs.

Un score (sur 100) vous sera attribué et pour pourrait ainsi voir son évolution au fur et à mesure de vos optimisations.

J’ai regardé comment était optimisé twitter.

Malgré un score honorable de 89 sur 100, le webmaster de twitter a encore un peu de travail.

« Le point d’exclamation rouge » indique là où il faut principalement concentrer vos efforts. Dans ce cas, il devra activer la compression gzip de ses pages ou du moins la revoir un peu, Optimiser quelques images. un clic sur le « + » lui donnera la liste des images en question.

« Le triangle orange » indique qu’à ce niveau il y des modifications à apporter, rien de bien alarmant mais tout de même à revoir pour améliorer la fluidité de la page. Attention toute fois avec « remove unused CSS » car même si le code CSS est indiqué comme inutilisé, cela peut en effet être le cas pour la page analyser mais pas pour une autre. Alors pensez à tester plusieurs de vos pages avant de tailler dans la masse.

Le « V vert » indique que de ce côté tout est ok, toute modification serait inutile et peut même engendrer l’effet inverse à savoir un alourdissement de la page.

Le « i bleu » est une information. Il  est juste là pour donner quelques infos qui seront toute de même importantes dans tout ce que vous entreprendrez.

Aller maintenant Au boulot !

Quel score obtenez vous pour votre site ?

Vous aimerez aussi

8 commentaires

Romaric 3 novembre 2010 - 13 h 56 min

« J’ai regardé comment était optimiser twitter. »
optimisé 🙂

Répondre
Romaric 3 novembre 2010 - 13 h 57 min

.

Répondre
francky 3 novembre 2010 - 13 h 58 min

Bonjour Romaric

Merci c’est corrigé. 😉

Répondre
maison ou bureau 3 novembre 2010 - 14 h 08 min

Tres intéressant , même si le nombre d’infos me perds un peu ….

Surtout que j’ai pas mal de taf à faire avant d’arriver à 100%

Je ne suis qu’à 72/100 et j’ai tout ça à modifier :

Combine external JavaScript
[Score: 19/100]

Leverage browser caching
[Score: 0/100]

Parallelize downloads across hostnames
[Score: 5/100]

Serve static content from a cookieless domain
[Score: 19/100]

Combine images into CSS sprites

Du coup je vais creuser un peu plus le sujet

Merci ! 😉

Répondre
francky 3 novembre 2010 - 14 h 18 min

72/100 c’est déjà pas si mal.

Pour info, WMS était à 78/100 ce matin. Nous essayons de l’optimiser en permanence et ce n’est pas toujours évident. Obtenir plus de 90% sera très difficile sans connaissances spécifiques en CSS/PHP/HTML/SQL

Répondre
deherve 3 novembre 2010 - 15 h 11 min

Salut,

Quelques précisions

Combine external JavaScript
[Score: 19/100]

Les script externes ne sont pas forcement à optimisé, car souvent le code est encrypté

Leverage browser caching
[Score: 0/100]

Mettre en place un système de Cache, rine de compliqué, WMS n’en utilise pas pour des raisons Techniques, lien à d’autres programmes.

Parallelize downloads across hostnames
[Score: 5/100]

Là, j’ai pas lu la définition, alors, je reste dans le floue

Serve static content from a cookieless domain
[Score: 19/100]

Les données du serveur et des informations de domaines sont à voir avec le registrar et l’hébergeur, mais c’est pas forcément nécessaire.

Combine images into CSS sprites

Une peu d’optimisation Css et le tour est joué

Bref, moins de travail que l’on peut espérer, mais le Score de 100% est quasi-impossible, si l’on ne maitrise pas toute la chaine.

Bon courage à ceux qui frôle, le max de 96-98% que j’ai pu croiser (une page HTML sur un serveur et domaine en full déclaration et avec les services de compression, cache, meta d’ouvert à bloc).

Hervé

Répondre
maison ou bureau 3 novembre 2010 - 15 h 25 min

@deherve

Merci pour ces précisions 😉

Répondre

Laisser un commentaire