Tired of
lengthy page building?
Try GemPages to create pages faster and smarter with AI-powered feature.
Back to Blog List
- 跳出率
- 品牌认知
使用 SEOAnt 预加载链接来提高网站速度
通往成功的快车道：优化您的 Shopify 商店速度以获得最佳性能
Updated:
15
minutes read
在电子商务世界中— — 速度确实很重要！
无论客户是通过桌面还是移动设备浏览您的网站，他们都希望在整个购买过程中获得无缝的体验。
是的，2G 互联网时代已经一去不复返了，那时人们会耐心地在手机上等待网站加载。过去几年，互联网速度大幅提升，客户的期望值也随之提高。
考虑到这些趋势， Shopify 速度优化已成为所有店主成功的关键因素。
本博客将帮助您了解如何衡量 Shopify 页面速度、优化 Shopify 商店的重要性以及提高 Shopify 商店速度的有效方法。
让我们一起一步步探索吧！
为什么要提高 Shopify 页面速度？
你的 Shopify 商店速度影响两个重要方面：
- 用户体验 (UX) ：如今没有人喜欢等待。如果页面加载时间过长，客户可能会失去耐心并放弃购买、离开您的网站或在购买过程中产生负面情绪。
所有这些方面都会直接影响以下一些关键因素：
- 转化率- 跳出率
- 品牌认知
了解更多： Shopify 转化率：初学者指南
- Google 搜索排名 (SEO) ：Google 的核心网络指标是一项信号指南，可确定可能影响网站搜索排名的因素。速度是可能影响 SEO 的因素之一，可以使用 Google PageSpeed Insights 工具进行验证。但这并不是说您应该在 SEO 工作中只关注页面速度。请记住，网站内容的相关性在 Google 搜索排名中仍然发挥着重要作用。
了解更多： 如何为你的 Shopify 商店设置 Google Analytics 4 (GA4)
Unbounce对 750 名消费者进行了调查，发现近70% 的消费者表示网站速度影响他们在网上商店购买的意愿。
在另一项针对 188 名营销人员的有趣研究中，Unbounce 发现85% 的营销人员的登陆页面速度比 Google 推荐的 3G 连接速度（5 秒或更短）要慢。
如何衡量 Shopify 页面速度？
当考虑Shopify 的速度优化时，您需要检查的第一件事就是网站速度的持续趋势。
不仅要测量台式机的网站速度，还要测量移动用户的网站速度。以下是 Skilled 根据多项研究得出的有趣发现：
64% 的移动用户希望网站在四秒内完成加载，而 47% 的在线购物者希望网站在两秒内完成加载。
现在，有不同的方法来检查您的 Shopify 商店的速度得分。让我们带您了解几种重要的方法：
通过 Shopify 管理员检查您的商店速度
您可以按照以下步骤在 Shopify Admin 中查看您的商店速度：
步骤1：打开您的Shopify管理员。
第 2 步：在左侧边栏中，选择“分析” 。
步骤 3：打开报告。
步骤4：单击“Web 性能” 。
步骤 5：您将看到“加载速度”部分。单击“自定义”按钮以查看（最大内容绘制）LCP 文档或加载速度报告。
Shopify 的评分基于 Google Lighthouse 性能指标，具体如下：
- 90 至 100：良好
- 50 至 89：需要改进
- 0 至 49：较差
使用 PageSpeed Insights 测试您的商店速度
Google 的 PageSpeed Insights 是分析商店速度最受欢迎的工具之一。2018 年，Google 宣布 Pagespeed Insights 将由 Lighthouse 提供支持。因此，您可以在 PageSpeed Insights 工具中获得 Lighthouse 分析。
如何使用 PageSpeed Insights：
1. 使用 Google 的PageSpeed Insights工具
2. 输入您的网页网址
3. 点击分析按钮
正如您在上面看到的，它给出了最大内容绘制、第一个字节时间等的总体概念。还有您网站的性能、可访问性、最佳实践和SEO分数 - 包括移动版和桌面版。
了解更多信息：关于 PageSpeed Insights
以 1 美元的价格开始在 Shopify 上销售
从免费试用开始，然后第一个月只需 1 美元
提高 Shopify 商店速度的 11 种有效方法
在我们开始讨论优化 Shopify 商店速度的不同方法之前，重要的是要知道影响 Shopify 页面速度的因素有很多，而且并非所有因素都在您的控制范围内。
因此，这些因素分为两大类：
不可控因素：
- 客户的设备、网络或位置存在问题
- Shopify 的基础设施
- 本地浏览器缓存和服务器端缓存
- content_for_header Liquid 对象内的资产
- 内容分发网络 (CDN)*
可控因素：
- Shopify 应用程序及其功能
- 主题及其特点
- 复杂或低效的 Liquid 代码
- 图片和视频
- 字体
现在，让我们看看如何根据可控因素来提高 Shopify 商店速度，使用一些最佳实践：
1.删除不使用的Shopify应用程序
Shopify 应用程序必不可少。它们有助于添加功能、增强风格并提高商店性能。
但应用程序太多也会降低网站速度。尤其是面向客户的应用程序（用于在网页上显示信息）会影响商店速度。
那么，问自己一个问题——您真的需要安装的所有应用程序吗？
然后，保留所有必备的 Shopify 应用。重新评估那些只是添加花哨功能的应用（如果有的话）。删除那些不会为您的业务增加任何价值而只是为您的网站添加几行代码的应用。
专业提示：查看此建议套餐，其中包括：前 3 天免费 Shopify 帐户 -1 美元/月 Shopify 订阅（第一个月） - 免费GemPages高级模板 - 每个Dropshipman订阅均可享受 50% 的折扣 - ParcelPanel 30 天免费试用。
2. 为你的 Shopify 商店安装一个快速加载、响应式的主题
为您的 Shopify 商店选择合适的主题必须是最关键且深思熟虑的决定之一。为什么？因为您的 Shopify 主题是影响您网站速度的关键因素之一，而且您不会每天都更改主题。
专业提示：实际上， 更改 Shopify 主题非常简单。使用不同的主题在一段时间内对您的 Shopify 商店进行 A/b 测试，看看哪一个最合适。
以下是选择主题时需要考虑的一些事项-
- 风格与性能之间的平衡：
虽然速度显然是一个重要因素，但事实上，您还需要考虑与品牌风格和内容要求相匹配的主题。查看演示商店以了解风格，并查看速度和性能评论。确保您的主题在所有设备上都完全响应。
了解更多： 2024 年 10 个最快的 Shopify 主题（免费和付费）
- 尝试并测试您的主题：
首先，选择一个合适的主题，例如适合服装店的最佳 Shopify 主题、 最佳 Shopify 珠宝主题等。Shopify 还具有适合整个博客渠道（而不仅仅是销售渠道）的主题，它确实有助于为您的商店带来更多流量。
在最终确定主题之前，您必须测试它是否符合您的期望，尤其是在购买付费主题时。 Shopify 主题商店的好处是，您在发布主题之前无需购买主题。
如果您正在寻找免费主题， Shopify最近推出了许多具有在线商店 2.0 功能的免费主题。Dawn 是专注于速度的免费主题之一，旨在为所有浏览器创造出色的体验。
Dawn Shopify 主题
- 安装最新的许可版本：
这似乎很明显，但仍然有一些新的 Shopify 店主会犯这个错误。如果您聘请某人来创建和设计您的商店，请确保他们安装的是最新版本的主题，而不是高级主题的过时或盗版副本。
了解更多： 2024 年适合您商店的 20 个高转化率 Shopify 主题
- 升级您的主题：
定期检查主题开发人员的更改日志，并在发布任何重大更新时升级您的主题。
- 研究竞争对手的商店也应该在你的待办事项清单上：
它可以帮助您了解您的竞争对手是谁以及您需要做些什么来升级您的商店，而不是只是等待大鱼 Shopify 更新主题。但如何做？这里有两个重要的策略： 找出您的竞争对手正在使用什么应用程序以及这些商店正在使用哪个主题。
重要提示：如果您想以最快的方式建立 Shopify 商店，使用第三方应用程序是必须的。说到主题，GemPages 是一款Shopify 页面构建器，它以主题部分等实用功能脱颖而出。只需几个小技巧，您就可以借助此功能轻松地将更新同步到整个店面。试试看，让您的商店一飞冲天！！！
还没准备好承诺但仍想尝试一下？
没问题！开始使用 GemPages 的免费计划。探索可以为您的商店创造奇迹的精彩功能。
3. 上传前优化图片和视频
图像和视频可以帮助您表达品牌的信息和情感。
虽然您希望通过图像和视频使您的网站和内容看起来丰富多彩，但您还需要注意它们如何影响您的商店速度。
3.1图像优化
- 推荐的图像格式
对于产品和网站图片，我们建议大多数Shopify 商店使用WebP格式。WebP 是 Google 开发的一种现代图像格式，可以为网络上使用的图像提供更好的压缩。
与 PNG 和 JPEG 相比，此格式可节省约 26-34% 的文件大小。因此，网页浏览速度更快。
除此之外，如果您无法使用 WebP 图片，JPG 和 PNG 图片也可以。对于徽标或图标，如果可以，请使用 SVG 格式。
- 使用图像格式转换器：
如果您没有 WebP 格式的图像，您可以使用 WEBP 转换器（例如 CloudConvert.com）将您的 PNG 或 JPG 图像转换为 WEBP 图像文件。
使用 JPG 到 WebP 转换器，四张总大小为 830 KB 的 JPG 图像缩小到总大小为 327 KB。
- 压缩和调整图像大小：
如果您想使用 JPG 或 PNG 文件格式，但图像文件太大，则会影响页面加载速度。强烈建议在需要时压缩或调整图像大小。要压缩 PNG 图像，您可以使用在线工具，例如compresspng.com和compressjpeg.com来压缩 JPG 图像。
3.2 视频优化
首先，让我们了解一下基础知识。在 Shopify 中，有两种方法可以上传产品视频：
1. 上传视频文件
2. 嵌入 YouTube 或 Vimeo 视频链接
博客页面上嵌入的视频
对于上传视频，Shopify 标准如下：
- 视频长度：最长 10 分钟
- 视频大小：最大 1 GB
- 视频分辨率：最高 4K（4096 x 2160 像素）
- 视频文件类型： .mp4 或 .mov
但是，我们建议嵌入 YouTube 视频，因为它不需要满足这些标准，而且还可以帮助您优化商店速度。
4.优化CSS，JavaScript和HTML
通过查看 CSS、JavaScript 和 HTML 等技术术语，您可能已经知道这里的事情变得技术化了。
简而言之，您可以缩小商店的 CSS 和 JavaScript 以优化 Shopify 商店速度。使用 CSS Compressor 和 JavaScript Minifier 等在线工具，您可以压缩商店的 CSS 和 JavaScript。
但是，整个活动需要您从商店下载 CSS 和 JavaScript 文件并将其替换为压缩文件。
除非您自己是一名程序员，否则不建议您在没有 Shopify 专家或自由开发人员的帮助的情况下尝试这些技术活动。
5.使用系统字体
许多人喜欢使用特定字体，但重要的是要考虑到选择不太常见的字体可能会减慢您的网站速度。如果访问者的设备上没有安装字体，则必须下载，这在技术上只需要片刻，但确实会影响页面加载的整体速度。
因此，如果您的 Shopify 商店速度是您的首要任务，请考虑仅使用系统字体。
系统字体有助于提高页面加载速度，因为它们在全球大多数系统上都可用，因此，它省去了下载字体这一小步。以下是 Shopify 分享的示例，说明当您选择系统字体系列时可以显示哪些字体：
- Mono ：Menlo、Consolas、Monaco、Liberation Mono 或 Lucida Console
- 无衬线字体：BlinkMacSystemFont、Segoe UI、Roboto、Ubuntu 或 Helvetica Neue
- 衬线：Iowan Old Style、Apple Garamond、Baskerville、Times New Roman、Droid Serif、Times 或 Source Serif Pro
了解更多： Shopify 字体 101：如何为你的 Shopify 商店找到最佳字体组合
6. 使用英雄横幅代替幻灯片
在网站首页的顶部，通常有两种类型的部分：
1.幻灯片（又称滑块或轮播），可自动或手动显示不断变化的图像。或
2.英雄横幅，即一张静态图像。
作为 Shopify 商店所有者，您可能会有一种诱人的冲动，想要添加包含多张图片的幻灯片来涵盖您的企业所提供的所有内容。
但是在您的网站上显示幻灯片是一个好主意吗？
嗯，对于您的网站速度和用户体验来说，这可能不是一个好主意。由于幻灯片使用多个图像文件，它会增加整体页面加载时间并降低您的网站速度。
YouSea 使用英雄横幅图像而不是幻灯片，这不仅可以避免干扰，而且还可以轻松加载主页。
7.减少重定向和断开的链接
重定向是一种将网站访问者发送到其他 URL 而不是访问者输入或点击的原始 URL 的技术。
重定向在许多情况下都很有用，例如当您需要将页面从一个 URL 移动到另一个 URL、删除页面、将网站移动到新域、合并重复的网页等。此外，重定向还有助于将高排名页面与新创建的内容连接起来。
唯一的问题是重定向会影响商店的速度。同样，如果您的网站有太多断开的链接，它可能会成为优化商店速度的障碍。您必须修复断开的链接并减少重定向才能获得所需的速度分数。
8. 使用 Google Tag Manager 整理所有跟踪代码
Google Tag Manager 是一款解决方案，可让您管理和部署网站上的不同代码片段。通过此操作，您可以将跟踪信息从网站传输到Google Analytics 。
重要提示：所有拥有自定义网页图片的 Shopify 商店均可使用 Google Tag Manager 。您可以详细了解在 Shopify 上使用 Google Tag Manager的注意事项。
9.考虑使用延迟加载
延迟加载是一种在客户向下滚动页面时缓慢加载图像或媒体文件来提高网站速度的技术。这可确保任何非关键资源不会立即加载，而仅在网页上真正需要时才加载。
当您使用延迟加载内容时，浏览器将需要更少的资源，从而缩短页面加载时间。这还可以为您的客户提供更好的用户体验，并有助于 SEO。
如果您使用GemPages 页面构建器，则此功能在所有计划中均可用。让我们加快您的页面加载时间。
10. 使用 AMP 让您的页面速度飞快
AMP 代表加速移动页面。这是一个开源项目，最初由 Google 创建，用于优化移动网页浏览并使其更快。
您可以使用 AMP 来加速您的 Shopify 网站，有两种方法可以做到这一点：
- 使用自定义编码创建 AMP
这种方法需要扎实的技术知识，因为通过自定义代码创建 AMP 相当复杂。它需要添加备用的液体模板，您可以在此处找到更多信息：如何在 Shopify 主题开发中使用备用模板。
如果您不熟悉这些技术方面，您可以聘请Shopify 专家或自由开发人员。
- 使用 Shopify 应用进行 AMP
现在，让我们讨论更简单的选择，那就是使用 Shopify 应用。有多个 Shopify 应用可以帮助您创建 AMP，以提高商店速度并传递核心 Web 生命力。
Shopify App Store 有不同的应用程序可帮助您创建 AMP。我们推荐的一些应用程序包括 Shop Sheriff 的 AMP、AMP 应用程序和 Fire AMP。
11. 安装 Shopify 速度优化应用程序
因此，以“删除未使用的应用程序”来加速 Shopify 网站速度开始的列表现在将以一些专门为提高 Shopify 网站速度而创建的 Shopify 应用程序的推荐作为结束。
SEOAnt ‑ AI SEO 优化器使用 SEOAnt 预加载链接来提高网站速度
通过优化商店以获得更快的速度和更高的排名来提升您的搜索引擎优化 (SEO)，无需专家：
- 网站加速
- AI SEO助推器
- 自动检测 404 错误
- 使用 AI 生成产品描述
TinyIMG 是您满足所有网站性能和 SEO 需求的一站式商店。
该应用程序专注于提高网站性能，其主要功能包括：
- 图像压缩
- 搜索引擎优化 (SEO)
- 脚本控制
- 断开的链接重定向
使用 AMP 应用提升您的网站流量和销量
AMP 应用程序旨在帮助 Shopify 商家通过 AMP 吸引更多流量，并通过提高网站加载速度来降低跳出率。其主要功能包括：
- 增强“核心网络生命力”
- 主题编辑器用于定制
- 与元数据和 JSON-LD 集成以实现 SEO
Swift 使用先进的技术来提高您的页面速度。
Swift 应用程序使用人工智能 (AI) 系统进行 Shopify 页面速度优化。其主要功能包括：
- 通过预加载内容优化速度
- 最优质量的图像压缩
- 压缩 CSS、JavaScript 和 HTML
- 速度分析及建议
使用 GemPages 提高 Shopify 商店的速度
不要让您的访客等待。立即优化您的 Shopify 商店速度，并观察用户体验质量的提升。
Shopify 速度优化：重要说明
1. 始终优先考虑“移动优先”的方法。
为什么？因为大多数用户都是用移动设备浏览您的商店的。来自Insider Intelligence的这些统计数据可以让您很好地了解“移动优先”方法的重要性：
- 2021 年，零售移动商务销售额价值 3593.2 亿美元，比 2020 年增长 15.2%。
- 更有趣的是，到 2025 年，这一数字预计将增长一倍以上，达到 7282.8 亿美元，占美国零售电子商务销售额的近 44.2% 。
2. 关注转化率的所有重要因素
Shopify 速度优化很重要。但是，请记住，这只是有助于提高销售和会议质量的众多因素之一。
- 在努力加速您的 Shopify 商店的同时，不要忘记其他重要因素，例如详细的产品描述、社会认同、引人注目的网站文案和标题等等。
- 阅读更多关于Shopify 转化率：初学者指南的内容。
3. 为电子商务的未来做好准备
电子商务的未来要求您做好准备，提升移动用户的体验。这就是GemPages为您带来即时登陆页面（测试版）迷你应用程序的原因！
即时登陆页面 (ILP)是 GemPages 的一项举措，旨在提高您的商店性能，帮助您达到加载速度基准，并为您提供流畅的页面构建体验。
但最重要的是，它旨在帮助您构建和启动快速加载和针对移动设备优化的登录页面，以便您可以通过移动和社交媒体活动推动销售和转化。
准备好加速你的 Shopify 商店了吗？
现在您知道了哪些因素会影响您的 Shopify 商店速度以及如何优化您的 Shopify 页面速度，现在是时候采取行动了！
从测量您的持续速度得分开始。看看是否有需要改进的地方。如果有，请分析您的 Shopify 商店需要改进或改进的地方。
纵观这篇博客，如果你注意到，许多影响你网站速度的因素也是你商店中必须存在的因素。因此，你无法完全删除或更改所有这些因素，但你可以做的是尽可能地优化它们。
想让您的商店变成摇钱树吗？
使用 GemPages 页面构建器，您可以创建引人注目的商店页面，让访客惊叹并将他们转化为买家。
有关 Shopify 速度优化的常见问题解答
What is a good Shopify store speed?
Shopify's score is based on Google Lighthouse performance metrics. A good Shopify speed score is anywhere over 50, speed scores over 90 are awesome.
How do I test my Shopify speed?
You can test your Shopify speed through Google’s PageSpeed Insights tool. Also, you can check your Shopify speed score directly from Shopify Admin by going to Online Store > Themes, and you’ll see the score right above the current theme section. Learn more How to Measure Shopify Page Speed.
What affects the speed score on Shopify?
The are several factors that affect Shopify's speed score including: Controllable factors: Shopify apps, images, videos, fonts, and your theme. Non-controllable factors: Customer's device, network, location, Shopify infrastructure, Content delivery network (CDN), and so on.
