WordPress是建立网站的最受欢迎的程序（特别是对于小型企业）。它易于使用，因此无论是初学者还是经验丰富的编码人员都可以将其推向世界。

W3Techs的最新调查显示，使用CMS的网站中有61.6％使用WordPress，占全球所有网站中的34.7％。相比之下，第二受欢迎的CMS Joomla仅占有3％的市场份额。

为客户或您自己构建网站时，便捷的工具之一就是页面构建器。您可以将它们视为可在其上构建网站布局的框架，同时，即使对于非技术用户，也可以轻松地更新和编辑内容。

在本文中，我们将介绍三种最受欢迎​​的WordPress页面构建器：Elementor，WP Bakery页面构建器和Beaver构建器。在考虑使用其中的哪一种时，最重要的是考虑网站所需的条件。

厦门网站建设

选择页面构建器时应考虑的事项

在当今瞬息万变且充满挑战的环境中，对于任何一家公司网站，都必须考虑适合其目标受众和业务战略的许多方面SEO优化，速度，用户友好性和移动友好性。

从初学者的角度来看，为了满足上述某些要求和易于使用，我们将通过以下关键条件测试每个WordPress可视页面生成器：

创建页面构建器比较框架

在比较官方页面生成器网站上的功能时，它通常看起来和听起来不错，但是很难找到有关页面生成器本身的合理信息。比较多个页面构建器将有助于查看初始销售信息并查看页面构建器的条件。

为了比较一组预定标准中的三个最大竞争对手，我们决定在同一设计的基础上开发单个页面网站来检查结果。

为此，我们从Themeforest中选择了一个高级模板StartFlow，并将主页用作我们的单个页面网站示例。

由于所选设计包含许多动态和动画元素，例如轮播，数字计数器和新闻订阅，因此我们发现它是页面构建器比较的理想选择。

在没有进一步说明的情况下，让我们看看WPBakery页面构建器，Beaver构建器和Elementor页面构建器的性能如何。

WPBakery页面构建器

WPBakery页面构建器（WPBakery Page Builder）是WordPress最受欢迎的页面构建器之一，通常包含在WordPress高级主题中。您可能还听说过Visual Composer，这是由同一作者构建的页面构建器插件。

尽管人们通常会错误地认为WPBakery和Visual Composer是同一个插件，但是这两个插件实际上是完全不同的产品，并且在不同的平台上出售。那么WPBakery和Visual Composer到底是什么？

Visual Composer是最初由作者开发并在Envato出售的第一个页面构建器插件。但是，经过几次更新，开发人员注意到他们拥有比页面构建器更强大的工具。为了保留强大的品牌名称，Visual Composer这个名称用于另一种新产品-可以将其从页面构建器扩展为完整的网站构建器。

旧版本的Visual Composer被重命名为WPBakery页面构建器，并且继续在Envato市场上出售，并且继续以原始方式进行开发和更新。

当前的WPBakery页面构建器本身仅限于页面内容区域中的可视编辑器（包括前端编辑和后端编辑），这是许多付费主题使用的插件。除了编辑页面内容之外，Visual Composer编辑器还可以对整个网站页眉，页脚和侧边栏进行前端视觉编辑。后者使用的技术更为先进。如果您想了解更多，可以阅读这篇文章。

在此评论中，我们将检查WPBakery页面构建器。我们将从Visual Composer也使用的默认启动器主题开始，可以从官方Visual Composer 网站免费下载该主题。

易于使用和自定义WPBakery页面构建器

为使初学者更容易，WPBakery在其免费主题中包括80多个预定义页面模板，可用于构建布局。但是，为了进行比较，我们决定使用空白的入门主题来真正测试其核心功能。

WPBakery页面构建器配有后端和前端编辑器，两者都适合初学者。前端编辑器非常直观，并提供了良好的用户体验。我们用它来构建示例网站。

入门主题带有相当简单的页眉和页脚，因此我们需要使用自定义CSS对其进行更新。如果您想要更复杂的标题，则可能会遇到问题。 WPBakery无法选择为标头构建自定义块，并且需要编码方面来构建标头。

类似于页眉，WPBakery页脚也非常简单。如果您想要更复杂的页脚，则可以为加载项支付额外费用，或者可以使用编码来构建它们。

WPBakery页面构建器中常规元素的可用性

WPBakery配备了50多种常见元素。但是，它们缺少网站中经常使用的一些注释元素。在我们的示例中，它是一个轮播。解决问题的方法有很多，您可以使用插件，也可以为构建器开发自定义元素。

WPBakery附带了各种第三方扩展插件，但它们不是免费的。对于本项目，我们使用了用于WPBakery Page Builder的免费插件Ultimate Carousel来创建轮播，但是需要一些自定义CSS才能完成设计。

有一些自定义选项可用于构建自定义元素，而无需编写代码，例如服务。 WPBakery使使用现有元素轻松创建新元素。

但是，当同一列中的元素需要在页面上多次使用时，没有简便的方法可以做到。 WPBakery仅保存该列，而不保存其中的元素。

厦门网站建设

例如，上图显示带有元素的列。尝试复制列时，仅复制空列，并且其中没有元素。

但是，我们发现一个特别有用的好方法是复制该行并将其保存到模板中。此选项可与网站上多次使用的部件配合使用，从而节省了重新创建内容结构的时间，例如图像和文本部件。

WPBakery页面构建器中元素的响应度和最终布局

响应式网站在今天是必需的。正如某些报告所说，在网站的访问中，有58％来自移动设备，因此确保网站的外观和在移动设备上的工作非常重要。

WPBakery在这里做得很好。所有列都可以很好地缩放，但是如果您想进行真正的响应式优化，则需要添加一些自定义CSS。例如，在移动设备上重新排列图像和文本的顺序。使用CSS可以轻松实现这一点，但是，这不是WPBakery页面构建器提供的即插即用功能。

在WPBakery页面构建器中生成的代码的语义

网站是SEO语义正确性的重要方面，我们不应忽略它。在WPBakery页面构建器中，我们真正喜欢的选项之一就是能够影响网站的语义。

由于特定的设计要求，某些区域中语义正确的标题将使用H2标签，但是由于样式指南的定义，特定的标题更适合H3标签。幸运的是，WPBakery支持更改文本各部分的语义。

我们可以轻松地向H2标签添加样式类，使它们看起来像H3标签，通过提供更多可视层次结构来满足最终用户的需求，并通过遵循语义层次结构来满足搜索引擎的要求。

网站速度和WPBakery页面构建器速度

Google PageSpeed Insights通过三种方式定义了网站体验：加载时间少于1000毫秒的速度很快；平均加载时间在1000毫秒到2500毫秒之间；加载时间超过2500毫秒很慢。快速页面约占搜索结果的10％，常规页面约占40％，慢速页面约占50％。因此，您的网站必须至少达到正常速度。

由于WordPress中使用的每个插件都会增加文件数量，从而增加加载时间，因此有必要检查页面构建器如何影响整体网站速度。

根据Pagely的速度测试，认为WPBakery页面构建器比98％的受测试站点更快，这为其赢得了B得分，并且加载速度为401ms。但是，最终的站点速度还取决于设计本身以及开发中使用的优化技术。

我们的测试网站没有执行任何优化，并且加载时间为2.4秒。根据Google PageSpeed的见解，它在一般速度网站范围内。

WPBakery页面构建器文档质量

选择页面构建器时要考虑的一个方面是文档的质量和可用性以及社区的规模。高质量的文档可以帮助您了解构建器的前端工作原理，以及在通过更多技术方法构建自定义元素时可以选择的选项。

页面构建器分布广泛并且具有庞大的社区。如果文档没有涵盖您需要了解的所有内容，则很可能是社区中的某人有相同的问题并找到了答案。

WPBakery似乎并没有在编写标准文档上投入太多精力。但是，有一所视频学院很好地解释了每个元素，因此我们对此表示赞赏。

使用WPBakery 网站建立测试非常简单直观。我们确实需要搜索文档以查看是否有轮播元素，但是很遗憾，我们没有在文档中找到它。

WPBakery与流行插件的兼容性

根据项目的需要，您需要确保选择的页面构建器与您可能需要的其他插件兼容。

例如，如果网站将以多种语言使用，则需要一个可翻译网站的插件，同时保持与页面构建器的兼容性。

此外，如果您打算使用WooCommerce（用于构建电子商务商店的WordPress解决方案）来构建商店，那么在选择页面构建器时，兼容性至关重要。

最后，不要忘记SEO。 SEO每天变得越来越重要，应该成为构建网站时要考虑的主要方面之一。 Yoast是最受欢迎的SEO插件之一，有免费和高级版本。尽管大多数页面构建器都与Yost兼容，但是在选择SEO插件时请记住兼容性。

WPBakery页面构建器具有WPML兼容性，使我们可以随时创建一个多语言站点。

由于我们已经使用商店设计测试了网站上的内页，因此我们需要检查与WooCommerce的兼容性。我们决定只构建一页测试页面。幸运的是，WPBakery页面构建器与该插件兼容，从而使我们可以轻松地建立商店。

当我们发现SEO很重要时，我们要确保页面构建器与SEO最受欢迎的插件之一Yoast兼容。与WPML和WooCommerce相似，WPBakery与Yoast完全兼容。设置简单，没有冲突。

WPBakery完整版的价格

WPBakery目前在Envato市场上售价为64美元。许可包括安装，我们认为这已足够。您可以选择以$ 2 2.13的价格额外购买6个月的支持，但此测试不是必需的。

WPBakery页面构建器摘要

WPBakery是一个很好的页面生成器，尤其对于初学者而言，因此安装数量超过430万也就不足为奇了。

在测试网站的开发过程中，我们对构建器的速度，用户体验以及围绕该构建器的自定义选项感到非常满意。

即使不是您需要的所有元素都可用，也可以始终使用自定义代码来构建自定义元素。如果您不习惯编写自定义代码，则可以寻找其他插件来满足您的需求。

如果您想添加插件，请记住考虑如何将插件添加到页面加载，插件的安全性以及更新频率。确保您还了解插件在前端和后端的行为。

为了完成总体设计，我们必须使用自定义CSS，共100行代码。变化主要是大小和颜色变化，对于初学者来说，很容易学习。

Beaver Builder（Beaver Builder）

Beaver Builder是另一个流行的高级WordPress拖放页面构建器。它仅使用前端编辑，这对于初学者来说非常有用，但对于喜欢后端编辑的用户却感到沮丧。它的易用性和直观的用户界面使其广受欢迎。

与我们使用WPBakery页面构建器所做的一样，出于本次审查的目的，我们将使用Beaver构建器入门主题并在其上进行测试网站。

Beaver Builder易于使用和自定义

尽管我们喜欢使用后端编辑器，但是Beaver Generator的前端编辑仍然是一个不错的体验。总体界面非常好，逻辑结构合理，前端编辑器功能非常强大，非常适合初学者。

借助拖放，您只需将元素拖到布局上就可以轻松构建页面。

厦门网站建设

类似于WPBakery页面的构造，页眉和页脚的自定义选项受到限制。如果要实现更复杂的页眉和页脚，则必须使用header.php和footer.php文件。或者，如果您对此不满意，则可以安装一个名为Beaver Themer的附加插件。 Beaver Themer提供了更多用于自定义页眉，页脚和侧边栏的选项。

可以使用自定义程序和选项轻松更改网站的常规选项。与WPBakery Page Builder相比，它们的逻辑结构合理且易于查找。

Beaver Builder常规元素的可用性

Beaver Builder包含30多个元素和30多个入门模板。但是，始终需要进行一些自定义。

我们喜欢Beaver Builder的原因是，您可以构建自己的自定义元素或扩展现有元素，然后保存它们并在页面的其他部分或新布局中使用它们。在处理带有文字和图像的服务元素和零件时，此功能非常方便，从而加快了工作速度。

与WPBakery页面构建器类似，Beaver Builder也缺少完成测试设计所需的轮播元素。但是，Beaver Builder附带了一个内容滑块元素，以最小化创建客户见证轮播的自定义设置。

如果您需要更复杂的元素并且不满意从头开始创建它们，我们建议使用Beaver Builder的Ultimate Addons。 Beaver Builder的Ultimate Addons附带许多模块，可简化页面构建。

Beaver Builder中元素的响应度和最终布局

Beaver Builder的作者投入了大量精力来提供自定义选项以提高响应速度。对于手机，平板电脑或台式机屏幕，每个元素，列或行都有自己的响应选项。

列的缩放效果很好，不需要大量重新排序，从而最大程度地减少了使用自定义CSS创建无缝移动体验的需求。

在Beaver Builder中生成的代码的语义

除了能够创建在语义上正确的H1、H2和其他标签之外，我们对Beaver Builder的真正满意之处还在于其Beaver Themer插件以及能够自动整齐地输出页眉和页脚模式标签的功能。

禁用该插件后，我们确定网站的语义最重要，并且代码输出清晰。

网站速度和Beaver Builder速度

根据Pagely的速度测试，Beaver Builder的性能优于测试网站的94％，性能得分为“ A”。但是，它比665ms页面加载时间的WPBakery慢。

在后台，编辑器运行非常快，并提供了良好的用户体验。但是，未优化的网站使用与以前相同的资产，其最终结果不如WPBakery。根据Google Page Insights的估计，我们最终的网站加载时间为2.8秒，使其达到了“缓慢的” 网站体验。

Beaver Builder文档质量

当您选择Beaver Builder时，您的第一印象就是它对首次使用者的指导导览。在几秒钟内，您可以调整选项并简要说明如何使用它。

对于更具体的问题，有详细的文档涵盖了您所需的一切。由于用户界面非常直观，因此我们无需使用文档即可构建测试版图。

除常规文件外，还提供其他课程。有些课程是免费的，高级课程的价格从89美元到199美元不等。尽管拥有免费课程和高级课程固然很棒，但是Beaver Builder的使用非常简单，基本文档将涵盖您的所有问题。

Beaver Builder与流行插件的兼容性

与大多数高级页面构建器一样，Beaver Builder与WooCommerce完全兼容，可用于建立电子商务商店，WPML支持使您的网站使用多种语言，并提供了Yoast支持。

Beaver位于前端，Yost位于后端。您需要将前端的内容复制到后端以利用Yoast并测试网站的内容。

此外，我们对Beaver Builder的满意之处在于其兼容的文档和推荐的插件列表。无论您需要自定义菜单，自定义联系表单还是与构建器完美配合的备份插件，它们都会列出相应的插件。

Beaver Builder完整版价格

与具有独特价格的WPBakery页面构建器不同，Beaver Builder提供三种不同的软件包供您选择。

从99美元起，您将获得Beaver Builder，该软件可安装在无限数量的网站中，这与WPBakery的单一安装许可证不同。不幸的是，在这个级别上，Beaver Builder不提供介绍性主题。

Pro版本的价格为199美元，并提供标准版本中的所有内容，以及入门主题和多站点选项的其他好处。

最昂贵的软件包的价格为399美元，它使您可以使用多站点选项和白色标签，从而可以更改页面构建器中的所有实例名称并替换或修改核心模板。

对于此测试，我们使用Pro版本测试启动器主题并创建类似于WPBakery的一致启动环境。

Beaver Builder概述

关于构建网站的用户体验，Beaver Builder比WPBakery更好。这些选项的组织清晰合理，当您是初次使用时，请花费更少的时间来掌握如何使用构建器。

The

element本身非常强大，可以执行我们所需的几乎所有功能。相反，使用WPBakery时，我们需要100行CSS代码。在Beaver Builder中，我们只使用了8行CSS代码。

我们希望Beaver Builder中的代码干净，语义正确并且代码文件已压缩。

另一方面，当在两个构建器中使用相同的资产来构建网站布局时，我们对最终网站的速度有些不满意。尽管可以使用不同的技术对其进行优化，但是它比使用WPBakery构建的未经优化的网站慢。

与WPBakery相比，Beaver Builder的初始价格似乎很高。但是，如果您认为WPBakery是一次性使用许可证，并且Beaver Builder提供了无数许可站点，则价格合理。

元素或页面构建器

Elementor是具有超过3,000,000安装的页面构建器，并且是当今最受欢迎的WordPress页面构建器之一。它提供免费和高级选项。

它的免费版本包含30多个元素以及我们用来构建测试的拖放功能网站。

Elementor的易用性和定制性

在使用Elementor页面构建器进行设计时，我们在默认的Hello Elementor主题上使用了页面构建器的免费版本。

“ Hello Elementor”是最快的Elementor主题，加载时间不到1秒。但是，尽管如此，该主题还是非常空白，并且没有提供用于构建网站的许多启动选项，这可能对初学者没有用。

与Wpbakery不同，Elementor对于初学者来说更快，更简单。在构建网格时，我们发现的唯一问题是免费版本极为有限。我们无法在免费版本中添加几行CSS。

和以前一样，Elementor可以选择保存部分和元素。 Elementor的好处在于，它允许您直接在前端的文本位置编写文本。这样可以加快输入内容的过程，并节省在前端工作时的时间。

厦门网站建设

我们最喜欢的功能是为开发人员提供的详细文档，您可以在其中找到创建自定义元素或小部件以及文档化的PHP挂钩所需的一切。

但是，当我们从初学者的角度进行此测试时，我们再次发现缺少自定义页眉和页脚的选项，就像以前的页面构建器一样。

我们在Elementor中发现的一件事是不受控制的滚动。当我们位于页面底部时，滚动条会将我们拉到其他部分。经过几分钟的测试，真令人讨厌。拥有前端和后端编辑器都很好，但是滚动问题可能会影响大型项目的有效实施。

Elementor常规元素的可用性

如前所述，Elementor的免费版本中包含30多个基本元素，与我们在本文中检查的前两个页面构建器相比，这是标准的。

类似于先前的发电机，没有圆盘传送带元素对于完成我们的设计至关重要。 Elementor确实有一个很棒的社区，因为有许多专门为Elementor制作的主题和附加组件，使事情变得更容易。

厦门网站建设

Elementor中元素的响应度和最终布局

元素的响应度和最终布局都很好。在使我们的测试网站具有响应能力且可用于移动设备时，我们发现没有重大问题。例如，我们可以分别为移动设备，平板电脑和台式计算机定义文本大小，边距和元素填充。

我们最喜欢的功能之一是图像响应度调整。您可以为每种分辨率定义不同的图像，这很有用。

总体网格缩放确实非常好，我们不需要做太多自定义操作即可确保在移动设备上拥有完美的外观。

在Elementor中生成的代码的语义

与Beaver Builder一样，Elementor可以选择影响网站语义的选项。经过我们的审查，禁用后，生成的代码是100％干净的。

我们对Elementor的真正喜欢是，它以JSON格式将布局保存在与文章和页面关联的单独的Elementor数据字段中，并且还将内容的副本保存在数据库的核心文章content字段中。这使搜索引擎可以查看干净的语义HTML标记。

网站速度和元素速度

构建器本身是快速的，并且从这个角度来看，它提供了良好的用户体验。在页面的前端，根据Pagely的比较分析，它以489ms的加载时间击败了其他页面构建器。

我们自己的比较确认了它在前端和后端的速度。根据Google Page Insights，我们的测试速度网站（使用与以前的生成器相同的资产）以1.6秒的加载时间结束，这使我们走到了“正常” 网站的最前沿。

当然，当构造一个实数网站时，需要实施适当的优化技术。出于这次审查的目的，我们真的对Elementor的速度没有任何优化感到惊讶。

元素或文档质量

Elementor文档可能是迄今为止我们所见过的最好的文档。它包括视频教程，可以为初学者建立知识库，并为开发人员提供详细的文档。

由于界面本身非常直观，因此我们没有找到跳转到我们构建的示例网站所需的基本要求文档。

Elementor与流行插件的兼容性

像Beaver一样，Elementor的兼容插件列表也非常好。它支持Yoast，Adobe字体，Google字体和WooCommerce，这对于我们的测试网站至关重要。

安装后，所有插件均可无缝运行。

元素或完整版价格

与Beaver Builder类似，Elementor带有三个高级软件包和一个免费版本。个人许可证的价格为每年49美元，包含30多个元素和300多个Pro模板。真正使它与众不同的是WooCommerce构建器和弹出窗口构建器。

如果您想开发3 网站，则每年的费用为99美元。它可以安装在100 网站上，每年只需199美元。

Elementor特别集成到市场营销部门中，在其专业版本中，它可以与流行的市场营销工具和表单构建器进行许多集成。

元素或页面构建器摘要

与Beaver Builder和WPBakery页面构建器相比，Elementor提供了迄今为止最快的输出。这是选择页面构建器时的重要因素。

但是，使用Elementor的用户体验不如使用Beaver Builder时令人满意。与Beaver Builder和WPBakery相似，我们需要使用自定义元素来完成我们的设计。

我们真正喜欢的一件事是能够从后端角度进行自定义并为开发人员提供详细的文档。

3个发电机的最终比较

当我们通过简单的一页网站开发比较这三个页面构建器时，我们可以得出结论，它们每个都有其优缺点。那么，您如何确定哪一个最好呢？

我们将结论分为一个简单的比较表。根据我们在这个小项目中的经验，我们将根据先前定义的标准对它们进行排名。

厦门网站建设

“页面构建器”的比较（1-5级，最小值为1，最大值为5）

在比较了这三个构建器之后，我们得出结论，与WPBakery相比，Beaver和Elementor是页面构建器的更好选择。

Beaver Builder在几乎所有方面都表现良好，除了最后网站页的加载时间不是很好。但是，如果您使用一些优化技术来加快速度网站，那么Beaver Builder仍然是一个不错的选择。

在查看语义时，另一个重要方面，Beaver Builder和Elementor比WPBakery更好，因为它们产生100％的干净代码。

Elementor在有关如何进行更多后端自定义的开发人员文档和指南方面表现出色，使其成为有经验的用户的理想选择。

Beaver Builder提供最直观的UI，并且使用它是一种愉快的体验。与Elementor或WPBakery相比，使用Beaver Builder构建测试布局所需的时间更少。

WPBakery是第三种选择，特别是对于初学者。我们的建议是使用Beaver或Elementor。