Pourquoi et comment minifier votre code HTML, CSS et JS

par Nicolas Chevillard le 14/06/2022

Mis à jour le 30/09/2022


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 ?

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


minifier code css html et js


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 : 


plugin wordpress better wordpress minify


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.







Nicolas Chevillard

Nicolas est assistant marketing pour Oshara Inc. Il est passioné par le digital et adore créer des contenus sur le thème du marketing et de la technologie pour vous en apprendre plus !

Contenu du lien personnel

Cet article a-t-il été utile ?

Les lecteurs de cet article lisent aussi ...

Pourquoi suivre un processus de conception pour vos logiciels ou applications web ?

Un sage a dit un jour que si on ne planifie pas, on planifie alors d'échouer. Souhaitez-vous réduire le temps de développement de vo...

Pourquoi suivre un processus d...


Comment installer une application web Laravel que vous avez cloné depuis Git

Laravel est un Framework php puissant qui vous permet de créer des applications web sur mesures

Comment installer une applicat...


Développer une application Native, Hybride ou Web ? Quelles sont les différences ?

Il existe différents types d'application (app), ayant chacune leurs avantages et inconvénients. Nous essayerons ici d'éclaircir vos ...

Développer une application Na...


Une agence de communication tout ce qu'il faut savoir

Une agence de communication to...


Les avantages du Marketing Social

Personne n'aurait pu s’imaginer il y a quelques années à quel point les médias sociaux gagneraient en popularité. Statista révè...

Les avantages du Marketing Soc...


Les secrets d'une stratégie marketing conforme au RGPD sans diminuer vos revenus ?

Le GDPR ou en francais RGPD est l’initiale de Réglement Général pour la Protection des Données et désigne la dernière directive...

Les secrets d'une stratégie m...