你刚安装了 Dawn(或 Refresh、Sense),你的菜单能用。分类显示了,汉堡菜单在手机上打开了,购物车图标坐在右上角。你心想:”已经够好了,我继续优化产品图片吧。”
这个直觉会让你损失转化。不是因为这些主题不好——它们确实设计得很好。但”能用”和”用来卖东西有效”是两码事。每个默认主题都做了特定的设计权衡,有些权衡会直接伤害新店的销售。
本指南走过三个最受欢迎的免费 Shopify 主题——Dawn、Refresh 和 Sense——确认哪些菜单功能足够保留,哪些需要小调整,哪些应该立即改进。
- Dawn 导航干净快速但不支持巨型菜单,手机上也没有标签栏
- Refresh(2024)提供更现代的头部但在手机上仍使用标准汉堡菜单
- Sense 优先考虑视觉吸引力,适合图片丰富的品牌但在低端手机上可能感觉慢
- 三个主题都有共同的缺陷:没有底部标签栏、没有菜单图标、手机自定义选项有限
- 大多数问题可以通过主题设置修复——只有少数需要应用或自定义代码
关于主题选择的快速说明
如果你还没选好主题,不要过度思考。Dawn、Refresh 和 Sense 都是免费的,都由 Shopify 维护,开箱即用性能都不错。差异主要是视觉的——Dawn 极简,Refresh 现代,Sense 编辑风格。
特别是在导航上,三个主题都没有明确的优势。同样的缺陷和优势适用于全部三个。根据你的品牌美学来选,然后自定义导航。
Dawn:最受欢迎的默认主题
Dawn 是 Shopify 的旗舰免费主题,大多数新店从它开始。它有意极简、快速加载、遵循无障碍最佳实践。让我们分解它的导航。
什么运作良好
干净的头部结构。 Dawn 的头部很直白:左边是 logo,中间或左对齐是水平菜单,右边是实用图标(搜索、账户、购物车)。这遵循用户期望的标准电商布局。
相当不错的手机菜单。 汉堡图标打开一个干净的侧滑抽屉,里面是你的菜单项。它支持一级嵌套(点击父菜单展开子菜单),足够大多数中小型店使用。
快速加载。 Dawn 的导航很轻巧。它不加载繁重的 JavaScript 框架或自定义动画,所以即使连接慢菜单也会快速出现。在 PageSpeed Insights 测试中,Dawn 在手机性能上持续得分 85 分以上。
粘性头部选项。 在主题设置 → 头部中,你可以启用粘性头部,用户滚动时保持可见。这让你的菜单、搜索和购物车始终可以访问——一个重大可用性改进,很多店主忘了打开。
内置搜索。 Dawn 在头部包含搜索图标,打开预测搜索浮窗。它在你输入时显示结果,帮助客户更快找到产品。
什么需要调整
默认没有巨型菜单。 Dawn 支持下拉菜单(一级子分类),但不支持真正的巨型菜单,即多列布局、分类图片或促销横幅。对于 30+ 产品的店,下拉菜单里 15 个子分类变成长长的可滚动列表,难以导航。
变通方案: 你可以通过在 Shopify 导航中组织逻辑分组(在线商店 → 导航)来创建伪巨型菜单,但视觉结果仍是单列下拉菜单。要真正的多列巨型菜单带图片,你需要导航应用。
搜索图标 vs 搜索栏。 在桌面上,Dawn 默认只显示放大镜图标。点击它打开搜索浮窗,这还可以——但 Baymard Institute 的研究显示,可见搜索字段(不只是图标)会让搜索使用率增加 20-30%。
变通方案: 一些 Dawn 自定义允许你在头部显示持久搜索栏。检查你的主题设置或 Dawn 文档查看”预测搜索”选项。如果你的主题版本不支持,搜索专项应用可以添加它。
头部通知栏限制。 Dawn 的通知栏支持文本和链接,但不支持多个轮换信息或倒计时。要推广运费阈值(”满 50 元包邮”)或限时优惠,单个静态消息是可用但很基础。
什么应该立即改进
启用粘性头部。 去主题设置 → 头部 → 勾选”启用粘性头部”。这一个开关就让你的导航始终可以访问,而不是在滚动时消失。没有缺点。
打开预测搜索。 在主题设置中,确保预测搜索已启用。它在客户输入时显示产品建议,减少从搜索到产品页面的步骤。
检查你的菜单深度。 去在线商店 → 导航并审查你的菜单结构。如果任何分类嵌套超过两级(分类 → 子分类 → 子子分类),请展平它。Dawn 的手机菜单优雅地处理一级嵌套但在两级或以上时变得尴尬。
Refresh:现代化更新
Refresh 是 Shopify 较新的免费主题之一,于 2024 年发布。它采用 Dawn 的性能专注方法并添加了更多视觉抛光——圆角、柔和的排版和稍微不同的头部布局。
什么运作良好
更新的头部布局。 Refresh 提供多个头部布局选项:logo 左对齐带内联菜单、logo 居中菜单在下、或小屏幕的紧凑布局。这个灵活性让你能匹配你的品牌风格而不需要自定义代码。
改进的手机抽屉。 Refresh 中的手机菜单抽屉比 Dawn 的感觉更抛光。它包含更流畅的动画、更清晰的排版和点击目标之间更好的间距。父分类和子分类之间的视觉层级更鲜明。
集合页面过滤。 虽然不是严格意义上的导航,Refresh 的集合页面包括内置的过滤和排序功能,比 Dawn 的默认更干净。客户可以按价格、可用性和产品类型过滤——减轻你的主菜单必须展示每个变体的负担。
无障碍。 像 Dawn 一样,Refresh 遵循 WCAG 指南。菜单项有适当的 ARIA 标签,键盘导航的焦点状态可见,对比度满足无障碍标准。
什么需要调整
类似的巨型菜单限制。 Refresh 继承了 Dawn 的同样约束:下拉菜单支持子分类,但带图片和多列布局的真正巨型菜单需要额外自定义或应用。
旧设备上的动画性能。 Refresh 更流畅的动画在新手机上看起来很棒但在旧设备上可能造成轻微卡顿(iPhone SE、低端安卓手机)。如果你的目标受众包括使用旧硬件的价格敏感型购物者,请在低端设备上测试。
变通方案: 大多数动画相关的卡顿可以通过减少菜单项数量和禁用主题设置中的视差效果来缓解。
什么应该立即改进
启用粘性头部。 和 Dawn 一样——在主题设置 → 头部中启用它。Refresh 的粘性头部比完整头部稍紧凑,这很好:它省去屏幕空间同时保持导航可用。
审查头部布局选项。 Refresh 提供 3-4 个头部布局变体。试试每一个看哪个让你的分类最可见。对于 5+ 个顶级分类的店,菜单在 logo 下面的布局(全宽)通常比把所有东西塞进一行效果更好。
审计手机间距。 虽然 Refresh 的手机菜单默认间距比 Dawn 更好,但用实际拇指点击审查它。如果任何项太靠近,在你的主题自定义 CSS 或区间设置中增加菜单 padding。
Sense:编辑风格主题
Sense 是为倾向于讲故事的品牌设计的——想想手工产品、美妆品牌或生活方式店。它的导航反映了这个编辑焦点。
什么运作良好
头部视觉分量。 Sense 的头部为你的 logo 和品牌身份提供更多空间。导航感觉有意而为而不仅是工具性的,这适合美学是卖点的品牌。
图片友好的集合页面。 Sense 的集合布局强调产品图像,导航通过保持菜单干净无杂而支持这一点。对于产品照片卖得比分类名字更好的店,这是优势。
优雅的手机菜单。 Sense 的手机抽屉在视觉上精致——干净的排版、慷慨的空白、流畅的过渡。它创造了与编辑或奢侈品牌相匹配的高级感。
什么需要调整
更少的头部布局选项。 与 Dawn 和 Refresh 相比,Sense 对头部布局自定义选项更少。logo 位置和菜单位置更被锁定,如果你的分类结构不适合默认布局可能感觉受限。
性能权衡。 Sense 加载的 CSS 和 JavaScript 比 Dawn 略多,主要用于视觉效果。对大多数店差异可以忽略(手机上 50-100ms),但如果你在上面堆叠其他应用,每毫秒都算。
变通方案: 最小化第三方脚本并避免安装多个为你的头部添加 JavaScript 的应用。如果你使用 Sense,特别留意总页面权重。
什么应该立即改进
简化你的菜单结构。 Sense 优雅的菜单设计最适合更少、精选的分类(5-7 个顶级项)。如果你从前一个主题继承了复杂的分类树,这是统整的好时机。
在中端安卓设备上测试。 Sense 的视觉抛光是为现代屏幕设计的,但全球电商流量的大部分来自中端手机。在三星 Galaxy A 系列或类似设备上打开你的店并验证菜单能流畅打开。
突出显示搜索。 Sense 的搜索图标在视觉设计中可能感觉次要。确保它在头部突出放置——客户不应该费力找它。
三个主题都有的缺陷
不管你选哪个主题,三个都共享影响新店主的导航限制:
没有底部标签栏
Shopify 的三个免费主题都不包含手机底部标签栏(Instagram/Amazon 风格的屏幕底部导航)。这是重大缺陷因为:
- 标签栏让导航可见而不需要点击打开汉堡菜单
- 它们很符合拇指操作(屏幕底部是最容易的到达区域)
- 它们减少从”浏览”到”导航”的步骤从 2 次点击(打开菜单 → 选择分类)到 1 次点击
添加标签栏需要导航应用或自定义主题代码。
没有菜单图标
三个主题都显示仅文字的菜单项。主页、搜索、购物车或分类都没有图标。研究显示文字配合图标的菜单会让扫描速度提高 20-35%,帮助客户更快定位自己。
手机自定义选项有限
你不能本地配置分开的手机和桌面菜单。你在在线商店 → 导航中设置的东西适用于两种屏幕大小。但手机和桌面用户有不同的需求——手机菜单应该更平、更直接,而桌面菜单可以承受更多深度。
没有菜单分析
这些主题都不会告诉你哪些菜单项被点击最多、哪些分类带来最多流量或哪些导航路径导致购买。你需要 Google Analytics 事件跟踪或专项导航应用才能获得这个数据。
| 功能 | Dawn | Refresh | Sense | 理想 |
|---|---|---|---|---|
| 粘性头部 | 是(开关) | 是(开关) | 是(开关) | 是 |
| 巨型菜单 | 否 | 否 | 否 | 带图片的多列 |
| 手机标签栏 | 否 | 否 | 否 | 底部 4-5 个标签 |
| 菜单图标 | 否 | 否 | 否 | 图标 + 文字标签 |
| 预测搜索 | 是 | 是 | 是 | 是 |
| 分开手机/桌面菜单 | 否 | 否 | 否 | 独立配置 |
| 菜单点击分析 | 否 | 否 | 否 | 内置点击跟踪 |
| 下拉子分类 | 是(1 级) | 是(1 级) | 是(1 级) | 2+ 级 |
什么时候默认够用(什么时候不够)
在这些情况下保留默认:
- 你有少于 30 件产品
- 你的分类结构是平的(5-7 个分类,没有子分类)
- 你的流量主要来自桌面
- 你才刚推出想在投资导航前验证产品市场适配
在这个场景中,启用粘性头部和打开预测搜索的 Dawn、Refresh 或 Sense 会很好地为你服务。在你有流量数据显示客户卡在哪之前,别花钱在导航应用上。
在这些情况下升级:
- 你有 30+ 件产品带子分类
- 手机流量超过 50%(在 Shopify 分析 → 在线商店 → 按设备的会话中检查)
- 你的跳出率超过 60% 且你怀疑导航混乱
- 你想要带分类图片、图标或促销横幅的巨型菜单
- 你需要手机标签栏来方便拇指浏览
对于这些场景,导航应用如 Navi+ Menu Builder 可以弥补你的主题提供的和你的客户需要的之间的差距。它在你现有主题上分层而不替换,添加巨型菜单、标签栏、图标和分开的手机/桌面配置。
主题更新Shopify 定期更新它的免费主题。这里提到的一些缺陷可能在未来版本中得到解决。在主题更新后,重新测试你的导航看是否添加了新功能——并确保现有自定义没被覆盖。
你的后续步骤
- 识别你的主题。 去在线商店 → 主题来确认你运行的是哪个主题。
- 启用粘性头部。 每个主题都支持这个。现在就打开它。
- 启用预测搜索。 一样——一个开关,即时改进。
- 审查上面的对比表。 识别对你的店大小和流量模式最重要的缺陷。
- 决定:调整还是升级。 如果默认覆盖你的需求,专注于内容和营销。如果你需要巨型菜单、标签栏或手机专项布局,评测导航应用。
默认 Shopify 主题为你的导航给出了坚实的起点,对很多新店来说,那个起点确实足够好。关键是知道哪些功能要立即启用(粘性头部、预测搜索)和哪些限制会随着店增长而重要(没有巨型菜单、没有标签栏、没有分开的手机菜单)。从你现有的开始,跟踪客户卡在哪,当数据告诉你该升级时故意升级。
本文是更大指南的一部分 首个在线商店的导航基础:5 个要点。