Idea To Blog : Générateur d'idées pour votre blog

Votre site est trop long à s'afficher ?

Retrouvez quelques consignes afin d'accélérer le temps de chargement de sa page.

Utiliser le fichier .htaccess pour accélérer l'affichage de son site grâce à la compression.

Veuillez noter que les modes de compression des pages présentées ci-dessous ne sont pas acceptés par tous les hébergeurs. Notez également que le Gzip est plus performant que le Deflate.

Deux modes sont disponibles et vraiment efficace pour compresser les paquets.

Ces modes de compressions vont impacter les fichiers html, css et JS jusqu'à 30% de leur taille réelle.

Afin d'optimiser la compression, voici quelques lignes de code activant le mode Deflate et Gzip. Le dernier mode présenté sera utilisé par défaut par votre serveur.

 SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)s,?s(gzip|deflate)?|X{4,13}|~{4,13}|-{4,13})$ HAVE_Accept-Encoding
RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding
# Legacy versions of Apache
AddOutputFilterByType DEFLATE text/html text/plain text/css application/json
AddOutputFilterByType DEFLATE text/javascript application/javascript application/x-javascript
AddOutputFilterByType DEFLATE text/xml application/xml text/x-component
    
SetOutputFilter DEFLATE
Header set Cache-Control "max-age=172800, public, must-revalidate"
SetOutputFilter DEFLATE
mod_gzip_on Yes
    mod_gzip_dechunk Yes
    mod_gzip_item_include file .(html?|txt|css|js|php|pl)$
    mod_gzip_item_include handler ^cgi-script$
    mod_gzip_item_include mime ^text/.*
    mod_gzip_item_include mime ^application/x-javascript.*
    mod_gzip_item_exclude mime ^image/.*
    mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*

Vérifiez la compression grâce au site : http://checkgzipcompression.com/

Utiliser le fichier .htaccess pour accélérer l'affichage de son site grâce à la mise en cache

Mettez en cache le contenu de votre page. Cela permettra de sauvegarder votre contenu dans le cache du navigateur. ainsi si  votre visiteur revient plus tard sur votre site, ce dernier sera plus rapide à charger.

    ExpiresActive On
    ExpiresDefault "access plus 5 seconds"
    ExpiresByType image/jpg "access plus 2 month"
    ExpiresByType image/jpeg "access plus 2 month"
    ExpiresByType image/png "access plus 2 month"
    ExpiresByType image/gif "access plus 2 month"
    ExpiresByType image/ico "access plus 2 month"
    ExpiresByType image/icon "access plus 2 month"
    ExpiresByType image/x-icon "access plus 2 month"
    ExpiresByType text/css "access plus 2 month"
    ExpiresByType text/javascript "access plus 2 month"
    ExpiresByType text/html "access plus 5 seconds"
    ExpiresByType application/xhtml+xml "access plus 5 seconds"
    ExpiresByType application/javascript "access plus 2 month"
    ExpiresByType application/x-javascript "access plus 2 month"
    ExpiresByType application/x-shockwave-flash "access plus 2 month"
    ExpiresByType application/x-font-woff "access plus 2 month"
    ExpiresByType application/x-font-ttf "access plus 2 month"
    ExpiresByType application/x-font-otf "access plus 2 month"

Gérer les codes JavaScript et CSS qui ralentissent l'affichage du contenu.

Optimisation des codes JS pour accélerer la vitesse de chargement de la page.

• Dans la conception de votre page, vérifiez que les scripts JS soient bien placés en bas de page.

En effet, le script ne sera utilisé que lorsque la page sera affichée. Inutile donc de préparer une action si les boutons ne sont pas encore présents sur votre page.

• Eliminez les scripts inutiles pour une page.

Vous avez peut-être tendance à créer des pages de scripts que vous incluez partout où vous avez besoin de l'un d'entre eux. Il est vivement conseillé de ne mettre que les scripts dont vous avez besoin.

• Compressez les scripts JS. Le tuto est disponible sur https://developers.google.com/speed/docs/insights/MinifyResources

Optimisation des codes CSS pour accélerer la vitesse de chargement de la page.

• Réduisez la taille des ressources CSS en éliminant le code inutile.
• Optimisez le poids des images en ajustant la taille et le format de l'image.

Vous retrouverez tous ces conseils et bien plus encore sur :

https://developers.google.com/speed/pagespeed/insights/

https://www.bxnxg.com/minituto-05-optimiser-site-web-htaccess-cache-deflate-gzip-etag-astuce-browser-rewrite/