Полностью переработанный дизайн Divi 5 обеспечивает непревзойденную скорость, производительность и простоту использования. Благодаря упрощенному Visual Builder и полностью переработанному бэкэнду создание веб-сайтов с Divi 5 стало быстрее и проще, чем когда-либо. Divi 5 позволит вам, независимо от уровня опыта, разрабатывать отличные сайты в рекордные сроки, не жертвуя временем или креативностью.
Приходите и ознакомьтесь с новым пользовательским интерфейсом Divi 5 в течение этого периода публичной альфа-версии. Помните, что эта итерация все еще находится в стадии активной разработки. Хотя вы можете найти определенные недостатки, приведенные ниже советы позволят вам максимизировать свою производительность при тестировании и разработке с Divi 5.
10 лучших способов создать более быстрый веб-сайт с Divi 5
С момента выхода публичной альфа-версии Divi 5 было внесено множество изменений и улучшений.
1. Используйте редактирование одним щелчком мыши
В Divi 4 для изменения разделов, строк и модулей необходимо нажать на значок настроек. С Divi 5 редактирование одним щелчком устранило все это. Модуль можно редактировать, щелкнув в любом месте, что ускоряет и уменьшает разочарование от процесса проектирования.
Создавайте потрясающие сайты
С лучшим бесплатным конструктором страниц Elementor
Начать сейчасНапример, чтобы изменить текстовый модуль, достаточно одного щелчка в любом месте модуля, чтобы мгновенно получить доступ к его настройкам.
2. Чтобы выполнить быстрые действия, щелкните правой кнопкой мыши.
Контекстное меню правой кнопки мыши в Divi 5 дает вам ценный новый ярлык для вашего процесса проектирования. Любой модуль, раздел или строку можно щелкнуть правой кнопкой мыши, чтобы создать меню быстрых действий с несколькими часто используемыми действиями. Этот инструмент позволяет вам быстро выполнять операции, не открывая несколько панелей или не копаясь в опциях, хотите ли вы копировать стили модулей, дублировать настройки или удалять их.
Например, предположим, что вы создали кнопку с уникальным стилем. Используя опцию быстрых действий, вы можете щелкнуть правой кнопкой мыши, скопировать стиль кнопки и применить его ко всем модулям кнопок, для которых вы хотите иметь тот же стиль.
3. Закрепите несколько панелей с вкладками для различных задач
Многопанельная стыковка, которая позволяет открывать и управлять множеством панелей одновременно, — еще одна фантастическая новая функция Divi 5. В более ранних версиях можно было просматривать множество панелей (например, слои + настройки модулей), но их можно было только перемещать по холсту, не загораживая обзор. Чтобы холст не был загроможден, в Divi 5 можно использовать вкладки панелей.
Когда вы можете документировать несколько панелей рядом, легко изменять несколько аспектов вашего дизайна одновременно. Интерфейс Divi 5 позволяет вам размещать панели на холсте по вашему желанию, создавая идеальное рабочее пространство для ваших требований. Предположим, например, что вы бы предпочли, чтобы каждая панель находилась на левой стороне холста. Чтобы создать рабочее пространство, которое вам подходит, вы можете отсоединить и сместить панели влево, а затем вставить другие панели.
4. Используйте масштабирование холста в своих интересах в адаптивном дизайне
Divi 5 предлагает совершенно новый подход к созданию адаптивных веб-страниц. Благодаря масштабированию холста вы можете быстро масштабировать свое рабочее пространство и видеть, как ваш сайт будет выглядеть на разных экранах, не выходя из Visual Builder. Вы также можете быстро изменять размер холста дизайна, что позволяет вам изменять макет, отступы и поля.
Рассмотрим следующий сценарий: вы работаете над макетом для мобильных устройств и хотите изменить расстояние между частями. Чтобы настроить масштаб холста, щелкните и перетащите край холста до нужного размера. Оттуда вы можете быстро настроить поля и отступы, чтобы ваш дизайн был четким на маленьких дисплеях.
5. Немедленное применение эффектов наведения и закрепления
Добавление эффектов наведения и прилипания к вашим проектам теперь проще, чем когда-либо с Divi 5. В более ранних версиях Divi пользователям приходилось переходить на вкладку дизайна модуля и вводить настройки. Тем не менее, Divi 5 позволяет применять эти эффекты прямо из меню настроек. Благодаря этому инновационному методу создание динамичных, захватывающих дизайнов без вмешательства в ваш рабочий процесс теперь проще, чем когда-либо.
Divi 5 позволяет легко и быстро применять эффекты наведения к кнопкам и поддерживать заголовок в верхней части экрана, пока пользователи перемещаются. Например, предположим, что вы хотите добавить другой цвет при наведении при создании призыва к действию. Чтобы применить изменения за считанные секунды, выберите состояние наведения из раскрывающегося меню в настройках.
6. Для более эффективной навигации используйте «хлебные крошки»
Новая функция навигации в Divi 5 упрощает и ускоряет доступ пользователей к модулям и настройкам. Благодаря навигации вы можете перемещаться между макетами, не теряясь. Они служат визуальным руководством, указывающим ваше точное местоположение в настройках.
При работе в разделе вам не придется возвращаться через меню или терять свое место. Для ускорения процесса проектирования каждая навигационная цепочка предлагает кликабельную ссылку, которая позволяет быстро вернуться к предыдущей настройке.
7. Копируйте и вставляйте стили между модулями для экономии времени
Divi 5 упрощает копирование и вставку стилей модулей между различными частями. Это экономит время и обеспечивает единообразие на вашем сайте, позволяя вам быстро применять одни и те же настройки дизайна для различных модулей. Divi 5 упрощает стили из любого модуля, строки или раздела, а затем использует их во всем вашем дизайне.
Например, предположим, что вы хотите, чтобы все кнопки на веб-странице имели одинаковый дизайн. Вы можете применить стиль, щелкнув правой кнопкой мыши, чтобы открыть меню быстрых действий, скопировав стиль, а затем щелкнув правой кнопкой мыши, чтобы вставить его на каждую кнопку на странице.
8. При создании сложных макетов используйте каркасный вид.
Каркасный вид в Divi 5 устраняет визуальные компоненты дизайна страницы, открывая четкий, простой план макета. В этом виде вы можете полностью сосредоточиться на структуре, свободной от визуальных отвлекающих факторов, таких как цвета и шрифты. Это полезно для сложных макетов, когда вам нужно быстро вносить структурные изменения.
С этой упрощенной версией вы можете сосредоточиться на организации секций, рядов и модулей. Каркасный вид позволяет вам управлять структурой сложного проекта, не беспокоясь об эстетике.
9. Используйте длинный контент в представлении слоев
Вид слоев разграничивает разделы, строки и модули вашей страницы. Это упрощает быстрый просмотр всей структуры макета. Вы можете легко найти определенную часть или модуль на панели слоев, а не перемещаться по визуальному конструктору.
Любой элемент в макете можно выбрать и отредактировать немедленно в представлении слоев без необходимости щелкать по нему в конструкторе. Это особенно полезно для элементов, которые глубоко вложены в другие модули или скрыты, например, строки внутри нескольких слоев секций.
10. Будьте открыты для изучения нового.
Divi 5 предлагает совершенно другой подход к использованию Visual Builder. Все эти существенные обновления связаны с кривой обучения. Сначала нормально чувствовать себя немного подавленным, особенно если вы привыкли к более ранним версиям Divi. Хорошей новостью является то, что каждое изменение, которое мы внесли в Builder, просто в использовании, поэтому знакомство с пользовательским интерфейсом поможет вам создавать веб-сайты с Divi быстрее и эффективнее.
Подведение итогов
Интерфейс Divi 5 разработан для повышения производительности, но пользователям следует поэкспериментировать с ним, закрепляя несколько панелей, используя сочетания клавиш правой кнопки мыши и пересматривая существующие дизайны.
Divi 5 Migrator может помочь в тонкой настройке дизайна. Он начинается с простых функций, таких как масштабирование холста и инструменты эффектов наведения и прилипания. По мере того, как вы будете чувствовать себя более комфортно с Divi 5, вы естественным образом будете включать больше функций в свой процесс дизайна. Экспериментируйте с различными настройками, играйтесь с новым интерфейсом и совершенствуйте методы, чтобы сделать свой рабочий процесс более плавным и эффективным.
