Pierre

15 décembre 2015
w

Des questions ?

Besoin de prendre contact, de présenter votre projet ?

w

Contactez-moi !

Je serai heureux de répondre à toutes vos questions.

Contact

Optimisation des accès des fichiers statiques grâce au .htaccess

Création

Après la phase développement et de création du site Internet, arrive toute la période dédiée à l’optimisation du code, des accès et autres aspects techniques du site Internet. Certaines choses comptent plus que d’autres pour une bonne indexation des moteurs de recherche sur Internet et pour la réussite d’un site web. La rapidité de chargement. […]
Header HTML

Après la phase développement et de création du site Internet, arrive toute la période dédiée à l’optimisation du code, des accès et autres aspects techniques du site Internet.

Certaines choses comptent plus que d’autres pour une bonne indexation des moteurs de recherche sur Internet et pour la réussite d’un site web.

  • La rapidité de chargement.
  • des données bien structurées,
  • des mots clés savamment utilisés (SEO),
  • un contenu intéressant,
  • la facilité de partage des données, etc.

Aujourd’hui on va s’arrêter sur les bonnes pratiques pour optimiser l’accès aux données statiques d’un site web. C’est-à-dire tous les fichiers qui ne changent pas souvent. Cela regroupe :

  • les images,
  • les polices,
  • les fichiers PDF,
  • les fichiers javascript
  • ou encore les feuilles de style.

La méthode que j’utilise est celle du fichier .htaccess. Ce fichier qui se trouve dans la plupart des cas à la racine du serveur web contient certaines instructions qui dictent son comportement au serveur. Voici donc quelques règles de base (et standards) qui sont bien pratiques pour servir les fichiers statiques à vos utilisateurs.

Ouvrez votre fichier .htaccess avec votre éditeur préféré, moi c’est Notepad++ (dont je parle ici) et ajoutez les règles suivantes :

<IfModule deflate_module>
 <IfModule filter_module>
 AddOutputFilterByType DEFLATE text/plain text/html
 AddOutputFilterByType DEFLATE text/xml application/xml application/xhtml+xml application/xml-dtd
 AddOutputFilterByType DEFLATE application/rdf+xml application/rss+xml application/atom+xml image/svg+xml
 AddOutputFilterByType DEFLATE text/css text/javascript application/javascript application/x-javascript
 AddOutputFilterByType DEFLATE font/otf font/opentype application/font-otf application/x-font-otf
 AddOutputFilterByType DEFLATE font/ttf font/truetype application/font-ttf application/x-font-ttf
 </IfModule>
</IfModule>

# Optimisation cache fichiers statiques
<IfModule mod_expires.c>
 #a reactiver en fin de dév.
 ExpiresActive On
 ExpiresDefault "access plus 7200 seconds"
 ExpiresByType image/jpg "access plus 1 year"
 ExpiresByType image/jpeg "access plus 1 year"
 ExpiresByType image/png "access plus 1 year"
 ExpiresByType image/gif "access plus 1 year"
 ExpiresByType application/pdf "access 1 month"
 ExpiresByType text/javascript "access plus 2592000 seconds"
 ExpiresByType application/javascript A2592000
 ExpiresByType application/x-javascript "access plus 2592000 seconds"
 ExpiresByType text/css "access plus 2592000 seconds"
 ExpiresByType font/vnd.ms-fontobject "access plus 1 year"
 ExpiresByType font/x-font-ttf "access plus 1 year"
 ExpiresByType font/x-font-opentype "access plus 1 year"
 ExpiresByType font/x-font-woff "access plus 1 year"
</IfModule>
# fin optimisation

Le premier bloc permet de compresser les flux pour certains types de données (format html, texte, police, etc.), donc navigation plus rapide pour l’utilisateur, le deuxième permet de définir une valeur d’expiration par défaut de 2 heures (pour toutes les extensions non traitées) et des règles précises pour les fichiers images et polices (1 an), les fichiers PDF, css et js (1 mois).

Ainsi pour tous les sites, blogs, vitrines, boutiques où les utilisateurs reviennent régulièrement, on évite à leurs navigateurs de recharger des ressources auxquels ils ont déjà accédé.

Bonne indexation, ergonomie soignée,navigation fluide et rapide, contenu intéressant et vous avez toutes les clés de la réussite pour votre site internet 🙂 !

Information : Utilisateur convaincu depuis de nombreuses années par ce thème, je suis inscrit en tant qu’affilié sur le site d’elegant themes. Ainsi en cliquant sur le logo ci-dessous, vous bénéficierez d’une remise de 10% sur l’achat du thème et si vous l’achetez, je recevrai une commission :).

0 commentaires