展现形式 · 概念
Banner：短消息横幅的适用条件与风险
判断何时用 Banner 承载全站通知、活动或状态信息，以及怎样控制层级、篇幅、关闭行为和移动端退化。
Banner 是横跨页面或内容区域的短消息容器，用于让访客及时看到通知、活动、配送变化或重要状态。它强调“现在需要知道什么”，不负责完成整段品牌叙事；占据页面开场并承担主要价值主张的形式属于 Hero。
适合与不适合
适合信息短、影响范围明确、具有时效或需要跨页面持续可见的场景。若消息需要较长解释、多个平行动作、复杂表单或大量视觉素材，应改用正文、卡片组或专门页面。没有真实信息时不要为了填满页面放装饰性 Banner。
优点与缺点
| 优点 | 缺点 |
|---|---|
| 位置醒目，能快速建立当前状态 | 长期常驻会形成“横幅盲区” |
| 容易在全站复用并统一更新 | 多个横幅叠加会挤压首屏内容 |
| 能为时效信息提供单一入口 | 过长文本在手机端迅速增高 |
| 可在较低实现成本下连接详情页 | 自动滚动或频繁变化会打断阅读 |
内容与状态要求
每条 Banner 至少包含消息、适用范围、有效期和必要行动。默认只保留一个主要行动；关闭按钮必须说明关闭的是当前消息还是长期偏好。活动结束、内容缺失或链接不可用时应移除整个 Banner，而不是留下空容器。
响应式与无障碍
文本必须能够自然换行，不能依赖固定高度截断关键信息。使用符合页面结构的区域和清晰标签；关闭与行动控件需要可见焦点和可理解名称。若内容自动滚动或更新，应提供暂停、停止或隐藏机制，且不能只在悬停时暂停。
组合与平台边界
Banner 可以承载促销、配送提醒、服务状态或政策摘要等内容类型，但这些事实仍由各自权威内容维护。Shopify Announcement bar、Section 或应用只是实现选择，不反向定义 Banner 的业务语义。
发布前检查
- 不看颜色时，消息的重要程度是否仍清楚？
- 一屏出现的 Banner 是否超过一个？
- 小屏换行后是否遮挡导航或主要内容？
- 有效期结束、关闭和无 JavaScript 时分别怎样处理？
- 行动链接的目标是否与消息承诺一致？
固定版本主题实现
- Dawn 页头与导航（
announcement-bar）、Horizon 页头与导航（header-announcements）：两个主题的公告栏实现与自动播放控制。
固定基线为 Dawn v15.3.0 与 Horizon 4.2.0；结论限于这两个提交，均为静态源码分析，未运行验证。