如何让您的网站在移动设备上快速加载(2024 年)

与台式机相比,更多人使用移动设备访问互联网。 移动设备上的快速网站可以大大提高 SEO 和转化率。 这是加快移动网站速度的方法

您的网站在移动设备上的性能现在比在台式机上的性能更重要。

这是因为使用移动设备访问互联网的人比使用台式机的人多。

根据 StatCounter的,全球超过 50% 的互联网用户使用移动设备。 而只有略高于 47% 的人使用台式机。

如果您主要针对桌面优化您的网站,那么您正在损害您的业务成功。 手机现在比以往任何时候都更重要。

您的网站在移动设备上的表现对于 SEO。谷歌现在的做法是 移动优先索引. 这意味着谷歌使用网站的移动版本进行索引和排名。

如果您的网站在台式机上速度很快,而在移动设备上速度很慢,那么您的排名就会受到影响。 您的网站在移动设备上的性能应该比其在台式机上的性能更重要。

让您的网站在移动设备上快速加载将改善您的 SEO、降低跳出率并增加转化率。

但是在移动设备上优化网站的速度并不像在桌面上优化网站的速度那么容易。 值得庆幸的是,如果您遵循我在此处列出的提示,本文可以帮助您在移动设备上快速加载您的网站。

测试您网站的速度

您应该做的第一件事是测试您的网站在移动设备上的速度。 这将使您清楚地了解您的网站有多快或多慢。

仅仅因为您的网站在桌面上加载速度很快,并不能保证它在移动设备上加载速度很快。 您的网站可能在桌面上非常快,但在移动设备上却非常慢。

有许多 移动测试工具,但我更喜欢使用 Google 的 测试我的网站 用于移动速度测试。

只需访问 ThinkWithGoogle 并输入您网站的 URL。 您应该能够测试您的网站的速度。

ThinkWithGoogle

对我来说,一个在 3 秒内加载的网站就足够了。 但 Think With Google 建议至少 2.4 秒。

如何让您的网站在移动设备上快速加载

以下是加快移动网站速度的最佳做法:

使用响应式主题

响应式主题是可以调整以适应所有设备的主题。 这意味着即使您的用户来自台式机、移动设备或平板电脑,您的主题也会为他们提供适合他们使用的任何设备的网站版本。

向移动用户提供网站的桌面版本会减慢加载时间。 这对用户体验来说很糟糕。

使用响应式主题非常重要。 它是移动快速网站的第一个基础。 您可以选择几个响应式主题。 阅读我的清单 前 10 个最快和最好的 WordPress 主题,那里列出的任何主题都足够好且响应迅速。

使用快速的网络主机

您的虚拟主机在加快您的网站速度方面起着最重要的作用。 具有最新托管技术的非常快速的网络主机将使您的网站在移动设备上快速加载。

如果您的虚拟主机速度较慢,那么无论您如何优化您的网站,您都可能看不到显着的改进。

我建议 CloudwaysKinsta 对于已建立的网站。 目标趋势 托管在 Cloudways。 对于初学者网站,我建议 BlueHost.

使用 AMP

加速移动页面 (AMP) 是一种 项目 由 Google 开发,用于加速移动设备上的网站速度。

AMP 针对移动浏览进行了优化,可以帮助显着加快网站的加载时间。 它还可以 减少请求数量 根据一项研究,超过 77%。

您可以通过安装 AMP 开始使用 官方 AMP 插件. 还有其他 AMP 插件,您也可以使用它们。

激活插件后,您可以选择三种可用模式中的任何一种。 如果您的大多数访问者来自移动设备,请考虑使用过渡或标准模式。 但您的主题必须与 AMP 兼容。

延迟加载图像

图片会降低网站速度,尤其是在移动设备上。 处理它们的最佳方法是在用户滚动到它时加载它们。 这样,它们只会在需要时加载,因此对加载时间的影响很小或没有影响。

如果您尝试在 PageSpeed 洞察力 or Web开发 并且您被警告“延迟屏幕外图像”,这意味着图像正在减慢您的加载时间,您应该考虑延迟加载它们。

延迟加载图像就是延迟图像的加载,直到用户滚动到它为止。 这可以提高速度。

这里有 许多插件 处理延迟加载。 大多数缓存插件和图像优化插件都有延迟加载选项。

消除渲染阻止资源

消除渲染阻塞资源可以加快您网站在移动设备上的加载时间。

通常有一些 Java 脚本和 CSS 使浏览器难以在用户访问时快速呈现网站。 这是因为浏览器必须先停止并读取这些文件,然后才能将站点呈现给用户。

消除这些资源可以加快加载时间。 有像 Autooptimize 这样的插件可以帮助消除渲染阻塞资源。

我有一篇有用的文章,你应该阅读: 如何消除 WordPress 中的渲染阻塞资源.

删除未使用的 CSS

拥有大量未使用的 CSS 会降低网站速度。 未使用的 CSS 是网站加载不需要的 CSS。 但是因为它们存在,浏览器仍然需要下载、解析和处理它们。

有插件如 Perfmatters资产清理 这可以帮助删除未使用的 CSS。

我为此写了一个简单的指南: 如何删除 WordPress 中未使用的 CSS 和 JS.

生成关键 CSS

关键 CSS 用于轻松提取首屏内容以快速呈现给用户。 拥有关键的 CSS 路径可以加快您的网站在移动设备和桌面设备上的加载时间。

有一些插件可以帮助生成 Criticall CSS。 WP Rocket可以做到这一点, LiteSpeed缓存可湿性粉剂性能 还可以生成关键的 CSS。

拥有良好的缓存系统

缓存是加快网站速度的一种非常可靠的方法。 您应该使用有效的缓存插件为您的移动访问者提供缓存内容。 WP Rocket 是一个非常有效的高级缓存插件。 W3 总缓存,如果配置得当会非常有效。

桥梁 托管网络托管公司 提供服务器级缓存。 了解您的网络托管服务商是否提供相同的服务,如果您的网站不是开箱即用的,请让他们为您的网站激活。

您可以请求您的主机安装和激活 Varnish 缓存。 Varnish 缓存以加快网站速度而闻名。

优化图像

确保压缩图像。 我更喜欢在上传之前完全压缩图像。 但是,有很多插件,例如 优化 以及其他可以帮助压缩 WordPress 中的图像的工具。

提供 WebP 图像也可以帮助提高网站速度。 WebP 比 JPG 和 PNG 小,因此对速度更友好。

有许多插件可以帮助转换和提供 WebP 图像。 优酷和 飞行 图片 可以很好地做到这一点。

缩小代码

缩小是将网站的代码从较大尺寸压缩到较小尺寸的过程。 只要不破坏任何东西,越小越好。

您应该考虑缩小 JS 和 CSS。

大多数缓存插件都提供缩小功能。 但请确保您使用 staging 进行测试,因为已知缩小会破坏网站。

最小重定向

过多的重定向会降低您的网站速度,尤其是在移动设备上。 它可以减慢服务器响应时间。

确保您没有太多重定向。 如果是,请尽可能减少它们。

启用压缩

压缩文件以使您的网站在移动设备上快速运行。 东西越小,您的网站就会越快。

Gzip 或 Brotli 可以通过压缩网站文件显着提高您的网站速度。 一般来说,Brotli 比 Gzip 好。 但是它们中的任何一个都可以正常工作。 请与您的网络主机商核对,以便为您启用压缩。

如果插件解决方案更适合您,还有一些插件可以帮助您启用压缩。

减少每页的 AdSense 数量

Google AdSense 是最受欢迎的广告之一 博客赚钱的方法,但它也会显着降低网站速度。

根据我的观察,如果您停用 AdSense,您会立即注意到加载时间的巨大差异。

但是金钱和速度一样重要。 所以你必须达成妥协。 Google 建议每页 3 个广告单元。 如果你坚持这一点,那么你应该没问题。

我注意到匹配内容单元和页面级广告对移动加载时间的负面影响最大。

使用 CDN

A 内容分发网络 可以通过制作您网站的静态副本并在世界各地的用户尝试访问您的网站时从更靠近他们的位置为他们提供服务来帮助提高网站的速度。

如果您没有使用 CDN,那么您就错过了!

查询 最好的 WordPress CDN 提供商.

使用系统堆栈字体

最近我试图加快这个网站在移动设备上的加载时间。 所以我决定停止使用谷歌字体并尝试了系统堆栈,令我惊讶的是,速度有了显着的提高。

谷歌字体和字体真棒是惊人的,但它们会减慢网站速度。 使用系统堆栈可确保不发出任何外部请求,因为它是用户使用的任何设备的所需字体。

一些主题可以轻松更改为系统堆栈。 只需切换到系统堆栈。

使用较新的 PHP 版本

较新的 PHP 版本通常比旧版本更快。 您应该确保您使用的是最新的 PHP 版本或仅使用一个向后的版本。

不仅为了速度,也为了 安全.

冯·阿贝尔·埃肯

冯·阿贝尔·埃肯

我喜欢创造有用的内容。 我的热情是通过为互联网用户指明正确的方向来帮助他们找到他们需要的东西。 这是我喜欢做的事情,我投入了许多小时的研究和测试,以确保我通过我在 TargetTrend 上的内容做到这一点。

文章:51

接收技术人员的东西

每月一次或两次技术趋势、创业趋势、评论、在线收入、网络工具和营销