Краткое резюме ↪ В этой статье сравниваются WordPress (Gutenberg) и Elementor по 11 показателям, включая простоту использования и функциональные возможности. Редактор блоков стал быстрее и проще в использовании, благодаря таким дополнениям, как Spectra. Elementor отличается расширенным контролем дизайна. Читайте дальше, чтобы решить, какой из них лучше всего соответствует вашим потребностям!
Какой конструктор страниц вам следует использовать с WordPress? При таком количестве вариантов может быть сложно найти подходящий для ваших навыков, вкуса и уровня опыта. Какой из них лучший? Gutenberg? Beaver Builder? Elementor? Brizy? Еще один, о котором вы не слышали?
В этом посте мы сосредоточимся на двух разных конструкторах страниц: Gutenberg и Elementor.
Сначала мы расскажем, что именно представляет собой каждый из них и как он работает. Затем мы проведем подробное сравнение по 11 различным показателям, включая простоту использования, возможности и другие функции.
Наконец, мы поможем вам принять решение и вынесем наш окончательный вердикт.
Давайте сравним Gutenberg и Elementor!
Что такое Гутенберг?
Изначально запущенный в 2018 году, Gutenberg теперь является стандартным редактором блоков для WordPress. Хотя вы по-прежнему можете установить плагин WordPress Classic Editor, все сообщество разработчиков и дизайнеров WordPress привержено новой системе Gutenberg.
Новая система была создана для того, чтобы значительно упростить процесс создания веб-сайта. Вместо написания HTML и CSS-кода вручную, Gutenberg разработан таким образом, чтобы им было очень просто пользоваться даже нетехническим пользователям.
Чтобы создать страницу в Gutenberg, вам просто нужно перетаскивать крошечные элементы, которые называются блоками. Просто перетащите эти блоки в редактор и настройте их по мере необходимости.
Узнайте больше о Gutenberg в нашем подробном руководстве.
Что такое дополнения Gutenberg?
Поскольку Gutenberg теперь является редактором блоков по умолчанию в WordPress, появилось множество новых расширений и надстроек, которые добавляют функциональность. Эти плагины добавляют все, от специальных типов блоков до готовых макетов, и все, что между ними.
Например, Spectra — это плагин, который позволяет добавлять значительное количество новых функциональных возможностей в редактор Gutenberg.
Вы можете добавить множество новых типов блоков, включая прайс-листы, отзывы, списки иконок и многое другое.
Используя дополнения, вы можете создавать сложные веб-сайты, не разбираясь в программировании. Все, что вам нужно сделать, это нажать несколько кнопок!
Что такое Elementor?
Elementor — один из самых популярных плагинов для создания страниц WordPress, доступных с более чем 8 миллионами установок по всему миру. Это позволяет вам настраивать свой сайт с помощью интерфейса перетаскивания, упрощая создание страниц и постов без каких-либо знаний в области программирования.
Как вы можете видеть на скриншоте выше, Elementor используется в отдельном интерфейсе, который отличается от стандартного интерфейса WordPress. Тем не менее, вы по-прежнему получаете к нему доступ непосредственно со своего сайта, поэтому управлять больше нечем, кроме самого плагина Elementor.
Elementor поставляется с большим количеством виджетов, которые позволяют добавлять различные функции на ваш сайт. Если вам этого недостаточно, то есть множество дополнений Elementor для добавления множества виджетов и вариантов оформления.
Возможно, самой сильной особенностью Elementor являются его дизайнерские возможности. Вы можете устанавливать пользовательские позиции, изменять отступы полей и создавать глобальные правила для цветов и настроек типографики.
Вы можете создавать множество видов веб-сайтов с Elementor, включая портфолио, сайты электронной коммерции, целевые страницы, списки мероприятий, блоги и практически все, что только сможете придумать.
Мастер Elementor: бесплатный курс по созданию потрясающих веб-сайтов
Узнайте, как использовать Elementor для создания потрясающих веб-сайтов, на нашем бесплатном курсе. Пошаговые руководства облегчат любому освоение веб-дизайна.
Факир: беспл. Pro По Сравнению
У Elementor доступны как бесплатная, так и платная версии. Бесплатная версия поставляется с более чем 40 базовыми виджетами и более чем 30 шаблонами. Премиальные планы начинаются от 49 долларов в год за один сайт и варьируются до 999 долларов в год по агентскому плану с лимитом в 1000 сайтов.
В премиум-версии есть дополнительные виджеты (более 90), дополнительные шаблоны (более 300), наборы для создания веб-сайтов, премиум-поддержка и другие функции. Все это того стоит, если у вас есть бюджет для вашего проекта.
В целом, если вы создаете бизнес-сайт, вы, вероятно, захотите получить хотя бы базовую премиум-подписку, поскольку бесплатная версия может быть несколько ограничена.
Конструкторы страниц против Редакторы блоков
Elementor и Beaver Builder — это конструкторы страниц, в то время как Gutenberg — это редактор блоков.
Но подождите…в чем разница между конструктором страниц и редактором блоков? На практике не так уж много, особенно для обычного пользователя.
Однако в более мелких деталях есть разница.
Конструкторы страниц стали мощнее, по крайней мере, на данный момент. Они также позволяют вам настраивать дизайн страницы другими способами, в то время как Gutenberg в большей степени зависит от вашей темы WordPress.
Вы можете представить себе конструктор страниц как создание целой страницы, в то время как редактор блоков — это только один из способов добавления чего-либо внутри страницы , которая существует на сайте WordPress с уже существующей темой.
Другими словами, с редактором блоков на ваши страницы по-прежнему влияет общая тематика вашего сайта. С помощью конструктора страниц вы можете изменять шрифты, цвета и другие элементы дизайна на странице, чтобы они были полностью независимы от общей темы сайта.
Если использовать метафору рисования, конструктор страниц позволяет настраивать как рамку для изображения, так и саму картину. В то время как редактор блоков просто позволяет изменять рисунок, но сохраняет рамку (саму тему WordPress) неизменной.
Конструкторы страниц и будущее веб-дизайна
Однако Gutenberg быстро догоняет конкурентов, и вполне вероятно, что в ближайшем будущем в нем появится больше функций для создания страниц.
Это потому, что это будущее WordPress и, как таковое, пользуется поддержкой всего сообщества. Скоро Gutenberg станет единственным способом создания современного сайта на WordPress без использования конструкторов страниц.
Что касается будущего, то, вероятно, можно с уверенностью сказать, что Gutenberg в конечном итоге заменит или превзойдет большинство систем создания страниц. Итак, это разумный шаг — узнать, как работает Gutenberg!
Тем не менее, скорее всего, всегда найдется место для конструкторов страниц. Как и в случае со многими плагинами для WordPress и темами, иногда вам нужна более мощная, настраиваемая система, которая просто слишком сложна для версии по умолчанию.
В подобных сценариях конструктор страниц в сочетании с некоторыми глубокими знаниями и техническим опытом по-прежнему будет эффективным инструментом для создания потрясающих веб-сайтов.
Сравнение Гутенберга и Elementor
Теперь, когда мы знаем, что такое Gutenberg и Elementor, пришло время сравнить их!
Опережайте события с помощью этих лучших сравнений между Gutenberg и Elementor, представленных в удобной для восприятия инфографике.
.
В чем сходство? В чем различия? Что лучше? Кто станет победителем?
В приведенном ниже сравнении мы использовали 11 различных показателей:
- Возможности
- Совместимость с другими темами и плагинами
- Простота использования
- Ключевые особенности
- Ключевые отличия
- Опыт редактирования в реальном времени
- Адаптивные функции
- Расширенные возможности
- Влияние на скорость просмотра страниц
- Цены
- Создание страницы
Давайте углубимся!
Gutenberg vs. Elementor: возможности
Сначала давайте поговорим о возможностях. Что вы можете сделать с этими двумя системами?
Короче говоря, Gutenberg и Elementor обладают схожими возможностями и могут использоваться для создания страниц одних и тех же типов.
Однако Gutenberg более интегрирован с остальной системой WordPress, что означает, что он работает по умолчанию с каждым плагином и темой.
Вы можете легко создавать страницы и публикации с помощью редактора блоков, и это органично сочетается с остальной экосистемой WordPress и пользовательским интерфейсом.
Elementor — это скорее отдельная сущность, вроде слоя, расположенного поверх WordPress. Редактор представляет собой отдельное приложение с другим дизайном и задуман как мощный универсальный конструктор страниц, не обязательно являющийся расширением стандартной системы WordPress.
Таким образом, вы можете создавать с его помощью множество сложных макетов, но могут быть некоторые ограничения при интеграции с другими частями сайта и другими плагинами.
Gutenberg vs. Elementor: совместимость с другими плагинами
Поскольку Gutenberg — это версия WordPress по умолчанию, она совместима практически со всеми плагинами и темами для WordPress. Те, которые не совместимы с Gutenberg, в любом случае почти всегда устарели, и вам определенно не следует использовать старые плагины, если вы не обладаете достаточными техническими возможностями, чтобы убедиться в их безопасности.
Elementor немного отличается. Elementor менее совместим с другими темами и плагинами просто потому, что это совсем другая система. Есть несколько плагинов, которые несовместимы с Elementor, однако список не слишком длинный.
Тем не менее, большинство плагинов будут работать просто отлично. Для тех, которые несовместимы с Elementor, часто есть встроенная функция, которая может выполнить ту же задачу.
Gutenberg vs. Elementor: простота использования
В конечном счете, простота использования зависит от личных предпочтений. Однако, когда дело доходит до удобства использования, у Gutenberg и Elementor определенно есть некоторые преимущества и недостатки.
С Gutenberg все интегрировано непосредственно в WordPress. Пользовательский интерфейс — это просто расширение остальной части вашей панели администратора WordPress. Сам дизайн также является расширением темы, установленной вами на вашем сайте.
Лучше всего то, что вся экосистема тем и плагинов WordPress изначально будет работать с Gutenberg. Это упрощает установку новых тем и плагинов.
Elementor, с другой стороны, имеет совершенно другой интерфейс. Это скорее не расширение WordPress, а невероятно мощное приложение, которое дополняет его.
У этого есть плюсы и минусы. Хотя это означает, что вам нужно будет изучить другой пользовательский интерфейс, чтобы использовать его, этот интерфейс на самом деле довольно хорош и интуитивно понятен в использовании. Он отличается от WordPress, но работает очень хорошо и может использоваться всеми, даже нетехническими пользователями.
В целом, Gutenberg знаком и понятен, в то время как Elementor отличается, но интуитивно понятен.
Gutenberg vs. Elementor: ключевые особенности
Каковы ключевые особенности Gutenberg и Elementor? Давайте рассмотрим каждую из них.
Gutenberg:
- Создавайте современные макеты без особых усилий
- Версия WordPress по умолчанию, особенно в будущем
- Тонны различных шаблонов блоков и готовых шаблонов веб-сайтов
- Отзывчивый и удобный для мобильных устройств
- Кодирование не требуется
- Полностью основан на блоках
- Легко переставляйте блоки
- Используйте десятки блоков, таких как заголовки, абзацы, изображения и многое другое
Elementor:
- Создавайте страницы с помощью интерфейса перетаскивания
- Множество вариантов дизайна
- Кодирование не требуется
- В значительной степени автономный
- Большая библиотека дополнений
- Множество стилей для виджетов, заголовков и других областей
- Добавьте карусели, галереи и другие элементы дизайна
Gutenberg vs. Elementor: ключевые отличия
В чем ключевые различия между Gutenberg и Elementor?
Есть несколько основных:
- Гутенберг интегрирован в WordPress, и это действительно является WordPress. Elementor — это отдельный плагин, который находится поверх обычной системы WordPress.
- Gutenberg хорошо работает с темами и плагинами, в то время как Elementor, по сути, разработан так, чтобы не нуждаться в других темах или плагинах.
- Gutenberg — это в первую очередь редактор блоков, в то время как Elementor — конструктор страниц. Разница в том, что Gutenberg позволяет добавлять и переставлять блоки на вашем веб-сайте, который затем управляется вашей темой. Elementor, с другой стороны, позволяет вам создать совершенно уникальный сайт, который не обязательно привязан к остальной тематике вашего сайта.
- Gutenberg бесплатен и всегда будет бесплатным, поскольку сейчас это стандарт WordPress. У Elementor бесплатная версия, но для доступа к более мощным функциям требуется премиум-аккаунт.
Gutenberg vs. Elementor: опыт редактирования в реальном времени
Чем отличается живой монтаж между Elementor и Gutenberg?
Оба по сути показывают вам, как будет выглядеть страница, однако Gutenberg показывает вещи до применения темы сайта и других элементов. Итак, это больше похоже на предварительный просмотр, чем на реальную прямую редактуру.
Чтобы увидеть, как будут выглядеть блоки Gutenberg, вам нужно просмотреть страницу на вашем реальном сайте. Это так же просто, как нажатие на превью и/или публиковать кнопки, но это еще один дополнительный шаг.
Elementor показывает вам, как именно будет выглядеть ваш сайт в приложении, поскольку конструктор встроен прямо в систему. Вы можете настраивать шрифты, цвета и любые другие элементы дизайна, которые обычно обрабатываются самой темой.
Конечный результат будет отображаться в режиме реального времени на правой панели.
Gutenberg vs. Elementor: адаптивные функции
И Gutenberg, и Elementor оптимизированы для мобильных устройств и безупречно работают на любых устройствах. Они адаптивны по умолчанию, что означает, что вам не нужно ничего делать, чтобы заставить их работать на мобильных устройствах.
Однако некоторые темы WordPress могут не реагировать. Это относительно необычно и в основном встречается только со старыми или менее известными темами.
Если вы используете популярную тему, такую как Astra, каждый шаблон Elementor будет полностью адаптивным!
Gutenberg vs. Elementor: расширенные возможности
Насколько продвинуты функции в Gutenberg и Elementor? Что лучше?
В целом, Elementor, вероятно, немного более продвинутый, просто потому, что он спроектирован как автономный. Есть живой редактор с возможностью перетаскивания, оптимизация рабочего процесса, создание целевой страницы, интеграция с маркетинговыми инструментами и многое другое.
Вы также можете добавлять динамический контент, эффекты движения, пользовательские стили и персонализированный опыт для каждого пользователя.
Gutenberg полагается на остальную экосистему WordPress, такую как темы и плагины. Хотя вы можете получить большинство тех же функций, что и Elementor, вам нужно будет найти отдельный плагин для этой функциональности.
Например, динамический контент включен в Elementor по умолчанию, но с Gutenberg вам захочется установить плагин, подобный If-So Dynamic Content.
Таким образом, в Gutenberg отсутствуют определенные функции, которые можно легко добавить с помощью других плагинов, таких как Spectra. В целом, это не является серьезным недостатком, поскольку позволяет вам выбирать то, что вы хотите использовать,
Однако, если сравнить полную функциональность их обоих и включить дополнительные дополнения, они очень сопоставимы.
Gutenberg vs. Elementor: влияние на скорость просмотра страниц
В целом, Gutenberg быстрее Elementor, и для подтверждения этого было проведено множество тестов. Вероятно, это связано с тем, что Gutenberg проще, эффективнее и имеет меньше дополнительных функций, которые увеличивают размер файла на вашем сайте.
Отчасти это связано с тем, что Gutenberg — это WordPress.
Однако это не значит, что Elementor замедлит работу вашего сайта! Он по-прежнему быстрее большинства других конструкторов страниц, и есть много советов и хитростей, которые вы можете использовать для ускорения работы вашего сайта Elementor.
Чтобы проиллюстрировать это, давайте проведем тест скорости с помощью GTmetrix. Мы будем использовать два шаблона Astra, предназначенных для одного и того же типа сайтов: веб-сайт для приключений на природе. Первый построен с использованием Gutenberg, в то время как второй использует Elementor.
Обратите внимание, что эти шаблоны размещены на высокоскоростных серверах и были должным образом оптимизированы.
Результаты по скорости просмотра страниц Gutenberg
Результаты теста скорости просмотра Elementor
Как вы можете видеть, Gutenberg one немного быстрее: 0,949 секунды против 1,2 секунды. Может показаться, что разница невелика, но когда дело доходит до скорости веб-страницы, важна каждая миллисекунда.
У темы Gutenberg также меньший размер страницы (1,78 МБ против 2,02 МБ) и меньше запросов (24 против 51). Это также влияет на время загрузки сайта.
Медленные сайты получают меньше трафика, хуже отображаются в результатах поиска Google и имеют более высокий показатель отказов. Это особенно верно, если на вашем сайте много разных изображений и страниц, что может привести к серьезной потере времени.
Gutenberg vs. Elementor: цены
Gutenberg полностью бесплатен, что означает, что он выигрывает этот раунд почти сразу. Однако следует учитывать некоторые другие факторы.
А именно, поддержка. Хотя Gutenberg бесплатен и встроен прямо в WordPress, это означает, что вам придется полагаться на бесплатные каналы поддержки и / или на вашего хостера в случае возникновения проблемы. Это не похоже на платные версии Elementor, которые поставляются с премиум-поддержкой.
Итак, хотя Gutenberg в основном бесплатен, вам, возможно, придется заплатить за дополнительную поддержку, а это означает, что часто он может стоить ту же сумму денег, что и Elementor.
Gutenberg vs. Elementor: создание страницы
Наконец, давайте поговорим о создании страницы с помощью Gutenberg и Elementor. Оба имеют схожую структуру и используются методом перетаскивания.
Как создать страницу с помощью Gutenberg
Чтобы создать страницу с WordPress Gutenberg, вам просто нужно щелкнуть черный знак плюс в редакторе страницы, а затем выбрать нужный блок.
Чтобы добавить содержимое в блок, наведите курсор на блок и щелкните по нему. Затем начните печатать! Это очень просто. Вы также можете настроить блок, используя панель параметров в правой части экрана. Это будет меняться в зависимости от выбранного вами в данный момент блока и его типа.
Чтобы переместить блок, просто щелкните три точки рядом с ним, затем нажмите Переместить в.
Вот и все для создания страниц с помощью Gutenberg! Все сводится к выполнению этих небольших шагов: добавлению блоков, их настройке и размещению на странице.
Как создать страницу с помощью Elementor
У Elementor более сложный макет, который внешне сильно отличается от стандартной настройки WordPress. Но научиться использовать Elementor на самом деле проще, чем кажется.
Чтобы добавить элемент, вам нужно перетащить его с панели слева в пространство справа:
После того, как вы перетащили элемент, вы можете перемещать его с помощью перетаскивания. Просто!
Вы также можете нажать на крошечный знак плюс, который появляется в самом окне, и выбрать элемент таким образом.
Чтобы отредактировать содержимое, просто наведите курсор на элемент и щелкните по нему. С левой стороны вы увидите панель с различными вариантами оформления. В зависимости от блока вы также можете редактировать содержимое прямо на панели.
Например, на изображении ниже мы можем отредактировать Добавьте сюда текст заголовка текст на боковой панели или в предварительном просмотре.
По сравнению с Gutenberg, Elementor имеет больше возможностей дизайна и настройки в редакторе.
Это потому, что Elementor разработан как автономный, в то время как Gutenberg более интегрирован с WordPress. Таким образом, большинство вариантов дизайна для Gutenberg будут доступны в программе настройки WordPress, а не в конструкторе страниц.
Наконец, чтобы переместить блок, просто щелкните и перетащите значок в центре синего маркера блока с 6 точками.
Если вы будете удерживать его нажатой, вы сможете перетащить его. Voilà!
создание страниц в Elementor довольно простое, и вы можете редактировать и настраивать все прямо в редакторе. Вам не нужно предварительно просматривать страницу, чтобы увидеть, как она будет выглядеть.
Окончательное решение
Кто окончательный победитель? Как и в большинстве случаев в жизни, это зависит от вашей ситуации…
Гутенберг лучше всего подходит для…
По нашему мнению, Gutenberg — лучший универсальный выбор для большинства веб-сайтов. Это опция WordPress по умолчанию, означающая, что она пользуется полной поддержкой основных разработчиков WordPress.
Кроме того, он очень прост в использовании и не требует особого обучения.
Хотя у Gutenberg не так много вариантов оформления, как у Elementor, их более чем достаточно для всех, кроме самых продвинутых пользователей.
А с такими дополнениями, как Spectra, добавляются все более мощные функции.
Elementor Лучше всего подходит для…
Elementor — отличный выбор для веб-сайтов, где вам нужно создавать сложные страницы, отличающиеся друг от друга. Или, если вы создаете сайт, который не является стандартным блогом / сайтом новостей / сайтом со стандартной страницей.
Elementor дает вам больше контроля над конкретным макетом каждой страницы. Это потому, что Elementor позволяет вам полностью контролировать дизайн любой конкретной страницы. Итак, если вам нужно это для конкретной страницы или поста, Elementor, безусловно, отличный выбор.
Хотя Elementor сложнее, чем Gutenberg, и менее привязан к системе WordPress, это все равно невероятный конструктор, который дает вам массу гибкости.
Gutenberg vs. Elementor – Вердикт
В большинстве ситуаций вы, вероятно, захотите придерживаться Gutenberg. Это опция WordPress по умолчанию, и со временем она будет продолжать расширяться. А с такими дополнениями, как Spectra, список функций продолжает расти.
Однако, если вам нужен более сложный сайт, требующий тонкой настройки макета страницы и функциональности, вы можете обратить внимание на Elementor.
Это мощный инструмент с множеством дополнительных функций, которые могут пригодиться. И хотя пользовательский интерфейс отличается и может занять некоторое время, чтобы привыкнуть, он довольно эффективен, как только вы в нем разберетесь.
Ресурсы по теме:
Что вы предпочитаете, Elementor или Gutenberg? Поделитесь своим опытом в комментариях!
Добавить комментарий