保持 WordPress 网站移动友好的 10 个技巧（和插件）

已发表: 2023-04-13

与客厅笨重的家庭电脑时代相比，我们使用互联网的方式发生了巨大变化。截至 2023 年 2 月，超过 60% 的网络流量来自移动设备 (Oberlo)。最重要的是，我们访问的网站中有超过 40% 是基于 WordPress (HubSpot) 构建的。

需要帮助销售网站？立即获取我们用于销售数字产品的百万美元宣传材料的副本！

对您和您的客户来说，好消息是制作适合移动设备的 WordPress 网站并不困难。但是，在数以千计的插件中进行分类以决定哪些插件会让您和您的客户的生活更轻松可能会让人不知所措。在本文中，我们将介绍十大技巧和 WordPress 移动友好插件列表，以轻松构建优化的网站。

适合移动设备的网站 101
创建适合移动设备的 WordPress 网站的挑战
保持 WordPress 网站移动友好的 10 大技巧和插件
1. 为移动优先设计优化图像
2. 测试并提高页面速度
3. 移动优化的菜单和导航
4. 删除不需要的插件
5. 创建移动和桌面友好的主题
6. 确保您的缓存有效
7. 针对移动设备优化的弹出窗口和消息传递
8. 自适应号召性用语按钮
9. 跨浏览器兼容性
10. 深色模式适应性
经常问的问题
- WordPress 是否针对移动设备进行了优化？
- 如果我的网站不适合移动设备怎么办？

适合移动设备的网站 101

无论您是根据具体情况创建客户的网站，还是考虑转售白标网站，您都需要将移动放在首位。但是，拥有移动响应式 WordPress 网站意味着什么？简而言之，它是一个设计精美的网站，可以在手机和平板电脑等小型设备上正常运行。在屏幕尺寸小得多的情况下，让客户轻松导航、使用易于阅读的字体大小以及更少的图形或动画以控制加载速度非常重要。

对于中小型企业，确保他们的网站适合移动设备意味着客户可以找到他们想要的信息（或产品），使用网站有良好的体验，并有可能在未来回头。移动优化还可以改善搜索结果，因为谷歌索引网站的移动版本以确定排名结果（称为移动优先索引）。改进的搜索结果意味着更多的人在搜索时会看到您客户的网站——在他们寻找时结识潜在客户。

创建适合移动设备的 WordPress 网站的挑战

如果您希望使 WordPress 网站适合移动设备，则需要注意一些事项。一些罪魁祸首可能会导致 WordPress 网站在移动设备上加载时间缓慢，这对于访问您客户网站的潜在客户来说并不是一个很好的体验。移动 WordPress 体验缓慢的一些常见原因是：

服务器托管速度慢：选择正确的网站托管解决方案会产生很大的不同。例如，如果您选择共享主机并且其他站点获得大量流量，这可能会影响您客户站点的可用资源。
大图像：包括大图像（高分辨率或大文件大小）确实会在移动访问期间减慢网站速度。
使用错误的插件：如果您的插件已过时、未优化，或者您的网站上有太多插件，则可能会显着降低速度。
错误的主题：就像插件一样，过时或编码不当的主题会影响网站速度。
缓存问题：缓存或临时数据存储可以帮助网站加载更快。不使用插件来支持缓存会使您的网站加载速度非常快。

考虑到使客户的 WordPress 网站适合移动设备的重要性，有一些很棒的插件（和默认设置）可以将 WordPress 网站提升到一个新的水平，以提高用户体验并改善 SEO 结果。

保持 WordPress 网站移动友好的 10 大技巧和插件

1. 为移动优先设计优化图像

大多数网站都有大量引人注目的图片，以吸引他们的注意力并吸引访问者的注意力。对于提供产品而非服务的企业，还需要考虑产品图片。几乎每个人在尝试用手机浏览网站时都遇到过加载缓慢甚至图像损坏的问题，如果体验过于繁琐，通常会导致离开网站。

减小文件大小、尺寸或两者都可以缩短加载时间。这会导致更快乐的访问者和可能更高的 SEO 排名，因为加载速度是谷歌在移动搜索结果中的排名因素。

人们在移动设备上浏览的另一个因素是数据。大图像会耗尽数据，如果人们担心他们的数据限制，这可能会阻止他们留在企业网站上。

WordPress 移动友好型插件：Smush

Smush 是一个屡获殊荣的插件，可以在不牺牲质量的情况下减小图像大小。它通过多种技术实现这一点，包括：

无损压缩：在不影响图像质量的情况下剥离未使用的数据
多通道有损压缩：删除不太重要或冗余的数据或人眼不可见的信息
图片大小调整：将图片设置为您网站的特定尺寸
延迟加载：图像在访问者滚动时加载，而不是一次全部加载，这意味着屏幕外图像不会影响加载时间

Smush 允许用户一次或逐张优化移动友好型 WordPress 网站上的所有图像。

成本： Smush 是一个免费增值插件，有一个免费的基本版本和一个带有更多高级功能的专业选项。

2.测试并提高页面速度

如果您不持续测试您的页面速度，您将不知道自己在哪里取得成功，以及哪里有改进的余地。您可以使用 Google PageSpeed Insights 或 GTmetrix 等速度测试工具了解您从哪里开始，以衡量您的移动友好型 WordPress 网站的速度。

对于企业而言，网站速度会直接影响收入，因为 70% 的消费者表示页面速度会影响他们是否有可能从电子商务网站购买商品 (Unbounce)。理想情况下，移动网站应在 1-2 秒内加载。除了它对 Google 排名的影响之外，Hubspot 还发现了一些有影响力的统计数据，说明网站速度对于像您的客户这样的企业主有多重要：

移动网站的平均加载时间为 15.3 秒（Think with Google）。
加载时间每增加一秒，网站转化率平均下降 4.42% (Portent)。
一半的消费者更愿意在移动网站 (Hubspot) 上拥有更快的网站速度，而不是动画或视频。
页面设计元素，而不是移动数据网络，是造成大多数慢速移动站点的原因 (Google)。

WordPress 移动友好插件：NitroPack

NitroPack 通过多种技术解决站点速度和性能问题，包括：

缓存（包括自动缓存预热、设备和 cookie 感知缓存以及浏览器和会话感知缓存）
图像优化（有损和无损图像压缩、延迟加载、抢占式图像大小调整和自适应图像大小调整）
内容分发网络 (CDN) 优化
预加载

NitroPack 可以帮助确保您客户的 WordPress 网站适合移动设备，并尽可能快地进行优化。

成本： NitroPack 有一个免费计划以及针对多种规模和需求的企业的月度和年度定价。免费选项确实附带

3. 移动优化的菜单和导航

当您考虑让 WordPress 网站适合移动设备时，记住最重要的人是至关重要的：屏幕另一边的潜在客户。在手机上浏览网站——即使是最大、最新的型号——总是与笔记本电脑或台式机上的体验不同。想一想您访问菜单的位置和方式、滚动方式、页脚和页眉的作用、信息层次结构等等。除了在较小屏幕上使用网站的挑战之外，许多访问者可能还有数字可访问性需求，这在网站设计中也应予以考虑。

WordPress 移动友好插件：WP 移动菜单

WP Mobile Menu 是一个流行的 WordPress 移动友好插件，用于创建移动优化菜单。易于使用的插件可让您自定义颜色、字体和图标。您还可以根据客户站点的部分以及从设计角度来看有意义的内容来更改菜单位置。

该插件适用于任何 WordPress 主题，针对搜索和完全响应进行了优化，因此无论屏幕尺寸如何，它都可以工作，并且针对 WooCommerce 进行了优化。

成本： WP Mobile Menu 以各种价位提供多个月度或年度计划，一个网站每月 6.49 美元起。

4.删除不需要的插件

虽然插件可以解决很多问题，但有时它们可能是问题的根源。太多的插件会影响您客户的 WordPress 网站的移动友好程度。

性能问题：每个插件都会添加更多代码——过多的代码会使网站运行缓慢。如上所述，较慢的加载时间不仅会带来糟糕的用户体验，还会直接影响收入。
插件冲突：并非所有插件都兼容，如果两个（或更多）插件发生冲突，网站可能会出现意外错误并可能崩溃。更多的插件意味着更多的不兼容机会。
安全风险：每个插件都有风险。如果它们没有保持最新状态，或者它们不安全，人们就可以瞄准该站点并利用这些漏洞。使用风险与回报框架来处理每个插件。
维护挑战：尽管名称如此，插件实际上并不是即插即用的。他们需要维护、更新和监控，以确保他们在做他们想做的事情——而不是损害您网站的性能。

WordPress 移动友好插件：Jetpack

Jetpack 具有一套功能来解决性能和安全漏洞，使您的 WordPress 网站更适合移动设备。由于 Jetpack 具有如此多的功能，您可以用一个工具替换多个插件，该工具包括安全性、站点统计信息和性能优化等。

成本： Jetpack 的工具还包括防止恶意软件和垃圾邮件的安全性、实时备份以及许多其他功能，起价为每月 13.50 美元，具体取决于您希望计划的稳健程度。

5. 创建移动和桌面友好的主题

在使您的 WordPress 网站更适合移动设备时，一个好的响应式主题至关重要。正确的它们可以确保网站满足可靠性和可访问性要求、快速加载的图像、适用于小（和大）屏幕的直观布局，并且易于通过触摸而不是鼠标或触控板进行导航。 Google 优先考虑移动网站，使用响应式主题还可以改善搜索结果——让您客户的网站出现在更多潜在客户面前。

WordPress 移动友好插件：WPTouch

WPTouch 插件可以在不改变桌面体验的情况下优化当前的 WordPress 网站。

特征：

附带一个简单的安装向导来指导您完成设置
您可以直接在插件中更改主题并添加或删除扩展
移动设备检测，改善加载时间
完全可定制的设置
一个自动保存的管理面板
内置分析
完整的 WordPress 定制器支持
全职客户支持

成本： WPTouch 的捆绑包起价为每年 79 美元，也有单点选项，因此您可以只选择适合客户需求的产品。

6.确保你的缓存是有效的

为了让您客户的 WordPress 网站适合移动设备，您需要确保您的缓存处于可控状态。但什么是缓存？简单的说，就是对频繁使用的数据进行临时存储，以便尽快访问。当有人访问您的网站时，服务器首先检查缓存以查看信息是否存在，然后检查原始来源。缓存发生在不同的位置，包括浏览器缓存、服务器端缓存和内容分发网络 (CDN) 缓存。

一个高效的缓存系统可以减少服务器负载，加快页面加载时间，并且只存储最必要和相关的数据。定期使数据过期还可以确保存储的信息始终是最新的，并且是您网站内容的最新版本。

WordPress 移动友好型插件：Hummingbird

Hummingbird 可以优化 WordPress 移动站点并通过多种策略提高站点速度。

Hummingbird 提供的最大功能之一是通过创建网站页面和资源的缓存副本进行缓存，然后可以快速访问并尽快为访问者提供服务。

该插件同时具有浏览器缓存和服务器端缓存功能。浏览器缓存将图像、样式表和脚本等数据存储在访问者的设备上，这样就不必在每次访问时都从原始来源访问它们。使用服务器端缓存，信息保存在您客户端的网络服务器上——也允许更快的访问。

使用 Hummingbird，您还可以决定将文件缓存多长时间，确定要缓存哪些信息，以及清除缓存的时间和频率。

Hummingbird 附带一个扫描工具，可以在整个站点中搜索拖慢速度的文件，并为您提供修复这些文件的解决方案。

成本： Hummingbird 是一个免费增值插件，有一个免费的基本版本和一个带有更多高级功能的专业选项。

7. 移动优化的弹出窗口和消息

弹出窗口和消息传递是任何数字营销策略中的关键工具。但是，至关重要的是，它们不会干扰在手机等较小屏幕上访问该网站的体验。

您的客户可以使用弹出窗口来增加他们的电子邮件列表（带来更多营销机会）、增加转化率或增加购物车大小，甚至可以进行市场调查以了解有关潜在客户需求的更多信息。

以下是在适合移动设备的 WordPress 网站上有效使用弹出窗口的一些方法：

销售和折扣：您可以向潜在客户推销和折扣。一些想法包括首次购买者的百分比折扣、限时或季节性销售，或者当某人花费一定金额或购买特定数量的商品时的折扣。
增加您的电子邮件列表：企业可以使用参与的电子邮件列表做很多事情。您可以使用弹出窗口来收集电子邮件地址，并向他们发送营销活动、促销信息，并让他们了解您公司的最新动态。
使用社会证明和稀缺性来推动销售：弹出窗口和消息可以是让潜在客户知道某件商品数量是否不足或分享其他人正在购买他们正在查看的产品的好地方。
进一步与您的受众互动：您可以使用消息来鼓励访问者在社交媒体上关注您、进行调查以了解更多关于他们的需求、分享视频、鼓励交叉销售等等。

太多或设计不当的弹出窗口在桌面网站上可能会造成足够的干扰，但当人们使用较小的屏幕时，它们可能会影响或破坏浏览体验。这就是为什么您需要确保它们针对移动网站进行了优化。

WordPress 移动友好插件：OptinMonster

OptinMonster 是一种易于使用的弹出式窗口生成器和转换工具，可帮助像您的客户这样的企业充分利用其网站。您可以构建灯箱弹出窗口、浮动条、滑入式弹出窗口、全屏欢迎、用于折扣的旋转轮、表格、计时器等。

该插件具有拖放式弹出窗口构建器、大量模板、A/B 测试、分析以及高级页面定位和基于行为的个性化，因此您的客户可以根据以前的访问自定义弹出窗口或显示特定优惠在某些页面上。

成本： OptinMonster 有一个基本套餐，每月 16 美元，更强大的计划适用于拥有多个网站的企业，起价为每月 32 美元。

8. 自适应号召性用语按钮

当访问者在浏览您客户的网站时已经在使用手机时，有时他们更容易打电话来查找所需的信息。与其让他们在菜单中挖掘或通过 Google 查找企业的联系信息，不如使用浮动的“立即呼叫”按钮让客户更快地与您的客户取得联系。

WordPress 移动友好型插件：WP Call

WP Call Plugin 是一个用户友好的插件，供企业在其移动友好的 WordPress 网站上添加点击通话按钮。该插件允许自定义按钮的颜色、文本、大小和网站上任何位置的位置——包括特定页面和侧边栏。该插件还具有分析功能，因此您可以找出哪些页面更有可能提示呼叫。

成本： WP Call 是一个免费增值插件，有一个免费的基本版本和一个带有更多高级功能的专业选项。

9. 跨浏览器兼容性

使 WordPress 网站对移动设备友好的一个因素是跨浏览器兼容性。我们大多数人都坚持在我们的设备上使用相同的浏览器，因此在访问您客户的网站时，您可能不会考虑检查跨浏览器兼容性。但这很重要，原因有很多：

一致性：检查兼容性可确保潜在客户无论使用何种设备和浏览器，都能获得一致的体验。
可访问性：如果有可访问性需求的人正在访问您客户的网站，您需要确保支持任何专门的浏览器或工具。
SEO：Google 会优先考虑经过适当优化的网站，因此如果您客户的网站无法在不同浏览器中正确显示，您会发现这会影响他们的搜索排名。

WordPress 移动友好插件：LambdaTest

LambdaTest WordPress 插件是一种基于云的工具，允许企业跨不同的浏览器测试他们的网站，而无需设置专门的测试环境。使用该插件，您可以直接从 WordPress 仪表板测试您的网站，以及在不同浏览器中录制网站的屏幕截图和视频。

成本： LambdaTest 是一款免费增值插件，免费版每月有 60 分钟的测试时间，付费版每月 15 美元起。

10.深色模式适配

许多移动用户将他们的设备保持在深色模式——事实上，超过 80% 的人在他们的手机上使用深色模式 (IncrediTools)。如果您希望他们在您客户的移动网站上有良好的体验，您需要考虑到这一点。深色模式在弱光下更容易阅读，许多人选择它来帮助减轻眼睛疲劳。如果网站没有针对暗模式进行优化，人们就不太可能留在该网站上。

WordPress 移动友好型插件：Droit Dark Mode

Droit Dark Mode 插件具有许多功能，可在您的网站上启用暗模式适应性。它包括自动和手动暗模式切换，因此您可以将其设置为根据设备或一天中的时间进行更改，或者让访问者使用手动按钮自行调用。它还带有可自定义的配色方案，并与所有主要的 WordPress 主题兼容。

成本： Droit Dark Mode 是一个免费增值插件，有一个免费的基本版本和一个带有更多高级功能的专业选项。

经常问的问题

WordPress 是否针对移动设备进行了优化？

是的，WordPress 针对移动设备进行了优化。您可以使用插件来确保您的 WordPress 网站适合移动设备，但标准的 WordPress 体验设计为无论屏幕尺寸如何都能响应。

如果我的网站不适合移动设备怎么办？

如果您的网站不适合移动设备，您可以采取多种措施。要使您的 WordPress 网站适合移动设备，请从基础开始：确保您的主题和设计在较小的设备上看起来不错，并且没有明显的东西，例如大图像或文件会减慢体验。从那里，您可以查看插件来优化您的网站，使其在任何设备上看起来都很棒。