Elementor 3.16 – Vitesse améliorée, conception polyvalente et accessibilité accrue

Dans sa dernière version, Elementor 3.16 a introduit plusieurs améliorations notables pour les développeurs Web et les propriétaires de sites. Par défaut, les conteneurs Flexbox sont désormais activés sur tous les nouveaux sites Web, améliorant considérablement les performances et la flexibilité de conception. Cette mise à jour introduit également un contrôle amélioré «Écart entre les éléments», offrant aux utilisateurs encore plus de flexibilité lorsqu'ils travaillent avec des conteneurs Flexbox.

L'une des principales améliorations de cette version est la distinction claire entre les widgets Flexbox et Grid Container dans le panneau Widget. Cette différenciation se traduit par des widgets distincts pour chaque type de conteneur, rationalisant le processus de conception et améliorant l'expérience utilisateur globale.

De plus, les visiteurs du site bénéficieront de temps de chargement sensiblement plus rapides, grâce aux optimisations apportées aux métriques Time to First Byte (TTFB). Cette mise à jour met également fortement l'accent sur l'accessibilité, garantissant une expérience plus inclusive aux utilisateurs qui s'appuient sur des lecteurs d'écran et d'autres technologies d'assistance.

Notamment, les widgets de menu et d'onglets ont fait l'objet de mises à jour d'infrastructure essentielles, ouvrant la voie à la mise en œuvre de fonctionnalités avancées dans les versions futures. Ces améliorations font collectivement d’Elementor 3.16 une mise à niveau précieuse pour les sites Web nouveaux et existants.

Libérer une liberté de conception maximale: activer les conteneurs Flexbox pour les nouveaux sites Web

Les conteneurs Flexbox portent bien leur nom en offrant un degré de flexibilité remarquable. Ils donnent aux concepteurs le pouvoir de créer des sites Web non seulement parfaits au pixel près, mais également très performants et réactifs. Grâce à leurs options de positionnement précises, les conteneurs Flexbox simplifient la tâche d'organisation et de distribution des éléments dans un conteneur, facilitant ainsi la création de mises en page flexibles. Prenez, par exemple, la possibilité de placer les widgets de l'éditeur de titre, d'image et de texte dans un seul conteneur. Ce qui est encore plus impressionnant, c'est la possibilité de définir des directions de flexion distinctes pour différentes tailles d'écran, permettant ainsi de réorganiser les éléments de manière transparente en fonction de l'appareil.

De plus, les conteneurs Flexbox sont équipés de la prise en charge des widgets imbriqués, permettant le placement de widgets dans les zones de contenu du carrousel, du menu, des onglets et des widgets accordéon. Envisagez la possibilité d'utiliser le widget Accordéon pour créer des mises en page complexes, comportant un formulaire de contact dans un élément et un widget Google Maps dans un autre.

Un développement important à cet égard est qu'à partir de cette version, les conteneurs Flexbox seront automatiquement activés pour tous les nouveaux sites Web. Ce changement n'aura pas d'impact sur les sites existants construits à l'aide de sections et de colonnes, qui pourront continuer à être utilisées. Cependant, il est fortement recommandé d’adopter les conteneurs pour profiter pleinement des nouvelles capacités de conception. Si vous vous lancez dans la création d'un nouveau site Web et avez l'intention de vous en tenir aux sections et aux colonnes, vous avez la possibilité de désactiver la fonctionnalité Flexbox Container, bien que cela signifie renoncer à l'accès aux fonctionnalités et aux widgets dotés de capacités imbriquées.

L'activation de Flexbox Containers débloque également l'accès aux kits et modèles basés sur des conteneurs, englobant des kits populaires basés sur des sections qui ont été adaptés aux conteneurs, ainsi que de toutes nouvelles options de conception. À l’inverse, si vous préférez conserver des kits et des modèles basés sur des sections, désactivez simplement la fonctionnalité Flexbox Container.

Contrôle des écarts amélioré

Dans la dernière mise à jour, les développeurs ont rationalisé l'interface utilisateur en simplifiant la terminologie. Le contrôle anciennement connu sous le nom de «Écart entre les éléments» est désormais simplement appelé «Écart». Ce changement permet aux utilisateurs de mieux comprendre son objectif. De plus, il y a une amélioration notable dans la façon dont vous ajustez l'écart entre les éléments au sein des conteneurs.

Auparavant, un seul contrôle de plage faisait l'affaire, mais vous trouverez désormais deux entrées numériques distinctes: une pour les espaces horizontaux et une autre pour les espaces verticaux. Ce changement ouvre un monde de précision, car vous pouvez affiner le positionnement de chaque élément avec la plus grande précision. Fini le temps des écarts uniformes; vous avez désormais la possibilité de définir différentes valeurs pour les espaces horizontaux et verticaux, adaptant ainsi votre conception à la perfection.

Une autre fonctionnalité intéressante est la possibilité de personnaliser les unités dans lesquelles vous définissez ces écarts. Que vous préfériez les pixels, les pourcentages, EM, REM ou VW, vous avez le pouvoir de définir vos écarts en fonction de vos exigences de conception. Il s'agit de vous donner la liberté de création et le contrôle dont vous avez besoin pour que vos projets se démarquent.

Widget de conteneur de grille

Dans le domaine de la conception Web et de la gestion de la mise en page, les conteneurs de grille apparaissent comme un outil formidable, offrant les moyens de créer des arrangements multi-éléments complexes dans une enceinte singulière semblable à une grille. La dernière itération introduit une amélioration qui confère aux conteneurs Grid leur propre présence dans le panneau Widgets. Cette nouvelle intégration offre aux utilisateurs la commodité d'un accès direct aux conteneurs Grid, évitant ainsi le besoin de recourir au processus plus compliqué consistant à faire glisser un conteneur Flexbox et à modifier ensuite son type.

Le flux de travail a été rationalisé pour la commodité de l'utilisateur. Lorsqu'un utilisateur insère un conteneur Flexbox dans l'éditeur, le système l'instancie de manière transparente en tant que tel, tandis que l'introduction d'un conteneur Grid se traduit par la manifestation immédiate de la disposition en grille. Il est cependant crucial de noter que cette flexibilité va au-delà de la simple sélection initiale. Les utilisateurs conservent la possibilité de convertir l'un ou l'autre type de conteneur en alternative via le menu déroulant Mise en page du conteneur dans la section Mise en page. Une telle adaptabilité garantit aux concepteurs la liberté créative d’adapter leurs mises en page précisément à leurs spécifications.

Accélération plus rapide avec TTFB

La dernière mise à jour du populaire constructeur de pages WordPress, Elementor, promet des améliorations substantielles des temps de chargement des sites. La version 3.16, publiée le jeudi 21 septembre 2023, améliore le délai jusqu'au premier octet (TTFB) de 5 à 20 % pour les sites utilisant l'Elementor Core gratuit et jusqu'à 40 % pour les sites utilisant Elementor Pro selon la complexité de la page. . Cette mise à jour offrira une expérience plus rapide et plus fluide aux visiteurs du site en fournissant du contenu plus rapidement que jamais.

L'amélioration considérable des performances du frontend a été obtenue en modifiant les conditions d'affichage dans l'éditeur Elementor. Ces modifications dans la façon dont Elementor restitue le contenu dans l'interface de l'éditeur conduisent au TTFB amélioré, qui est une mesure clé pour mesurer la rapidité avec laquelle un site envoie le premier octet de données aux utilisateurs. En rationalisant son éditeur, Elementor permet aux sites de fournir du contenu plus rapidement tout en fournissant toutes les riches fonctionnalités de conception qui ont rendu le constructeur si populaire.

Accessibilité améliorée

La dernière version du populaire constructeur de pages WordPress Elementor contient plusieurs améliorations notables en matière d'accessibilité et d'inclusivité des sites Web. Selon l'annonce du jeudi 21 septembre 2023, la version 3.16 permet aux visiteurs qui utilisent des lecteurs d'écran et d'autres technologies d'assistance d'accéder plus facilement au contenu du site.

Par exemple, des améliorations ont été apportées aux widgets tels que Icon Box et Image Box qui contiennent plusieurs éléments et liens. Désormais, lorsqu'un lecteur d'écran analyse ces widgets, il lit chaque lien unique une seule fois plutôt que de répéter les mêmes liens de manière redondante. Cette mise à jour évite aux utilisateurs de lecteurs d'écran de perdre du temps avec des informations en double.

Le widget de publications a également reçu une mise à niveau pour l'accessibilité. Les lecteurs d'écran se concentreront désormais uniquement sur les titres des articles dans ce widget, ignorant tout contenu supplémentaire inutile comme les CTA « En savoir plus » et le texte alternatif des images en vedette. Rationaliser l'expérience de lecture de cette manière améliore l'accessibilité du site pour les visiteurs malvoyants qui parcourent les publications avec une technologie d'assistance.

Dans l’ensemble, ces améliorations réfléchies d’Elementor permettent aux créateurs de créer des sites Web plus inclusifs et plus agréables pour tous les utilisateurs, quelles que soient leurs capacités. Les améliorations contribuent à garantir que le contenu du site est diffusé de manière efficace et efficiente aux visiteurs qui s'appuient sur des lecteurs d'écran et d'autres technologies d'assistance.

Widgets de menu et d'onglets mis à jour

La dernière version d'Elementor inclut des améliorations sous le capot de l'infrastructure qui alimente les widgets Menu et Onglets. Selon l'annonce du jeudi 21 septembre 2023, la version 3.16 met à jour ces widgets pour générer un code unifié pour les titres des éléments de menu et des onglets sur toutes les tailles d'écran.

Cette mise à niveau élimine le code en double qui pouvait survenir lors de l'application de paramètres réactifs à ces widgets dans les versions précédentes. La consolidation de la base de code backend ouvre également la voie à la mise en œuvre ultérieure de fonctionnalités avancées pour ces widgets.

En plus des améliorations de codage, les widgets Menu et Onglets sont désormais globalement plus accessibles. Cependant, l'unification du code des titres pourrait potentiellement briser les conceptions de widgets existantes si du CSS personnalisé a été appliqué aux titres dans le passé.

Les améliorations apportées à ces widgets couramment utilisés démontrent l'engagement d'Elementor à maintenir à jour ses principaux widgets. Bien que les changements puissent obliger les développeurs à revérifier le CSS personnalisé, ils jettent les bases d'un meilleur comportement réactif et d'une meilleure accessibilité à l'avenir. Pour la plupart des utilisateurs, les mises à jour doivent être transparentes et offrir une meilleure expérience sur toutes les tailles d'écran.

Emballer

Dans l’ensemble, cette dernière version représente un progrès significatif dans la création de sites Web plus rapides, plus réactifs et accessibles. Alors qu'Elementor continue d'affiner ses fonctionnalités de base, les développeurs devraient envisager une mise à niveau pour libérer le potentiel des conteneurs, améliorer les performances et améliorer l'accessibilité. L'exploration de ces ajouts de pointe au populaire constructeur de pages peut aider les sites à rester à la pointe de la conception tout en offrant d'excellentes expériences à tous les visiteurs.