2022年底,一位客户找到我。她运营一个位于英国哈顿花园的高端珠宝品牌,年线上销售额约240万英镑,几乎完全依靠Shopify。数字不错。但她很生气。她的订婚戒指(目录中利润最高的产品)的转化率卡在了0.8%,而她工作室的线下成交率大约是34%。差距不在产品上。产品很漂亮。差距在体验上,Shopify尽管有其优势,却给了她一个看起来和感觉上都像是精装版Etsy店铺的网站。
那次对话促使我好好思考一下奢侈品类的无头商务。不是那种机构博客喜欢讲的抽象"零售的未来"。而是具体的、混乱的、昂贵的、有时值得的那种。
所以。这是我从为细珠宝和高价配饰品牌构建和咨询无头项目中学到的东西。
---
为什么 Shopify 具体会遇到瓶颈
让我先说清楚一点:Shopify 很出色。我在 Seahawk 的投资组合中已经建立了一千多家 Shopify 商店。对于大多数品牌来说,它正是正确的选择。快速、可靠、生态系统成熟,一个称职的开发人员可以在三到四周内打造一个漂亮的店面。
但是精美珠宝不是大多数品牌。
问题往往集中在三个方面。首先是动画和交互保真度。Liquid是Shopify的模板语言,是一个服务器端渲染系统。你显然可以加上JavaScript,但要创造高端珠宝商想要的那种流畅、电影感的滚动体验(想想Van Cleef的网站、Graff的网站,甚至是资金充足的独立品牌的网站),你需要在每个转角都与主题架构对抗。最后你只能一个补丁套一个补丁。
其次是产品故事深度。订婚戒指不是一个SKU。它是一份4C分析、一个溯源故事、一个360°视频、一个让你更换戒托和钻石的配置器、一份包含手部照片的戒指尺寸指南,理想情况下这一切都应该存在于一个URL上,不会因为JavaScript过重而崩溃。Shopify的metafield系统在2.0主题架构和Online Store 2.0的改进下已经好多了,但当你在构建真正复杂的产品模板时,它仍然会显得很生硬。
第三是在丰富性中保持性能。珠宝网站图片多。视频多。高分辨率放大功能也多。在一个媒体丰富的Shopify主题上获得70以上的Lighthouse分数,同时不剥离一半的体验,这真的很难。我做过,但需要英雄般的图片优化工作和大量权衡。
0.8% 转化率问题通常是信任问题
这是我花了一段时间才理解的:对于高价商品,网站的感知品质是品牌信任的代理。一个4800英镑的订婚戒指,从一个感觉加载有点慢的网站上出售,产品图片感觉有点压缩,结账流程打破了商店的视觉语言,这样的网站在悄悄地摧毁转化。
人们不会明确表达这一点。他们只是离开了。
---
"无头"在这个语境中实际上意味着什么
快速说明一下对于任何需要了解基础知识的人:无头商务意味着你将前端(客户看到和交互的部分)与后端商务引擎(购物车、结账、库存、订单)分离。Shopify的Storefront API让你可以纯粹将Shopify用作后端,同时用任何你想要的框架构建前端。
我最常推荐和构建的栈是:前端用Next.js,商务后端用Shopify,用Sanity或Contentful这样的无头CMS来管理编辑和故事内容。有时在顶端加上Algolia这样的专用搜索层。
这就是架构。听起来很优雅。确实可以很优雅,但成本影响需要直白地说出来。
---
真实成本分解
人们对无头商务充满憧憬,然后看到发票时就会退缩。所以让我坦诚地说这到底要花多少钱。
为高端珠宝品牌构建一个设计完善的无头Shopify店铺,定制Next.js前端、Sanity CMS、Algolia搜索、配置好的产品配置器、适当的动画工作,初期构建成本大约在4万到12万英镑之间。这是一个很宽的范围,主要取决于配置器的复杂度和动画的范围。
持续运营方面,你需要更复杂的托管和基础设施设置。Vercel用于Next.js托管是显而易见的选择,他们的Edge Network在性能方面处理得很好,但你需要为此付费。一个有意义的Sanity计划、Algolia成本、开发人员为内容模型变更所花的时间(这些是Shopify商户可以在主题编辑器中自己做的事)。总体拥有成本真的会更高。
这是我对每个兴高采烈地来找我想要采用无头的客户说的:运营开销是真实存在的。你的营销团队再也不能仅仅安装一个 Shopify 应用来添加评论小部件或忠诚度计划。现在每个集成都需要开发者的介入。这不是一个破坏性因素,但这是你的组织运营方式的根本改变。
什么时候这个成本值得
当以下条件满足时,数学才开始有利:
- 你的平均订单价值在1500英镑以上,因为即使转化率提高0.5%也会产生实质性收益
- 你拥有编辑内容(品牌故事、产品溯源特性、设计师档案),需要与产品并列展示,并由非技术团队管理
- 你在运营大规模付费媒体投放,但落地页体验明显不达标,无头架构给你快速构建活动专属体验的灵活性
- 你有产品配置需求(戒指定制工具、刻字、宝石选择),在 Shopify 原生架构中根本不可行,否则会变成维护噩梦
---
我实际推荐的技术栈
在构建和接手过几个这样的项目后,这是我会选择的方案:
- Next.js 14(App Router),React Server Components 模型在性能上真的很有用;你可以流式传输产品数据而不阻塞页面渲染
- Shopify Storefront API,而不是 Admin API;Storefront API 才是无头前端应该调用的客户端数据接口
- Sanity v3,GROQ 查询语言一旦越过学习曲线就妙不可言,内容湖模型特别适合想要跨网页、应用和邮件复用编辑内容的品牌
- Algolia,对于产品目录庞大、需要按金属类型、宝石、价格区间和系列进行分面筛选并要求即时响应的品牌特别有用
- Framer Motion,用于动画层;它与 Next.js 集成顺畅,让你能实现滚动触发和物理引擎动画,使奢侈品网站显得生机勃勃
- Vercel,托管、CI/CD、预览部署供内容团队在上线前审查
我已停止推荐的方案
Gatsby。我知道有些人仍然对它信誓旦旦,但我在 2020 年到 2021 年间用 Gatsby 建了两个无头珠宝店,构建时间长得离谱,生态系统也明显失去了势头。Next.js App Router 已经让 Gatsby 在这个使用场景中基本成了多余的。
我也已经停止推荐完全自定义后端。Shopify 的 Storefront API 结合 Shopify 原生结账(无头设置中你不会替换它,仍然使用 Shopify 结账),为你提供 PCI 合规、支付方式、Shop Pay 和高转化率的结账流程。别重新构建那套东西。永远别。
---
配置器问题,以及诚实的答案
这是大多数高级珠宝无头项目要么非常成功、要么成本高昂地崩溃的地方。
一个戒指配置器,让客户选择款式、金属、石头形状、克拉重量,然后看到渲染或拍摄的结果,如果做得到位的话,工作量巨大。我见过品牌尝试在 Shopify 内部用变体和元字段来构建这个。对于简单的情况(两三个选择),能用。对于有数十种组合的真正配置器?变体限制(Shopify 中每个产品 100 个)很快就成了硬障碍。
Seahawk在2023年与一家梅费尔珠宝商的项目中,配置器需要18种镶嵌风格×4种金属×7种宝石形状×5种克拉带。这超过2,500种组合。每种都有自己的价格逻辑。Shopify的本地变体系统根本不支持这种规模。我们最后在Next.js层构建了配置器逻辑,在URL和购物车属性中存储配置状态,并使用自定义Shopify行项目属性结构将选定的配置传递给履行系统。效果非常好。但花了三个开发者六周时间。
这是实话。是可能的。就是不快。
---
Headless无法解决的问题
我想对机构围绕 headless 的言论中的一个观点提出质疑,即它是转化问题的灵丹妙药。
它不是。
如果你的产品摄影平庸,headless架构救不了你。如果你的戒指尺寸指南令人困惑或退货政策隐藏很深,无论你的滚动动画有多么电影质感,你的转化率都会很糟糕。我见过一些构建精美的headless商店表现不佳,因为品牌没有真正的编辑内容来填充CMS,所以页面半空着,显得很稀疏。
Headless会放大已有的东西。如果品牌强大、内容丰富、摄影优秀,headless就给你一块画布,用真正的创意自由来表达所有这些。如果这些东西缺失,headless就是一种昂贵的方式来发现你的问题从来就不是技术问题。
---
常见问题
无头商务是否仅适用于预算充足的大品牌?
基本上是的,至少在精细珠宝领域。构建成本和持续开销让年销售额低于 50 万英镑的品牌很难接受。在这个门槛以下,我会把钱投在更好的摄影、转化率优化审计,以及配置良好的 Shopify 主题(如 Dawn 或 Prestige)上,然后才考虑 headless。现在的投资回报率还不够高。
我能否将Shopify原生结账与无头前端一起使用?
是的,你应该这样做。Shopify 的 Checkout Extensibility 已经显著改进,你可以自定义结账外观并添加 UI 扩展,无需替换它。用自定义构建的替换 Shopify 结账是一个你会在十八个月内后悔的决定,那时你需要支持新的支付方式或遵守新的欺诈规则。
无头构建实际上需要多长时间?
对于一个拥有产品配置器、编辑内容需求和有意义的产品目录的高端珠宝品牌来说?实际上从发现到上线需要16到24周。任何告诉你8周的人要么在激进地削减范围,要么计划给你一些未完成的东西。我两种都见过。
与配置良好的Shopify主题相比,性能差异是什么?
老实说,少于人们预期的那样。优化良好的 Shopify 主题使用 Shopify 的 CDN 和压缩媒体,Lighthouse 分数可以达到 80 多分。优化不良的 headless 网站可能在 50 分左右。headless 的性能优势是真实的,但不是自动的,它需要严格的实施。更大的优势是交互质量和动画逼真度,而不是原始加载速度。
我应该迁移现有的Shopify商店还是从头开始重建?
重建。我曾经两次尝试将现有的 Shopify 店铺迁移到无头架构,两次都因为现有店铺的技术债务污染了新项目。从零开始构建,迁移你的数据(产品、客户、订单历史),完全放弃旧主题。
---
顺便说一下,Hatton Garden 的客户就是在 Next.js / Shopify / Sanity 技术栈上重建的。花了我们十九周时间。她的订婚戒指转化率从 0.8% 提升到 2.1%,这是在上线后九十天内实现的。她还告诉我她的营销团队很不高兴,因为现在改一个首页横幅都需要开发者。这两件事同时都是真实的。
这就是 headless 商务。真正强大。真正苛刻。值得的,但仅限于品牌做好了迎接它所要求的准备的时候。
相关阅读:2026年无头架构与WordPress安全性对比:为什么选择Next.js和Astro、Astro以及从WordPress迁移到Next.js。
