Formation Optimiser son référencement sur le web (SEO) : Fichier .htaccess
Le fichier .htaccess est un fichier de configuration pour les serveurs Apache et nous allons voir qu’il peut nous être très utile en SEO notamment pour optimiser la vitesse de chargement des pages grâce à la mise en cache et aux compressions de fichiers.
1. La mise en cache avec les expires headers
Les Expires Headers vous permettent de définir dans votre fichier .htaccess le temps de mise en cache par type de fichier. Lorsque le navigateur devra charger la page à un internaute qui sera déjà venu sur le site il aura donc beaucoup moins de requêtes à effectuer auprès du serveur car il aura gardé une partie des fichiers dans son propre cache.
Ce qui réduit donc considérablement le temps de chargement des pages qu’une personne aura déjà visitée.
Voici un exemple de mise en place des Expires Headers dans le fichier .htaccess :
<IfModule mod_expires.c>
ExpiresActive on
ExpiresDefault "access plus 1 month"
# CSS and JavaScript
ExpiresByType text/css "access plus 1 year"
ExpiresByType application/javascript "access plus 1 year"
</IfModule>Dans cet exemple nous passons ExpiresActive à on. puis nous précisions une ExpiresDefault de valeur “access plus 1 month” ce qui permettra donc d’établir une expiration par défaut par sécurité.
Enfin nous définissons les ExpiresByType en précisant le type de fichier ainsi que la valeur que l’on souhaite :
Les recommandations de PageSpeed sur GTmetrix précisent également de :
- ne pas hésiter à être agressif avec le cache pour toutes les ressources statiques
- mettre une expiration de minimum un mois
- ne pas mettre une expiration de plus d’un an
Pour les ressources changées fréquemment vous pouvez descendre bien en deçà. Notamment pour les types DATA. Exemple :
# DATA
ExpiresByType text/xml "access plus 0 seconds"
ExpiresByType text/html "access plus 0 seconds"
ExpiresByType text/plain "access plus 0 seconds"
ExpiresByType application/xml "access plus 0 seconds"
ExpiresByType application/json "access plus 0 seconds"
ExpiresByType application/rss+xml "access plus 1 hour"
ExpiresByType application/atom+xml "access plus 1 hour"
ExpiresByType text/x-component "access plus 1 hour"Bien évidemment ce ne sont que des recommandations et je vous invite à écrire ces Expires Headers en fonction de votre projet. Si celui-ci a d’autres fichiers amenées à être modifiés souvent vous devez en prendre compte.
Voici un exemple un peu plus complet d’Expires Headers :
<IfModule mod_expires.c>
ExpiresActive on
ExpiresDefault "access plus 1 month"
# DATA
ExpiresByType text/xml "access plus 0 seconds"
ExpiresByType text/html "access plus 0 seconds"
ExpiresByType text/plain "access plus 0 seconds"
ExpiresByType application/xml "access plus 0 seconds"
ExpiresByType application/json "access plus 0 seconds"
ExpiresByType application/rss+xml "access plus 1 hour"
ExpiresByType application/atom+xml "access plus 1 hour"
ExpiresByType text/x-component "access plus 1 hour"
# Icons
ExpiresByType image/ico "access plus 1 month"
ExpiresByType image/icon "access plus 1 month"
ExpiresByType text/ico "access plus 1 month"
ExpiresByType image/x-ico "access plus 1 month"
ExpiresByType image/x-icon "access plus 1 month"
ExpiresByType application/ico "access plus 1 month"
# Media: images, video, audio
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/jpg "access plus 1 month"
ExpiresByType video/ogg "access plus 1 month"
ExpiresByType audio/ogg "access plus 1 month"
ExpiresByType video/mp4 "access plus 1 month"
ExpiresByType video/webm "access plus 1 month"
# Webfonts
ExpiresByType font/truetype "access plus 1 month"
ExpiresByType font/opentype "access plus 1 month"
ExpiresByType application/x-font-ttf "access plus 1 month"
ExpiresByType application/x-font-woff "access plus 1 month"
ExpiresByType application/font-woff "access plus 1 month"
ExpiresByType image/svg+xml "access plus 1 month"
ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
# CSS and JavaScript
ExpiresByType text/css "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"
</IfModule>La compression Gzip et Deflate
Votre serveur Apache peut compresser les fichiers qu’il envoie pour que ceux-ci transitent plus vite par le réseau. Une fois que le navigateur récupère ces fichiers il les décompresse. Les fichiers qui ne seront pas compressés via cette méthode sont les fichiers javascripts externes, les pdf et les images.
Cette compression permet de réduire considérablement la taille d’un fichier
Il existe 2 modules de compression pour votre serveur Apache :
- mod_gzip : pour Apache 1.3.x et 2.0.x
- mod_deflate : pour Apache 2.0.x
Dans l’absolu vous pouvez utiliser les deux mais vous l’aurez compris le module mod_deflate est le plus récent et le plus conseillé à utiliser. Il a également tendance à mieux compresser que son comparse.
Voici donc un exemple de mise en place de la compression deflate via le fichier .htaccess :
#Gzip
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/shtml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
</IfModule>Réécriture d’url
Le module de réécriture du fichier .htaccess, mod_rewrite, vous permet d’effectuer des réécriture d’url. Ce module fonctionne en définissant une règle avec RewriteRule précédé d’une ou plusieurs conditions RewriteCond. Exemple :
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{SERVER_PORT} !=443
RewriteRule ^(.*)$ https://walkerspider.com/$1 [R=301,L]
</IfModule>L’exemple de réécriture d’url ci-dessus est une règle redirigeant la version du site http vers sa version https.
La condition : RewriteCond %{SERVER_PORT} !=443 se traduit par : “si le protocole du serveur est différent de 443”.
Certains serveurs ont le http en port 80 et le https en port 443
La règle : RewriteRule ^(.*)$ https://walkerspider.com/$1 [R=301,L] effectue une redirection avec le code status 301.
Le code status 301 désigne une redirection permanent (Moved Permanently).
Ce module de réécriture d’url depuis le fichier .htacces est donc très utile pour effectuer les redirections dont vous avez besoin afin d’éviter les duplicate content d’une version de votre site à une autre (avec www et sans www).
Besoin d'une formation personalisée ?
Avis