Elementor 中的网站性能优化 [01] 布局优化最佳实践

[01] 布局优化最佳实践

文章来源  https://wpeyes.com/elementor/academy/

就用户体验而言，网站速度优化是最重要的方面之一。加载缓慢的网站会让任何用户感到沮丧，并且通常会导致高跳出率，这对企业来说从来都不是一件好事。 1

影响网站性能的因素有很多，从图像到服务器配置，从过多的插件到臃肿的主题，这个列表确实不胜枚举。

在 Elementor，我们非常重视性能，在这个由 5 部分组成的课程中，我们将教您如何：

使用最佳技术创建页面和帖子布局，确保我们不会过度使用根本不需要的部分、列和小部件，我们还将探索一些内置小部件功能以缩短加载时间。
然后，我们将教您如何优化图像，包括在将图像上传到您的网站之前以及之后使用图像优化插件。我们将介绍何时何地使用不同图像类型的最佳实践，并探讨未经优化的图像可能对您的网站产生的影响。
接下来，我们将看看您可以应用于网站的其他性能提升。这些将包括一些 Elementor 功能以及教您有关主题和插件的使用。
在第 4 课中，我们将着眼于选择合适的虚拟主机，并向您介绍可用的不同类型的主机以及您应该注意的基于性能的常见方面。
最后我们来看看页面缓存。缓存确实可以提高您网站的性能，我们将探索 WP Rocket 插件，它将使您能够将缓存应用于您的网站。

最后，我们将看看使用第三方工具的进一步优化。我们将探索缓存、缩小以及我们可以应用于我们网站的一些其他调整。

如果您正在寻找特定的内容，请随时跳转到这些视频中的任何一个，并且不要忘记保存它们以供将来参考。

因此，如果您准备好了，让我们开始吧。

在我们的第一课中，我将教您在 Elementor 编辑器中创建页面和帖子的最有效方法。

我们经常看到使用了太多的部分、列、内部部分和小部件，而使用更少的这些元素就可以实现相同的布局。

使用过多的这些元素会导致网站性能下降，因此让我们深入了解如何以最有效的方式使用 Elementor 构建网站。

为了更好地理解 Elementor 中的最佳布局，我们将探索这个模板，它是用一些常见的部分、列和小部件误用构建的。

到本课结束时，我们将使用更少的列和小部件完全重建整个页面。我们的初始页面货币有 9 个部分、31 个列、5 个内部部分和 44 个小部件。
我们的优化页面将包含 6 个部分、7 个列和 16 个小部件。

我们将使用免费的轻量级 Hello Elementor 主题，我们将重新创建模板的每个部分，同时利用最佳实践技术，这将提高网站的性能。

在我们开始优化我们的布局之前，我们将在我们的页面上运行一个测试，以充分了解当有人访问我们的网站时发生了什么。一旦完成所有优化并比较结果，我们将重新测试它。
让我们在使用“不良做法”创建的页面上运行测试并检查结果。

我们将在浏览器的私人窗口中执行测试，这也称为“隐身模式”。

打开一个新的隐身窗口并输入您正在测试的网页的链接。

确保您的链接显示您页面的直接路径。

如果您不确定您的页面链接是什么，您可以通过导航到您的 WP 仪表板轻松找到它。

单击“页面”以查看您网站的所有页面。

将光标悬停在页面上，然后单击“查看”选项。这将带您直接进入您的页面。

将此 URL 复制并粘贴到隐身