Améliorez la vitesse de chargement via PageSpeed Insights Part 4

  • février 10, 2019
  • SEO
No Comments
minification CSS javascript

4) minification CSS

La réduction des fichiers CSS est une autre activité qui peut vous faire gagner de précieuses millisecondes. La pratique montre que CSS est souvent beaucoup plus volumineux que nécessaire. Par conséquent, vous pouvez réduire votre CSS sans douleur sans crainte de perdre quoi que ce soit.

 

Si vous exploitez un petit site Web, qui n’est pas mis à jour fréquemment, envisagez d’utiliser un outil en ligne tel que CSSNano pour la minification CSS. Insérez simplement le code dans l’outil et attendez qu’il vous fournisse la version simplifiée de votre code CSS – aussi simple que cela. De tels minificateurs font un très bon travail de réduction du nombre d’octets. Par exemple, ils peuvent réduire la valeur de couleur # 000000 à seulement # 000, ce qui constitue une très bonne économie s’il existe de nombreuses valeurs de couleur comme celle-ci.

 

5) Minification JavaScript

Tout comme CSS, les ressources JavaScript doivent également être minimisées. Ce que vous devez faire, c’est consulter votre code JavaScript et supprimer toutes les données redondantes telles que les commentaires de code, le code inutilisé, les sauts de ligne et les symboles d’espacement.

 

Et tout comme avec la minification CSS, le moyen le plus rapide et le moins pénible de supprimer les données inutiles de votre code consiste à utiliser un minificateur en ligne. UglifyJS est hautement recommandé. De plus, vous pouvez configurer un processus qui réduit les fichiers de développement et les enregistre dans un répertoire de production chaque fois que vous déployez une nouvelle version.

 

6) Encodage des images

Je pense qu’il est clair que plus la taille de votre contenu est petite, moins il faut de temps pour télécharger la ressource. L’optimisation des images est une autre activité extrêmement importante qui peut réduire la charge totale de votre page de 80%. De plus, l’activation de la compression réduit l’utilisation des données pour le client ainsi que le temps de rendu de vos pages.

 

Compresser chaque image que vous téléchargez sur votre site peut être un processus très fastidieux. Mais plus important encore, il est très facile de l’oublier. Par conséquent, il est toujours préférable d’automatiser la compression d’image et de l’oublier définitivement. Alors faites-vous une immense faveur et utilisez imagemin ou libvips pour votre processus de construction. N’oubliez pas que plus la taille du fichier de vos images est importante, plus l’expérience réseau que vous offrez à vos utilisateurs est fluide, en particulier sur les appareils mobiles.

 

7) compression de texte

Le contenu textuel de votre site Web est une autre chose qui peut augmenter la taille en octets des réponses du réseau. Et comme vous le savez déjà, moins le nombre d’octets à télécharger est élevé, plus votre page se charge rapidement.

 

Google recommande vivement de compresser toutes les données compressibles en gz, et tous les navigateurs modernes suggèrent une compression gzip pour toutes les requêtes HTTP. En réalité, le fait de compresser des ressources peut réduire la taille de la réponse transférée jusqu’à 90%. Cela réduira également la durée du premier rendu de vos pages, ainsi que l’utilisation des données par le client.

 

Veillez donc à consulter ces exemples de fichiers de configuration pour les serveurs les plus populaires. Après cela, recherchez votre serveur dans la liste, passez à la section gzip et confirmez que votre serveur est configuré avec les paramètres recommandés.

 

Au lieu de gzip, vous pouvez également utiliser Brotli, qui est l’un des formats de données sans perte les plus récents. Contrairement au format gzip, Brotli présente de bien meilleures caractéristiques de compression. Mais il y a un inconvénient: plus le niveau de compression est élevé, plus le navigateur aura besoin de ressources pour le faire. C’est pourquoi tous les avantages en termes de taille de Brotli seront complètement annulés par le temps de réponse du serveur. Par conséquent, je ne recommanderais pas d’aller au-delà du 4ème niveau de compression (Brotli a 10 niveaux de compression) pour les actifs dynamiques. Toutefois, avec les actifs statiques que vous pré-compressez à l’avance, vous pouvez implémenter le niveau de compression le plus élevé.

 

8) Préchargement des demandes de clé

Comme vous le savez, il appartient aux navigateurs de choisir les ressources à charger en premier. Par conséquent, ils tentent souvent de charger les ressources les plus importantes telles que CSS avant les scripts et les images, par exemple. Malheureusement, ce n’est pas toujours la meilleure façon de faire. En préchargeant les ressources, vous pouvez modifier la priorité de chargement du contenu dans les navigateurs modernes en leur indiquant ce dont vous aurez besoin ultérieurement.

 

À l’aide de la balise <link rel = « preload »>, vous pouvez informer le navigateur qu’une ressource est nécessaire dans le code responsable du rendu du contenu ci-dessus, et lui permettre d’extraire la ressource dès que possible.

 

Voici un exemple d’utilisation de la balise:

 

<link rel = « preload » as = « script » href = « super-important.js »>

<link rel = « précharge » as = « style » href = « critical.css »>

 

Veuillez noter que la ressource sera chargée avec la même priorité. La différence est que le téléchargement commencera plus tôt car le navigateur connaît le préchargement à l’avance. Pour des instructions plus détaillées, veuillez consulter ce guide sur la priorisation des ressources.

A propos de nous et de ce blog

Nous sommes une entreprise de marketing numérique qui aide ses clients à obtenir d'excellents résultats dans plusieurs domaines clés.

Demander un devis gratuit

Nous proposons des services de référencement professionnels qui aident les sites Web à augmenter considérablement leur score de recherche organique afin de rivaliser pour le classement le plus élevé, même en ce qui concerne les mots clés les plus concurrentiels.

Subscribe to our newsletter!

Les champs marqués avec * sont requis

Retrouvez-nous

Adresse
83 Avenue Abderrahim Bouabid
80000, Agadir

Heures d’ouverture
Du lundi au vendredi : 9h00–17h00
Les samedi et dimanche : fermé

À propos de ce site

Pour commencer, la visibilité de votre site web sur les principaux moteurs de recherche Google , Bing, Yahoo est primordiale pour le développement de votre entreprise. Nos formules de référencement web vos proposent des stratégies ( Search Engine Optimisation ) et référencement naturel Google efficace et innovante. Nous mettons à votre disposition tout notre savoir-faire en web marketing, référencement web Google et redirection de trafic sur différents sites web.

Plus D'Articles SEO

Voir Tous les Articles SEO
Tout sur le RankBrain de Google : le système d’apprentissage automatique

Tout sur le RankBrain de Google : le système d’apprentissage automatique

Tout comme la plupart des mises à jour d'algorithmes de Google, RankBrain…
Lire la Suite
Comment j'ai optimisé le référencement d'un nouveau site Web

Comment j’ai optimisé le référencement d’un nouveau site Web

Est-il difficile de classer un tout nouveau site Web ? Tout dépend…
Lire la Suite
Le Black Hat SEO est une stratégie de référencement naturel (SEO)

Black Hat SEO : Qu’est-ce que c’est et pourquoi vous devriez l’éviter

Black Hat SEO peut sembler être un raccourci pour améliorer votre classement…
Lire la Suite
33 technique du référencement seo on-page

On-Page SEO : Optimiser chaque page sur votre site

pour aider les articles et les pages de blog à gagner en…
Lire la Suite
10 experts en la matière donnent les meilleurs conseils SEO

Contenu Cornerstone : 10 experts en la matière donnent les meilleurs conseils

Lorsqu’il s’agit de développer du contenu pour votre site, vous ne voulez…
Lire la Suite
la recherche sémantique, pourquoi elle est bonne pour le référencement

La Recherche sémantique et sont impact sur votre référencement

Cet article explique ce qu'est la recherche sémantique, pourquoi elle est bonne…
Lire la Suite