Comment optimiser un site web ?

Chapter 1 : Optimisation du temps de chargement des pages

Si vous vous demandez Pourquoi optimiser le temps de chargement de vos pages web ?
Regardez la présentation suivante :

Maintenant, c’est l’heure des solutions au problème d’optimisation :

Optimisation du temps de chargement des images :

Comme expliqué dans le slide N° 54, le site Smush.it va vous permettre d’optimiser le poids des images. Le but est de réduire le poids des images pour qu’elles soient télécharger plus rapidement.

Optimisation des header HTTP :

Le but est de signaler au navigateur Internet du visiteur qu’il peut stocker certains éléments de la page web (voire tout) dans le cache (c’est à dire sur son ordinateur) pour éviter de le télécharger une seconde fois lors d’une prochaine visite. Donc le chargement de vos pages sera beaucoup plus rapide, voire beaucoup beaucoup beaucoup plus rapide.
Il suffit de définir les éléments à mettre en cache et on précise la durée.

1 installer les modules (peut être facultatif…)

Tapez dans la console en mode root :
‘a2enmod expires‘ puis appuyez sur la touche ‘entrée’
‘a2enmod headers‘ puis appuyez sur ‘entrée’
‘a2enmod deflate‘ puis appuyez sur ‘entrée’

2 configurer httpd.conf :

2.1 editer apache2.conf en tapant dans la console
/etc/apache2# vi httpd.conf

2.2 Allez à la fin du fichier

2.3 Appuyer sur ‘i‘ pour passer en mode insertion

2.4 Ajouter le texte de configuration convenant à vos désirs, ce qui devrait ressembler à ça :

ExpiresActive On
<Directory “Le chemin de votre dossier : /home/toto/public_html”>
ExpiresByType text/html “access plus 1 year”
ExpiresDefault “access plus 1 month”
</Directory>

Plus d’info sur la syntaxe de Mod Expires

2.5 Pour quitter Vi et sauvegarder le document, il faut appuyer sur la touche ‘Echap’, puis écrire ‘:wq! ‘.

3 Redémarrer Apache en tapant dans la console :

/etc/init.d/apache2 restart

Si Apache redémarre sans message d’erreur, vous pouvez souffler, vous venez d’éditer les fichiers de configuration d’Apache, Like a Nerd…

Besoin d'optimiser la vitesse de chargement du site web ?

Optimisation de la compression :

Le but est de compresser, au format gzip, certains éléments (voire tout mais je ne cautionne pas) usuellement , les fichiers javascript et css sont servis compressés. Le fait des les compresser va permettre de gagner du temps en faisant passer des fichiers plus petits dans les tuyaux de l’internet.

1 editer apache2.conf
/etc/apache2# vi apache2.conf

2 trouver les lignes et les décommenter ou les rajouter à la mano :
AddEncoding x-compress .Z
AddEncoding x-gzip .gz .tgz

et

AddType application/x-compress .Z
AddType application/x-gzip .gz .tgz

puis rajouter la règle :
AddOutputFilterByType DEFLATE text/plain text/javascript text/js text/css application/x-javascript

pour qu’il gzip les fichier texte, javacsript et css

3 Redémarrer Apache :
/etc/init.d/apache2 restart

Optimisation des fichiers javascript (.js) et de style (.css)

Il faut aussi minifier ses fichiers javascript :
Minimiser les fichiers permet d’ôter tous les commentaires et espaces superflus pour avoir un fichier plus léger à transférer.

Pour ce faire il y a deux outils pratiques et gratuits : Minify Javascript et CSS Compress : 

Si vous le souhaitez vous pouvez aussi utiliser des outils plus performants, mais plus complexes à utiliser comme Yui Compressor développé par Yahoo.

Google a sortir un outil plus puissant puisqu’il permet aussi de réunir tout les fichiers JS ou CSS dans un seul fichier.
Le but étant de diminuer le nombre de requêtes HTTP (l’élément le plus important en terme de performance).

Et maintenant MonBouquet se charge aussi vite que le vent ; )