La refonte complète de Divi 5 offre une vitesse, des performances et une simplicité d'utilisation inégalées. Avec un générateur visuel simplifié et un back-end entièrement repensé, la création de sites Web avec Divi 5 est plus rapide et plus simple que jamais. Divi 5 vous permettra, quel que soit votre niveau d'expérience, de développer de superbes sites en un temps record sans sacrifier votre temps ou votre créativité.
Venez découvrir la nouvelle interface utilisateur de Divi 5 pendant cette période d'alpha publique. N'oubliez pas que cette itération est toujours en cours de développement actif. Bien que vous puissiez trouver certains défauts, les conseils ci-dessous vous permettront de maximiser votre productivité lors de vos tests et de votre développement avec Divi 5.
10 meilleures façons de créer un site Web plus rapide avec Divi 5
Depuis la sortie de Divi 5 Public Alpha, de nombreux ajustements et améliorations ont été implémentés.
1. Utilisez l'édition en un clic
Dans Divi 4, vous devez cliquer sur l'icône des paramètres pour modifier les sections, les lignes et les modules. Avec Divi 5, l'édition en un clic a éliminé tout cela. Le module peut être modifié en cliquant n'importe où dans celui-ci, ce qui accélère et réduit la frustration du processus de conception.
Créer des sites Web incroyables
Avec le meilleur constructeur de page Elementor
Commencer MaintenantPar exemple, pour modifier un module de texte, il suffit d’un simple clic n’importe où dans le module pour accéder instantanément à ses paramètres.
2. Pour effectuer des actions rapides, faites un clic droit
Le menu contextuel accessible par clic droit dans Divi 5 vous offre un nouveau raccourci précieux pour votre processus de conception. Vous pouvez cliquer avec le bouton droit sur n'importe quel module, section ou ligne pour créer un menu d'actions rapides avec quelques activités fréquemment utilisées. Cet outil vous permet d'effectuer rapidement des opérations sans ouvrir plusieurs panneaux ni parcourir les options, que vous souhaitiez copier des styles de module, dupliquer des paramètres ou les supprimer.
Par exemple, supposons que vous ayez créé un bouton avec un style unique. À l'aide de l'option d'actions rapides, vous pouvez cliquer avec le bouton droit de la souris, copier le style du bouton et l'appliquer à tous les modules de bouton sur lesquels vous souhaitez avoir le même style.
3. Ancrez plusieurs panneaux à onglets pour différentes tâches
L'ancrage multi-panneaux, qui vous permet d'ouvrir et de contrôler plusieurs panneaux simultanément, est une autre nouvelle fonctionnalité fantastique de Divi 5. Vous pouviez afficher de nombreux panneaux dans les versions précédentes (calques + paramètres de module, par exemple), mais vous pouviez uniquement les déplacer sur le canevas sans obstruer votre vue. Pour garder le canevas clair, vous pouvez utiliser des onglets pour les panneaux dans Divi 5.
Lorsque vous pouvez documenter plusieurs panneaux côte à côte, il est simple de modifier plusieurs aspects de votre conception à la fois. L'interface de Divi 5 vous permet d'organiser les panneaux sur le canevas comme vous le souhaitez, créant ainsi l'espace de travail idéal pour vos besoins. Supposons, par exemple, que vous préfériez avoir tous les panneaux sur le côté gauche du canevas. Pour créer un espace de travail qui vous convient, vous pouvez détacher et décaler les panneaux vers la gauche, puis cliquer sur les autres panneaux.
4. Utilisez la mise à l'échelle du canevas à votre avantage dans la conception réactive
Divi 5 propose une approche totalement nouvelle de la création de pages Web réactives. Grâce à la mise à l'échelle du canevas, vous pouvez rapidement dimensionner votre espace de travail et voir comment votre site Web apparaîtra sur différents écrans sans jamais quitter le Visual Builder. Vous pouvez également redimensionner rapidement le canevas de conception, ce qui vous permet de modifier la mise en page, le remplissage et les marges.
Considérez le scénario suivant: vous travaillez sur une mise en page mobile et souhaitez modifier la distance entre les parties. Pour ajuster la mise à l'échelle de la zone de travail, cliquez et faites glisser le bord de la zone de travail jusqu'à la taille souhaitée. À partir de là, vous pouvez rapidement ajuster les marges et le remplissage pour garantir que votre conception soit nette sur les petits écrans.
5. Appliquez immédiatement les effets Hover et Sticky
Avec Divi 5, ajouter des effets de survol et de collage à vos créations est désormais plus simple que jamais. Dans les versions précédentes de Divi, les utilisateurs devaient accéder à l'onglet de conception du module et saisir les paramètres. Néanmoins, Divi 5 vous permet d'appliquer ces effets directement depuis le menu des paramètres. Grâce à cette méthode innovante, créer des designs dynamiques et captivants sans interférer avec votre flux de travail est désormais plus simple que jamais.
Divi 5 permet d'appliquer facilement et rapidement des effets de survol aux boutons et de maintenir votre en-tête en haut de l'écran pendant que les utilisateurs naviguent. Par exemple, supposons que vous souhaitiez ajouter une couleur différente au survol lors de la création d'un appel à l'action. Pour appliquer les modifications en quelques secondes, choisissez l'état de survol dans un menu déroulant dans les paramètres.
6. Pour une navigation plus efficace, utilisez le fil d'Ariane
Une nouvelle fonctionnalité de fil d'Ariane dans Divi 5 permet aux utilisateurs d'accéder plus facilement et plus rapidement aux modules et aux paramètres. Grâce aux fils d'Ariane, vous pouvez naviguer entre les mises en page sans vous perdre. Ils servent de guide visuel qui indique votre emplacement exact dans les paramètres.
Lorsque vous travaillez dans une section, vous n'avez pas besoin de revenir en arrière via les menus ou de perdre votre position. Pour accélérer le processus de conception, chaque fil d'Ariane propose un lien cliquable qui vous permet de revenir rapidement à un préréglage précédent.
7. Copiez et collez les styles dans les modules pour gagner du temps
Divi 5 simplifie la copie et le collage de styles de modules entre différentes parties. Cela permet de gagner du temps et de garantir la cohérence sur l'ensemble de votre site en vous permettant d'appliquer rapidement les mêmes paramètres de conception à différents modules. Divi 5 simplifie les styles de n'importe quel module, ligne ou section, puis les utilise dans toute votre conception.
Par exemple, supposons que vous souhaitiez que tous les boutons d'une page Web aient le même design. Vous pouvez appliquer le style en cliquant avec le bouton droit de la souris pour ouvrir le menu Actions rapides, en copiant le style, puis en cliquant avec le bouton droit de la souris pour le coller sur chaque bouton de la page.
8. Lors de la création de mises en page complexes, utilisez la vue filaire
La vue filaire de Divi 5 élimine les composants de conception visuelle d'une page, révélant un plan de mise en page clair et simple. Dans cette vue, vous pouvez vous concentrer entièrement sur la structure, sans distractions visuelles telles que les couleurs et les polices. Elle est utile pour les mises en page complexes lorsque vous devez effectuer des ajustements structurels rapidement.
Avec cette version simplifiée, vous pouvez vous concentrer sur l'agencement des sections, des rangées et des modules. La vue filaire vous permet de gérer la structure d'un projet complexe sans vous soucier de l'esthétique.
9. Utilisez du contenu long dans la vue Calques
La vue Calques délimite les sections, les lignes et les modules de votre page. Cela permet de visualiser plus facilement et rapidement l'ensemble de la structure de votre mise en page. Vous pouvez facilement trouver un élément ou un module particulier dans le panneau Calques plutôt que de naviguer dans le générateur visuel.
Tout élément de la mise en page peut être sélectionné et modifié immédiatement dans la vue Calques sans avoir à cliquer dessus dans le Générateur. Ceci est particulièrement utile pour les éléments imbriqués profondément dans d'autres modules ou cachés, comme les lignes à l'intérieur de plusieurs calques de sections.
10. Soyez ouvert à l’apprentissage de nouvelles choses
Divi 5 propose une approche totalement différente de l'utilisation du Visual Builder. Toutes ces mises à niveau importantes nécessitent une certaine période d'apprentissage. Au début, il est normal de se sentir un peu dépassé, surtout si vous êtes habitué aux versions précédentes de Divi. La bonne nouvelle est que chaque modification que nous avons apportée au Builder est simple à utiliser. Se familiariser avec l'interface utilisateur vous aidera donc à créer des sites Web avec Divi plus rapidement et plus efficacement.
Pour conclure
L'interface de Divi 5 est conçue pour améliorer la productivité, mais les utilisateurs devraient l'expérimenter en ancrant plusieurs panneaux, en utilisant des raccourcis contextuels et en revisitant les conceptions existantes.
Divi 5 Migrator peut vous aider à peaufiner vos conceptions. Il commence par des fonctionnalités simples comme la mise à l'échelle du canevas et les outils d'effets de survol et de collage. À mesure que vous vous familiariserez avec Divi 5, vous intégrerez naturellement davantage de fonctionnalités à votre processus de conception. Expérimentez différents paramètres, jouez avec la nouvelle interface et affinez les techniques pour rendre votre flux de travail plus fluide et plus efficace.
