Vous n’êtes pas sans savoir que depuis maintenant quelques mois Google prend en compte la vitesse de chargement de vos pages Web pour effectuer son classement lors de l’indexation et du retour des résultats de recherche. On peut donc facilement résumer cela par : à site léger, meilleur référencement tu auras !
Pourquoi compresser ?
La compression vous permettra d’optimiser votre site sur plusieurs points très intéressants à prendre en compte :
- économie de la bande passante
- performances du site
- référencement
Rien que ces points devraient vous donner envie d’en savoir un peu plus… non ?
Mais qu’est-ce que c’est ?
La compression gzip est une compression utilisant un format GNUzip (le projet GNU). Tout se passe directement sur les serveurs hébergeant vos sites Web. Le serveur compresse les données, votre navigateur lui se chargera de les décompresser.
- Le serveur compresse les données (code HTML, CSS, javascript, etc.)
- Les fichiers transitent par le réseau via HTTP
- Le navigateur décompresse les données avant de les interpréter
Mon navigateur le prend en charge ?
La plupart des navigateurs modernes prennent en charge ce type de compression puisqu’elle est prévue depuis 1999. Ainsi Firefox, Opera et Safari prennent en charge cette compression sur toutes leurs versions, opera depuis sa version 5.12 et IE depuis sa version 4.
Oui mais…
Jusqu’à IE6 ce mode de compression pose quelques problèmes, puisqu’il peut arriver certains bogues lors de la décompression. C’est pourquoi dans les quelques lignes de code qui vont suivre, IE ne sera pas pris en compte (impossibilité de cibler un navigateur sur sa version).
Utiliser la compression Gzip
Le code que je vais vous donner est un code simplifié fonctionnel pour les serveurs mutualisés OVH. En effet pour plus de détail sur son utilisation sur d’autres « niveaux » de serveurs, je vous renvoie sur l’excellent article de Dew.
Je vous invite donc à créer un fichier .htaccess à la racine de votre site. Pour cela sous Windows il vous faudra créer un fichier .txt et en changer l’extension directement sur votre serveur. (grâce à Filezilla par exemple)
Quoi qu’il en soit je vous invite à entrer ces quelques lignes de codes dans votre fichier. Ce sont celles que j’utilise sur ce domaine, cela fonctionne parfaitement, mais peut-être n’aurez-vous pas besoin de tout, je vous détaille donc chaque ligne.
Fichier « .htaccess »
## activation ZEND optimizer
SetEnv ZEND_OPTIMIZER 1
## suppression de SESSID dans les url
SetEnv SESSION_USE_TRANS_SID 0
## serveur en PHP5
SetEnv PHP_VER 5
## Commenter la ligne ci-dessous si plantage
# php_flag zlib.output_compression on
## Activer le filtre
SetOutputFilter DEFLATE
## Certains navigateurs ne peuvent pas avoir GZIP (les vieux)
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0678 no-gzip
## On ne prend pas IE
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
## On ne compresse pas les images, elles le sont déjà
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png)$ no-gzip dont-vary
## on gère le cas des proxy
Header append Vary User-Agent env=!dont-varyPour information un dièse devant une ligne sert à commenter cette ligne, elle devient donc une simple note et n’est pas comprise par le serveur. Le double dièse c’est juste pour la présentation 🙂
Le ZEND OPTIMISER doit être activé (ligne 2) pour pouvoir utiliser la compression Gzip. Sauf que sur OVH il semblerait que PHP5 soit nécessaire pour que l’outil de compression fonctionne. Il faut donc renseigner la version de PHP à utiliser (ligne 8).
Bon ! Sachez que je ne suis pas spécialiste du langage indien (Apache), donc certains points sont flous pour moi. Si un des visiteurs s’y connait là dessus qu’il n’hésite pas à nous en dire davantage.
Merci d’avance.
Et après ?
Et bien normalement c’est tout. Vous venez d’optimiser votre site Internet pour son chargement. Votre référencement vous remerciera, et vos visiteurs aussi je pense !
Vous pouvez, si ce n’est pas déjà fait, inscrire votre site Internet sur Google dans les outils pour Webmasters. Cet outil très pratique vous livre un grand nombre d’informations sur la vitesse de chargement de vos pages (Labos > Performances du site), mais aussi sur les principaux sites qui redirigent sur vos pages, sur les mots-clefs qui ressortent de l’indexation de vos pages, etc.
Un outil très pratique, et gratuit, dont il serait dommage de se priver.
La prochaine fois nous verrons comment utiliser d’autres outils à notre disposition pour tester l’optimisation de nos pages Web, ainsi que la mise en cache des fichiers de notre site.
A la prochaine 😉
Sources et liens utiles :
Partager la publication "Optimiser le chargement de vos pages avec la compression Gzip"
Bonjour,
Très bien ce petit script d’optimisation, je suis passé d’une page de 104ko à 18ko !
Par contre ce que je ne comprend pas c’est que sous firefox quand je fait information de la page, j’ai bien 18ko, mais sous chrome avec l’outils d’analyse, il me met toujours 102ko. Quelqu’un aurait-il une explication ?
Bonsoir,
Il est probable que l’outil d’analyse de Chrome ne présente que le chiffre après décompression, tout simplement, mais cela m’étonne tout de même.
Quel outil utilisez-vous ?
Je pense que la compression n’en reste pas moins efficace 🙂
Bonne continuation Sam.
Bonjour Sam,
Voici de quoi tester une page : http://www.whatsmyip.org/http_compression/
Je l’ajoute aux liens utiles de l’article.
Merci, c’est vrai de plus en plus important d’optimiser au mieux le temps de chargement de ses sites web.
ho nice !
ca marche super bien !
je suis passé d’une page de 95ko a 13ko
merci beaucoup
Ca marche super bien . Je viens de gagner un temps précieux pour la vitesse de chargement de mon blog .
Merci à toi pour ces lignes de code .
Je t’en prie, et merci à toi pour ton retour 🙂
Bonjour. Votre code pour le fichier .htaccess fonctionnerait-il sur un mutualisé Online.net ?
Merci. Alex
Bonsoir,
Je fais souvent mention de OVH car je n’ai que ça sous la patte pour tester, mais normalement ça devrait fonctionner.
Il suffit de tester, si ça pose problème ça devrait provoquer une erreur 500 🙂
Au plaisir.
Sur OVH, c’est pas PHP 4 qui tourne plutôt ?
Quelle est l’utilité de
## activation ZEND optimizer
SetEnv ZEND_OPTIMIZER 1
## suppression de SESSID dans les url
SetEnv SESSION_USE_TRANS_SID 0
Personnellement, je n’utilise que les deux lignes ci-dessous et tout à l’air de fonctionner 🙂
SetOutputFilter DEFLATE
AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css text/javascript application/x-javascript
Bonjour Romain,
Je crois que PHP4 tourne encore par défaut chez OVH oui, du coup il faut « activer » PHP 5 ou utiliser des extensions .php5 (ce qui n’est pas pratique).
Comme pour l’activation de PHP 5, tout dépend de l’activation ou non de ZEND_OPTIMIZER.
Je m’assure qu’il soit activé. Mais si ça fonctionne sans tant mieux.
SESSION_USE_TRANS_SID est une saloperie (désolé) de OVH qui te place une variable PHPSESSID vers les pages en PHP. Elle est activée par défaut. Je ne sais pas l’expliquer, je sais juste que désactiver cette option permet de retirer l’info dans l’URL.
Voili voiloù ^^
Merci pour les précisions 🙂 Et que fait :
## on gère le cas des proxy
Header append Vary User-Agent env=!dont-vary
?
Je pense que la doc t’aidera plus que mes explications approximatives : http://httpd.apache.org/docs/trunk/fr/mod/mod_deflate.html
Bonne continuation 🙂
Bonjour Geoffrey,
Sur mon .htaccess, il y à pas mal de codes et je voudrais faire le tri dans tout ça, je voulais ajouter ton code mais certains y sont déjà mais écrit différemment.
Saurais-tu me dires si j’ai des codes inutiles qu’on peut supprimer ou modifier.
Voici mon htaccess :
———————–
SetEnv PHP_VER 5_4
SetEnv REGISTER_GLOBALS 0
SetEnv ZEND_OPTIMIZER 1
# MAIN
RewriteEngine On
ServerSignature Off
Options All -Indexes
Options +FollowSymLinks
# SVN protect
RewriteRule ^(.*/)?.svn/ – [F,L]
# Secure .htaccess
Order Allow,Deny
Deny from all
# Secure wp-config.php
Order Deny,Allow
Deny from all
# FILTER REQUEST
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
# BEGIN W3TC Browser Cache
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html
Header append Vary User-Agent env=!dont-vary
AddOutputFilterByType DEFLATE text/css application/x-javascript text/x-component text/html text/richtext image/svg+xml text/plain text/xsd text/xsl text/xml image/x-icon
FileETag None
Header set X-Powered-By « W3 Total Cache/0.9.2.4 »
FileETag None
Header set X-Powered-By « W3 Total Cache/0.9.2.4 »
FileETag None
Header set X-Powered-By « W3 Total Cache/0.9.2.4″
# END W3TC Browser Cache
# BEGIN W3TC Page Cache core
RewriteEngine On
RewriteBase /blog/
RewriteRule ^(.*\/)?w3tc_rewrite_test$ $1?w3tc_rewrite_test=1 [L]
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteRule .* – [E=W3TC_ENC:_gzip]
RewriteCond %{REQUEST_METHOD} !=POST
RewriteCond %{QUERY_STRING} = » »
RewriteCond %{HTTP_HOST} =www.sospc95.fr
RewriteCond %{REQUEST_URI} \/$ [OR]
RewriteCond %{REQUEST_URI} (sitemap(_index)?\.xml(\.gz)?|[a-z0-9_\-]+-sitemap([0-9]+)?\.xml(\.gz)?) [NC]
RewriteCond %{REQUEST_URI} !(\/wp-admin\/|\/xmlrpc.php|\/wp-(app|cron|login|register|mail)\.php|\/feed\/|wp-.*\.php|index\.php) [NC,OR]
RewriteCond %{REQUEST_URI} (wp\-comments\-popup\.php|wp\-links\-opml\.php|wp\-locations\.php) [NC]
RewriteCond %{HTTP_COOKIE} !(comment_author|wp\-postpass|wordpress_\[a\-f0\-9\]\+|wordpress_logged_in) [NC]
RewriteCond %{HTTP_USER_AGENT} !(W3\ Total\ Cache/0\.9\.2\.4) [NC]
RewriteCond « %{DOCUMENT_ROOT}/blog/wp-content/w3tc/pgcache/%{REQUEST_URI}/_index%{ENV:W3TC_UA}%{ENV:W3TC_REF}%{ENV:W3TC_SSL}.html%{ENV:W3TC_ENC} » -f
RewriteRule .* « /blog/wp-content/w3tc/pgcache/%{REQUEST_URI}/_index%{ENV:W3TC_UA}%{ENV:W3TC_REF}%{ENV:W3TC_SSL}.html%{ENV:W3TC_ENC} » [L]
# END W3TC Page Cache core
# BEGIN WordPress
RewriteEngine On
RewriteBase /blog/
RewriteRule ^index\.php$ – [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /blog/index.php [L]
# END WordPress
## EXPIRES CACHING ##
ExpiresActive On
ExpiresByType image/jpg « access 1 year »
ExpiresByType image/jpeg « access 1 year »
ExpiresByType image/gif « access 1 year »
ExpiresByType image/png « access 1 year »
ExpiresByType text/css « access 1 month »
ExpiresByType application/pdf « access 1 month »
ExpiresByType text/x-javascript « access 1 month »
ExpiresByType application/x-shockwave-flash « access 1 month »
ExpiresByType image/x-icon « access 1 year »
ExpiresDefault « access 2 days »
## EXPIRES CACHING ##
————————–
Merci
Cordialement
SOSPC95
Hello,
Je ne suis pas expert sur l’organisation d’un fichier .htaccess, mais il me semble que tu as des lignes dupliquées :
De même
RewriteEnginesemble apparaitre plusieurs fois, la déclaration initiale doit être suffisante.Sinon pour plus de détails, notamment pour les contextes de réécriture :
apache.org – Mod_Rewrite
En effet, j’avais pas vu, je vais déjà supprimer les lignes dupliquées.
Et sinon le code que tu donnes dans cet article, je peux le rajouter sans problème, je n’aurais pas de code dupliqués ?
Je ne pense pas que ça soit utile, la compression GZIP à l’air déjà activée.
Tu as déjà ca :
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html
Header append Vary User-Agent env=!dont-vary
AddOutputFilterByType DEFLATE text/css application/x-javascript text/x-component text/html text/richtext image/svg+xml text/plain text/xsd text/xsl text/xml image/x-icon
Et enfin si j’étais toi, à part supprimer les lignes dupliquées je ne toucherais à rien, WordPress risquerait de ne plus fonctionner correctement 😉
Yep, tu as déjà la compression Gzip activée 🙂
Mêmes conseils que Romain, ne touche à rien entre les commentaires de WordPress.
Merci Romain !
🙂
Ok, merci pour vos conseils.
Petite mise à jour vers
SetEnv PHP_VER 5_3
?
Encore merci pour cet article, il me sert fréquemment.
Et petit ajout, selon ce site http://redbot.org/, cette ligne est à éviter :
Header append Vary User-Agent env=!dont-vary
Des avis/explications ?
Merci Romain, c’est édité oui.
La dernière fois j’avais 5_TEST moi. Drôle de version…
Sinon pour le header, je sais juste que dans certains cas ça fait planter le serveur, mais je n’ai jamais rencontré le cas sur OVH.
Si c’est déconseillé pour une autre raison, je ne la connais pas.
Bonjour,
Dans votre code, il est écrit :
## Commenter la ligne ci-dessous si plantage
# php_flag zlib.output_compression on
Donc à la base, on doit décommenter cette ligne afin que ça fonctionne? Sinon, elle sert à quoi exactement?
Merci pour votre aide 🙂
Hello,
La doc fait ça mieux que moi : http://www.php.net/manual/fr/intro.zlib.php
Si cette ligne est commenté ça ne gêne pas la suite 🙂
Yop tout le monde, j’ai placé le fichier .htaccess avec le code repris ci-dessus mais malheureusement il m’affiche des erreurs dans ma page.
Warning: include() [function.include]: URL file-access is disabled in the server configuration in /homez.27/chinaeur/www/fr/catalogues.php on line 37
Warning: include(http://www.ceb2b.eu/fr/nav.php) [function.include]: failed to open stream: no suitable wrapper could be found in /homez.27/chinaeur/www/fr/catalogues.php on line 37
Warning: include() [function.include]: Failed opening ‘http://www.ceb2b.eu/fr/nav.php’ for inclusion (include_path=’.:/usr/local/lib/php’) in /homez.27/chinaeur/www/fr/catalogues.php on line 37
Warning: include() [function.include]: URL file-access is disabled in the server configuration in /homez.27/chinaeur/www/fr/catalogues.php on line 50
Warning: include(http://www.ceb2b.eu/fr/blocs.php) [function.include]: failed to open stream: no suitable wrapper could be found in /homez.27/chinaeur/www/fr/catalogues.php on line 50
Warning: include() [function.include]: Failed opening ‘http://www.ceb2b.eu/fr/blocs.php’ for inclusion (include_path=’.:/usr/local/lib/php’) in /homez.27/chinaeur/www/fr/catalogues.php on line 50
Est ce que qqn peut m’aider ? Merki 🙂
Hello,
Un fichier
.htaccessqui provoque autre chose qu’une erreur 500, j’ai rarement vu ça 🙂Je ne sais pas comment tu fais tes
include(), mais jettes un œil là-dessus :http://stackoverflow.com/questions/6402176/problem-getting-php-include-working-with-files-in-different-folders
Bonne journée.
Bonjour Geoffrey,
Merci pour ta réponse.
Mes include fonctionne correctement, c’est seulement lorsque je place ce bout de code dans le ht.access qu’il m’affiche cette erreur.
Bonne journée également
Merci pour cet article bien pratique !
@Raph, il faut que tu vérifies à chaque fois les directives du htaccess afin de t’assurer que tout fonctionne convenablement. Il ne faut pas copier bêtement les choses qu’on trouve sur le net. En plus, ici, c’est clair et détaillé. Merci à l’auteur!
Merci pour ton feedback 🙂
Bonjour et merci pour cette ressource !
Je ne suis pas un spécialiste du paramétrage de serveur Apache non plus, alors j’ai « bêtement » copié-collé le code que tu proposais il y a plus de 3 ans !
Ça fonctionne ainsi sur un hébergement mutualisé ovh Pro. Depuis 3 ans les choses ont un peu changé donc php5 est à présent la version par défaut (ou pour être plus précis, la version 5.3.13), pas besoin de la ligne qui défini la version à utiliser. Pour le reste, comme je n’y connais pas grand-chose, j’ai laissé comme c’était. Le gain est visible, les pages s’affichent vraiment beaucoup plus rapidement. On va voir si le cpu du serveur va supporter cette charge supplémentaire. Je vous tiens au courant.
Joyeux Noël à tous ! 🙂
Merci à toi pour ces conseils, super utile !