Pourquoi et comment minifier votre code HTML, CSS et JS

La vitesse de chargement d'un site web est l'un des principaux critères d'évaluation par les moteurs de recherche. C'est aussi et surtout un critère important pour le visiteur humain impatient qui n'attendra jamais plus de 2 secondes pour que votre site web se charge sur son écran.

Table des matieres

• Comment ça marche ?
• Minifier : le pourquoi du comment
• Minifier avec CompressMyCode
• Minifier son code avec des Plugins WordPress
• Conclusion

Comment ça marche ?

Votre site web contient sûrement énormément de fichiers HTML, CSS et JavaScript. Il est important que ces fichiers de codes soient les plus propres et les plus rapides possibles. Le fait qu’ils soient écrits par des humains fait que ces fichiers contiennent des informations inutiles à l’interprétation du code par un ordinateur comme par exemple les commentaires, les espaces qui sont là afin de garder une certaine lisibilité du code pour les développeurs. Mais il existe une solution, celle de minifier vos fichiers.

Minifier : le pourquoi du comment

Minifier (Minify en anglais) est un terme de programmation qui signifie "enlever les caractères inutiles" à l'exécution du code. Vous voulez rendre vos visiteurs et Google heureux ? Alors minifier votre code dès maintenant.

Pour minifier votre code, il faut supprimer :

• Les espaces
• Les sauts de lignes
• Les commentaires
• Les séparateurs de bloc

En minifiant votre code, vous réduisez donc la quantité de code qui est transféré sur le web. Donc plus votre code est léger, plus la bande passante sera conservée et plus le site web s’affichera rapidement.

Minifier ou Compresser : quelle différence ?

Un fichier JavaScript minifié conserve son format JS, alors qu’un fichier compressé en GZIP est un fichier au format .gzip. Un humain pourra toujours comprendre un code minifié même si cela est difficile, en revanche, il sera incapable de comprendre un format GZIP.

Minifier avec CompressMyCode

Compress My Code est notre outil favori pour la minification. Sa principale qualité est de prendre en charge sur une même interface le HTML, le CSS et le JavaScript. De plus, différentes options sont disponibles pour ajuster le degré de compression du code et de certaines propriétés.

Minifier son code avec des Plugins WordPress

Oui c’est possible et cela va vous faire gagner énormément de temps car celui-ci va minifier automatiquement votre code. Cette méthode est donc extrêmement simple et est la moins chronophage puisque vous n’avez strictement aucune manœuvre à effectuer. Nous allons vous l’expliquer simplement, juste en dessous : 

Ce PlugIn gratuit combine et minifie vos fichiers CSS et JavaScript. Il améliore la compatibilité avec d'autres plugins et des thèmes en utilisant le système d'encodage des script "wp_enqueue_script" de WordPress. Un des meilleurs PlugIn pour améliorer la vitesse de votre site web. Sachez qu'il est également compatible pour les multisites.

Conclusion

Nous vous recommandons l’outil Google Page Speed Insight pour effectuer des tests sur la vitesse de chargement des pages de votre site web. Il vous est possible de faire le test de vos pages et articles à la fois sur les appareils mobiles ou desktop. Vous pourrez donc faire la comparaison avant et après l’utilisation du plugin que nous vous conseillons ou alors la minification de vos fichiers.