Comment supprimer en toute sécurité les CSS inutilisés dans WordPress – et pourquoi

Le principe directeur de WordPress est qu’Internet est pour tout le monde, et que n’importe qui peut créer un site Web, même sans connaissances en codage. Et c’est vrai – vous avez besoin précisément de zéro connaissance de codage pour créer un site Web, mais cela signifie s’appuyer sur le codage de quelqu’un d’autre.

Les écueils sont évidents : il peut arriver que votre site web en arrive à contenir du code, souvent en CSS, qu’il n’a pas vraiment besoin de tourner. Ce tutoriel est tout au sujet comment supprimer les CSS inutilisés de votre site WordPress. Mais qu’est-ce que le CSS ? Comment se fait-il que votre site Web ait un code dont il n’a pas besoin ? Si le code ne fait rien, pourquoi ne pas simplement le laisser ? Nous tenterons de répondre à ces questions, et plus encore. Voici de quoi nous allons parler :

Qu’est-ce que le CSS ?

CSS signifie feuilles de style en cascade. Il est un ensemble d’instructions pour un navigateur qui dicte l’apparence d’une page Web aux utilisateurs. Une page Web est structurée à l’aide d’un langage de balisage, tel que HTML, mais HTML n’est pas lisible pour l’utilisateur. Un navigateur Web lit le code HTML et présente le contenu à un utilisateur sous une forme lisible par l’homme.

Mais l’interprétation par défaut d’un navigateur d’un texte balisé donnerait lieu à de nombreuses pages indiscernables, et c’est là qu’intervient CSS. CSS a de nombreuses utilisations : changer la taille de la police, les couleurs et le type, les sauts de ligne et l’espacement des paragraphes, ajouter et manipuler images d’arrière-plan, et bien plus encore.

D’où vient le CSS inutilisé et pourquoi le supprimer ?

Il existe de nombreuses façons dont un code inutile pourrait se retrouver sur votre site Web. En ce qui concerne CSS, il s’agira probablement de quelque chose que vous avez installé sur votre site WordPress, ce qui affecte la façon dont il est présenté à l’utilisateur. Par exemple, un thème a son propre CSS, rendant votre site Web différent de tous les autres n’utilisant pas le même thème. Un plugin tel que un constructeur de page peut avoir son propre CSS, ainsi que les polices, les polices d’icônes et de nombreux autres logiciels que vous pouvez installer.

En relation :  Comment démarrer un hôtel pour chats

Mais quel est le mal, nous vous entendons demander. Eh bien, le résultat final est que votre site Web charge beaucoup de fichiers dont il n’a pas besoin pour fonctionner, ce qui signifie que votre temps de chargement est inutilement prolongé. Temps de chargement lents n’affectez pas seulement l’expérience utilisateur de vos visiteurs – les moteurs de recherche prennent en compte les taux de rebond (la vitesse à laquelle un utilisateur « abandonne » sur votre site Web) et le temps de chargement.

Et bien que les fichiers CSS aient tendance à être petits, ils peuvent être très nombreux sur un site Web donné. C’est pourquoi il n’existe pas de code inoffensif et inutile.

Comment déterminer si mon site Web a des CSS inutilisés

Déterminer si un site Web souffre de problèmes CSS inutilisés est relativement simple : Google a un outil spécialement pour cela. Vous pouvez utiliser Google PageSpeed ​​Insights pour déterminer si votre site Web souffre de ralentissements inutiles et voir combien d’entre eux peuvent être attribués à des CSS inutilisés.

Google PageSpeed ​​Insights

Nous avons effectué le test sur un site Web qui, de toute évidence, présente de nombreux problèmes. Vous pouvez développer les résultats de la suppression des CSS inutilisés pour voir les suggestions de Google.

Les suggestions de Google

Clairement, cela ne fonctionne que pour les critères de Google. Cependant, bien que tous les moteurs de recherche aient des algorithmes différents, ils ont tendance à fonctionner de la même manière. En outre, les temps de chargement lents sont des temps de chargement lents, quelle que soit la façon dont vous les coupez, et personne ne veut cela.

Comment supprimer en toute sécurité les CSS inutilisés

Le défi ici est de savoir quel CSS est inutile. La réponse? Vous n’avez pas besoin de le savoir vous-même. Vous pouvez et devez vous fier à nouveau au code de quelqu’un d’autre. Dans ce cas, il s’agit d’un plugin : Nettoyage des actifs.

Tout d’abord, installez et activez le plugin. Vous serez immédiatement redirigé vers le plugin Commencer écran. Pour commencer à supprimer les CSS inutilisés, sélectionnez Réglages dans le menu de droite.

Réglages

Afin de tester différents paramètres sans affecter les visiteurs du site Web, vous devez activer le mode test du plugin. Pour ce faire, sélectionnez le Mode d’essai onglet et faites glisser le curseur et cliquez sur Mettre à jour tous les paramètres.

Mode d'essai

Maintenant, ce plugin a beaucoup d’options et de paramètres. Nous allons nous concentrer sur la suppression des CSS inutilisés. Pour ce faire, nous avons besoin du Gestionnaire CSS & JS réglages. Il ouvrira le Page d’accueil sous-onglet. C’est ici que vous pouvez voir quels fichiers sont chargés sur la page d’accueil de votre site Web.

En relation :  Top 18 des sites Web d'architecture réalisés avec les thèmes interactifs Qode
Gestionnaire CSS & JS

En faisant défiler la liste, vous pouvez voir chacun de ces fichiers, ainsi que de nombreuses données pertinentes, telles que sa source, sa position, la taille du fichier et le reste. Vous pourriez également obtenir un Pointe, un indice utile pour savoir si un morceau de code est nécessaire ou non sur la page.

Dans le cas de Formulaire de contact 7, par exemple, vous pouvez voir que le fichier est lié à un formulaire. La recommandation est que le fichier soit déchargé sur le Page d’accueil s’il n’y a pas de formulaires dessus. Il en va de même pour toutes les autres pages n’utilisant pas de formulaire.

pour décharger Formulaire de contact 7CSS de la Page d’accueil, activez le curseur et cliquez sur Mettre à jour.

Décharger le formulaire de contact 7

Et c’est aussi simple que cela : vous avez maintenant rendu votre site Web un peu plus rapide à charger en supprimant les CSS inutilisés.

Le problème, c’est que vous devez également faire tout cela pour tous les articles et pages. Pour charger une liste de CSS pour un article, par exemple, passez au Poster onglet, recherchez-le dans le champ de recherche et sélectionnez un article dans la liste.

Recherche de poste

Une fois que vous êtes satisfait du CSS que vous avez déchargé, testez si tout se charge correctement et vous avez terminé. Tu peux puis désactiver le mode test, pour que les paramètres s’appliquent à tous les utilisateurs, et pas seulement aux administrateurs connectés.

En conclusion

Comme vous pouvez le constater, vous avez de bonnes raisons de vous assurer que votre site Web souffre de CSS inutilisés. Il faut du travail pour supprimer tous les CSS inutilisés de votre site Web, surtout s’il contient beaucoup de pages, mais les résultats en valent la peine – vos visiteurs apprécieront des temps de chargement plus rapides, tandis que les moteurs de recherche ne vous pénaliseront pas pour la lenteur et le taux de rebond , conduisant à plus de visiteurs potentiels.

Moyens Staff
Moyens I/O Staff vous a motivé, donner des conseils sur la technologie, le développement personnel, le style de vie et des stratégies qui vous aider.