7 astuces pour accélérer votre site…

Quoi de plus navrant qu’un site qui rame et qui met trois plombes à afficher ses pages ? Il faut être honnête, depuis l’avènement de l’ADSL, on a tendance à se soucier de moins en moins de l’optimisation de son site. Et pourtant, nous allons voir qu’il n’est pas bien difficile d’accélérer ses pages et qu’avec quelques astuces en poche, on peut faire bien des miracles…
Optimisez vos CSS

Bien plus efficaces que les tableaux et même que le HTML pur, les CSS permettent aux webmestres de structurer leurs pages et de gagner pas mal de temps quand ils ont besoin de faire des mises à jour. Oui, sauf que ce n’est pas une raison pour ne pas les optimiser et qu’avec un peu de rigueur, on peut même considérablement accélérer son site. D’où l’objectif d’économiser des lignes et des caractères.

Du coup, au lieu de partir sur des padding-top : 14px, padding-right : 25px, padding-bottom : 25px, padding-left : 10px on peut juste balancer un petit padding : 14px 25px 25px 10px histoire de gagner un peu de temps et surtout un peu de place. Sans compter que le code en est plus lisible ce qui facilite les mises à jour suivantes.

A noter aussi que des outils en ligne permettent d’optimiser ses CSS, c’est le cas par exemple de CSS Clean, CSS Tidy ou de CSS Tweak. Donc même si vous êtes un peu flemmard, vous n’avez plus aucune excuse.

Utilisez le moins de javascript possible

Là aussi, c’est une astuce toute bête, mais qui peut vous faire gagner quelques secondes sur le chargement de vos pages. Le Javascript permet en effet aujourd’hui de faire des effets plutôt sympas, on peut même trouver pas mal de librairies dédiées, mais ce n’est pas une raison pour l’utiliser à tout bout de champ.

Je pense notamment aux rollovers, qui peuvent être parfaitement gérés en CSS. On peut prendre pour exemple le menu de droite de la Fredzone, qui ne contient pas une seule ligne de code javascript. Ne pas oublier, donc, qu’en informatique et qu’en développement, les méthodes les plus simples sont souvent les meilleures.

Optimisez votre code

Certaines balises sont inutiles et alourdissent inutilement vos pages. Il n’y a pas de secret, il faut s’en débarrasser et les éviter à tout prix. C’est par exemple le cas des « br » et compagnie que l’on peut facilement remplacer en définissant des margin et des padding dans ses CSS. Il faut donc toujours tirer partie des technologies qui existent et simplifier son code au maximum.

De la même manière, beaucoup de webmestres utilisent des noms de variables beaucoup trop longs. Certes, il est pratique de savoir de quoi on parle et à quoi une valeur va se rattacher, mais ce n’est pas pour autant que l’on doit en faire trop. Restez sobre et efficace en définissant une nomenclature qui vous permettra de vous y retrouver sans pour autant vous montrer trop démonstratifs dans les noms utilisés.

Optimisez vos images

Là encore, si nous avons désormais tous des connexions de bourgeois, ce n’est pas pour autant qu’il faut en abuser. Il ne faut pas oublier que les meilleurs formats pour le web sont le PNG, le GIF et le JPG et que le BMP n’a vraiment pas sa place dans ce contexte. Ca peut en faire rigoler plus d’un mais je suis déjà tombé sur un paquet de sites dont les webmestres n’avaient pas vraiment l’air d’être au courant.

De la même manière, lorsque vous créez vos images, pensez toujours à les optimiser pour le web. Des logiciels comme Photoshop le font très bien et vous feront souvent gagner un paquet de kilo-octets.

Hébergez vos images sur une plateforme dédiée

Si vous avez beaucoup de visiteurs sur votre site, les requêtes effectuées à votre serveur d’hébergement peuvent être assez conséquentes. Il faut savoir que des plateformes dédiées existent (comme Flickr ou ImageShack par exemple) et qu’elles bénéficient souvent d’une meilleure infrastructure que votre hébergeur. Dans ce contexte, autant en profiter un bon coup et faire appel à leurs services.

Attention cependant. Car si ces plateformes viennent à rencontrer des problèmes techniques, votre site en subira les conséquences. Ceci dit, il s’agit là d’une alternative à ne pas négliger et qui doit être sérieusement envisagée.

Soignez vos backgrounds

Sur de nombreux sites ou blogs, je vois encore des images de fond conséquentes sur certains éléments de page (calques, titres, etc…). Les backgrounds ne sont pas à éviter et ils participent souvent à la qualité visuelle d’un site mais ce n’est pas pour autant qu’il faut faire n’importe quoi. Il faut en effet privilégier autant que possible des images légères et petites qui se répètent plutôt qu’une grosse image fixe de taille conséquente.

L’exemple le plus frappant, ce sont encore les stripes qui sont particulièrement à la mode en ce moment. Il faut savoir que des générateurs comme Stripes Designer existent et permettent de générer très facilement une petite image qu’on répètera dans les éléments qu’on souhaite remplir. Autant profiter de ces outils…

Réduisez au maximum le nombre de requêtes HTTP

Plus votre page contiendra d’objets, et plus les requêtes adressées à votre serveur seront nombreuses. C’est tout bête mais il faut toujours garder cette idée en tête. Alors si vous aimez le javascript, les images, les vidéos et tout autre objet ou script, veillez au moins à ne pas en surcharger vos pages. Sans ça, votre site risque de mouliner et même dans certains cas de planter.

Alors si vous voulez quand même vous éclater, assurez-vous au moins que votre formule d’hébergement est capable de tenir la charge. Si vous avez opté pour du mutualisé, n’en faites donc pas trop et restez toujours vigilant sur le type de contenu que vous proposez à vos lecteurs. C’est bien de faire du multimédia et de profiter au maximum des possibilités offertes par l’ADSL mais ce n’est pas une raison pour ne pas se montrer prudent.