Comment optimiser l’élément gratuitement en utilisant les plug – ins smoush et hummingbird
Elementor n’est pas étranger à la communauté WordPress, car c’est l’un des meilleurs et des plus populaires générateurs de page au monde. Pour mieux optimiser, vous pouvez faire beaucoup d’améliorations avec l’aide de nos plug – ins gratuits smoush et hummingbird. Les sites WordPress créés avec elementor peuvent parfois être chargés lentement et inutilement en raison de plusieurs facteurs, dont de grandes images, cache, CDN, etc. Heureusement, avec smoush et hummingbird, vous pouvez aider à atténuer tout ralentissement et maximiser le potentiel de votre site.
Nous allons jeter un coup d’oeil à tous les exemples de la façon dont smoush et hummingbird peuvent améliorer le site elementor. De plus, nous allons voir quelques exemples de deux thèmes populaires: Hello elementor et Astra. Nous vous donnerons également quelques conseils généraux pour vous assurer que votre site elementor est à jour. Dans cet article, nous allons examiner: comment utiliser Smush pour optimiser elementor comment utiliser Colibri pour optimiser elementor comment utiliser Smush, colibri et elementor pour accélérer elementor conseils généraux pour améliorer des exemples de deux grands thèmes wordpress – Hello elementor et Astra Vous disposerez de tous les outils et du savoir – faire nécessaires pour optimiser le site de l’élément afin d’obtenir les meilleures performances.
Nous allons vous montrer comment nous utilisons smoush et hummingbird pour augmenter la note de page speed du site elementor de 80 à 99 sur 100… Alors continuez à lire. Tout d’abord, supposons que vous ayez un élément (sinon, téléchargez – le gratuitement ici). De plus, si vous n’avez pas téléchargé smoush et hummingbird. Comment utiliser smoush comme élément pour optimiser l’élément, smoush n’est pas non plus étranger à la communauté WordPress. En tant que plug – in d’optimisation d’image 5 étoiles primé gratuit, il a plus d’un million d’utilisateurs actifs à ce jour.
C’est très populaire ici. Travailler avec elementor pour s’assurer que l’optimisation de l’image répond à ses normes les plus élevées et que votre site Web est rapide.
Nous verrons quelques – unes de ses fonctionnalités étonnantes qui fonctionnent bien avec l’élément et n’importe quel sujet que vous utilisez. Il s’agit notamment de lisser toutes les images de l’élément dans la compression automatique en vrac, de télécharger un nouveau super – smoushing dans la double compression en ajoutant une image plus grande en utilisant l’image smoush redimensionnée pour convertir PNG en JPEG smoushing, et de retarder le chargement à partir de la médiathèque en utilisant CDN. Auteur: smoush Selon le site de l’élément que vous avez créé, de nombreuses images peuvent déjà être installées sur votre site.
Heureusement, la fonction smoush de grande capacité peut être complétée en cliquant simplement sur le tableau de bord smoush. Comme vous pouvez le voir, 51 pièces jointes dans cet exemple doivent être nettoyées. Une fois terminé, Smush vous le fera savoir. Tout est brisé! Avec smoush, vous pouvez également exclure certaines images (comme les vignettes). C’est la façon parfaite d’optimiser rapidement les images en utilisant elementor. Consultez ici pour plus de détails sur l’application en gros. Compression automatique de nouveaux téléchargements chaque fois que vous ajoutez de nouvelles images à l’élément, il peut les compresser automatiquement en cliquant sur. Dans le tableau de bord smoush, cette option peut être activée rapidement. Cliquez sur le bouton pour compresser automatiquement la nouvelle image. C’est tout ce qu’il te faut! Toutes les nouvelles images seront compressées. Super smoushing à double compression voulez – vous augmenter la compression de l’image dans l’élément? Le super smoush offre deux fois plus de compression que l’écrasement normal. Il le fait en éliminant chaque once de données inutiles. Au mieux, il s’agit d’une compression de perte de données, de sorte que la dégradation de la qualité est beaucoup moins importante. – Oui.
Dans la plupart des cas, ils sont très petits et invisibles à l’oeil nu. Comme la plupart des fonctionnalités de smoush, il suffit d’un clic administrateur.
Super smoush est prêt pour toutes les images d’éléments. Voyez si vous remarquez des différences dans la qualité de l’image. On parie que non. Lorsque vous utilisez smoush image resizing pour ajouter des images plus grandes avec une hauteur de chargement ou une largeur supérieure à 2560 Px, WordPress Redimensionne automatiquement pour générer une taille maximale d’image optimisée pour le Web. Si vous ajoutez une image plus grande à la médiathèque, vous pouvez l’écraser en utilisant le redimensionnement d’image dans smoush. Il suffit de cliquer sur la souris pour redimensionner l’image. Après avoir cliqué, vous pouvez sélectionner la nouvelle taille maximale de l’image. Saisissez la nouvelle taille souhaitée. Vous pouvez également choisir d’inclure ou non des images grandeur nature dans le lot smoush. Cliquez sur ces options pour brouiller l’image originale de la taille réelle et stocker une copie de la petite image originale. Vous pouvez contrôler la taille réelle de l’image en redimensionnant l’image. La conversion de PNG en JPEG dépend du modèle elementor page Builder que vous utilisez, et vous pourriez trouver préférable d’utiliser l’un ou l’autre de ces types de fichiers. C’est – à – dire qu’en termes de vitesse, l’utilisation habituelle de JPEG plutôt que de PNG devrait être une bonne amélioration.
Smoush vérifie pour vous si leur conversion en JPEG réduit la taille des fichiers et vous aide à accélérer le site de l’élément. Si PNG génère de petits fichiers, PNG est automatiquement converti en JPEG. La conversion automatique de PNG est très simple. Dans la médiathèque smoushing, vous pouvez choisir c
Pro comprend des services d’image de fond, le redimensionnement automatique, la conversion webp et la conversion d’image demandée de l’api rest vers WordPress. Pour plus de détails sur le CDN Smush, voir ici. Comment utiliser hummingbird pour optimiser elementor hummingbird et elementor est une excellente équipe pour rendre votre site plus rapide. Il aide à optimiser les performances du site en perfectionnant les contrôles de compression de fichiers, en minimisant CSS et JS, en chargeant lentement les annotations, et plus encore. Colibri vous aidera à accélérer le site elementor! Il s’agit d’un plug – in gratuit de 4,5 étoiles avec plus de 100 000 installations actives sur WP. Organisation (et augmentation!). En scannant rapidement votre site d’élément, il fournit une réparation en un clic pour vous aider à accélérer facilement votre site. Nous allons voir quelques détails sur ce qu’il peut faire pour améliorer votre site d’élément et le faire fonctionner. Jetons un coup d’oeil: Notez votre site Web avec des tests de performance, Fournissez des pages et du contenu plus rapides avec la compression Gzip mise en cache, réduisez la taille des fichiers pour une publication plus rapide, et augmentez la vitesse de page avec l’optimisation des ressources Dès le début, votre site a été évalué au moyen de tests de performance, et hummingbird vous a demandé d’effectuer des tests de performance pour voir où se trouve le site elementor. Vous pouvez cliquer sur démarrer en cliquant sur exécuter le test. Vous pouvez obtenir un rapport de rendement en un seul clic. Une fois que vous aurez effectué le test, hummingbird vous montrera les chances de réussite, le diagnostic et la vérification. De plus, vous pouvez voir les résultats pour le Bureau et mobile. Il suffit de cliquer entre le Bureau et l’appareil mobile. Tous les détails sont énumérés ci – dessous. Ça commence par une opportunité. Voici des conseils pour accélérer le chargement de la page. Comme vous pouvez le voir, les points sont également indiqués
En compressant les ressources textuelles de votre site dans des fichiers plus petits et plus compacts, vous accédez plus rapidement au navigateur de l’utilisateur et votre page d’élément se charge plus rapidement. Comme vous pouvez le voir, GZIP est activé pour HTML, Javascript et CSS. Si vous n’êtes pas notre hôte, vous pouvez modifier la compression Gzip pour l’adapter à votre type de serveur (par exemple Apache) et suivre les instructions pour l’activer. Accélérer la page grâce à l’optimisation des ressources la zone d’optimisation des ressources de Colibri est l’endroit où vous pouvez facilement configurer automatiquement ou manuellement des options avancées lors de l’optimisation du site elementor. Comme vous pouvez le voir, cela signifie que j’ai économisé 9,7% de compression. Vous pouvez utiliser l’optimisation des ressources de deux façons: Automatique: l’option automatique basée sur hummingbird optimise les ressources et réduit le temps de chargement de la page. Manuel: configurez manuellement chaque fichier pour obtenir la configuration exacte requise pour le site de l’élément. Dès que l’optimisation des ressources est activée, hummingbird scanne les ressources du site WordPress pour mettre en évidence celles qui optimisent les performances. L’optimisation des ressources en colibris peut apporter de nombreux changements et ajustements. Assurez – vous de lire notre documentation sur la façon d’optimiser votre site pour une optimisation maximale. Des exemples d’amélioration de deux grands thèmes WordPress avec smoush, hummingbird et elementor – Hello elementor et Astra – maintenant que nous avons vu ce que smoush et hummingbird peuvent faire pour améliorer la performance du site elementor, regardons de plus près des exemples concrets d’utilisation de deux thèmes elementor en streaming: Hello elementor et Astra. Comme indiqué ci – dessus, nous utiliserons la version gratuite de l’élément, donc pas Comme vous pouvez le voir, c’est moyen. Maintenant regardons gtmetrix. Je remarquerai que j’utilise les paramètres par défaut de gtmetrix pour l’emplacement du serveur (Vancouver, Canada) et le navigateur (chrome). Dans tous ces exemples, cela ne change rien. ‘ C’est ça? Bon sang. Continuons à activer smoush et hummingbird et voyons ce qu’on a. Je vais d’abord faire un test de performance avec Colibri et voir ses conseils. Une fois terminé, il indique que nous avons obtenu un score de 56 \/ 100 et offre plusieurs possibilités, comme le préchargement des requêtes critiques, la suppression des ressources de blocage de rendu, la réduction du temps de réponse initial du serveur et la suppression des CSS inutilisés. De plus, son diagnostic montre que nous devons nous assurer que le texte reste visible pendant le chargement des caractères Web. Il indique également qu’il y a eu 15 vérifications dans le passé. Le Colibri nous a donné quelques conseils. Je ferai de mon mieux pour traiter toutes les suggestions. Le menu déroulant de hummingbird indique exactement comment traiter les suggestions. Par exemple, hummingbird vous montre comment supprimer les CSS inutilisés. Comment résoudre est écrit pour vous. J’ai également activé le cache de page hummingbird pour aider à réduire le temps de réponse initial du serveur et à optimiser les ressources et les ressources combinées et compressées. Ensuite, je vais continuer à activer smoush. Smoush a immédiatement indiqué que j’avais 61 images et accessoires à biseauter, ce qui m’a permis d’économiser environ 815,5 KB. Je vais tout salir. Destruction massive en un clic de souris. Après quelques minutes, les résultats sont les suivants: C’est mignon. Comme vous pouvez le voir, des économies totales de 872,5 kb \/ 9,3% ont été réalisées. Passons à la vitesse de la page. Tout d’abord, voici Google page speed Insights: 99 c’est bien dans nos livres. Voici gtmetrix: Pas mal non plus.
Le nombre d’images, l’emplacement, l’hôte et d’autres facteurs dans la vague sont en place. De plus, si vous ne savez pas, il y a une raison pour laquelle les différences de score entre Google et gtmetrix sont si grandes, parce qu’elles sont toutes testées. Pour en savoir plus sur les changements apportés au site de test, consultez cet article sur le site Web de gtmetrix. Voyons maintenant si nous pouvons augmenter le score de Google en activant hummingbird et smoush, et augmenter gtmetrix à a +. Nous commencerons par le colibri. Le score de performance de hummingbird sur ce site est de 80 \/ 100. Comme vous pouvez le voir, il y a eu deux possibilités d’amélioration et 17 vérifications antérieures. Pour l’améliorer, hummingbird recommande de supprimer les ressources de blocage de rendu et de supprimer les CSS inutilisés. Vous pouvez voir les économies potentielles pour chaque proposition. Nous accepterons la suggestion du Colibri de poursuivre l’étude de Smush. Pour Smush, il nous a dit tout de suite qu’il y avait 15 objets à couper en lots, donc nous allons continuer. L’application à grande échelle est plus facile que jamais (et c’est amusant!). Une fois que nous aurons fait beaucoup de salissures, nous lancerons un autre test Google page speed (parce que c’est le pire) pour voir à quoi nous ressemblons. Le dernier test n’est pas terminé. Comme ça n’a pas beaucoup augmenté, essayons d’autres changements. Smoush recommande quelque chose qui peut vous aider à améliorer votre score. Dans ce cas, ils incluent: activer super smoush pour la compression de perte avancée pour s’assurer que la taille de l’image correspond au thème (ASTRA) activer le redimensionnement d’image pleine taille pour redimensionner les grandes images à une taille raisonnable Voici quelques conseils pour smash. Maintenant que j’ai donné le Conseil de smash, regardons encore. Score élevé! Oh, mon Dieu! Comme vous pouvez le voir, il a augmenté un peu. On n’est pas encore 90 – 10.
0 Cependant, grâce à certains changements, comme l’activation du CDN Colibri et de FastCGI, nous devrions être en mesure d’obtenir des notes élevées. Avant cela, regardons comment gtmetrix a marqué. J’ai toujours un bon \
, hébergé et toutes ses fonctionnalités. Comme vous pouvez le voir, avec l’aide du Colibri et du smoush, c’est facile à faire. Chaque site a ses propres changements et ajustements à apporter, mais ce n’est qu’une question d’amélioration continue. Ajoutez un bon hôte et vous serez en mesure d’avoir un excellent site d’élément. La porte de l’élément? Dans l’affirmative, avez – vous déjà essayé de l’optimiser avec smoush et hummingbird? Veuillez nous le dire dans vos commentaires!