Mozilla网页规范：品牌主题、字体职责与字号尺度的分析方法

本文对照Mozilla在2024年12月4日发布的品牌刷新公告，以及本次读取的Protocol 22.0.0网页设计文档，整理品牌交付时可以讨论的三个问题：页面代表谁、文字承担什么角色、内容用途为尺度选择提供什么依据。这是本文组织资料的方法，不是官方规定的决策顺序，也不代表做过实际部署测试。

先看页面的品牌归属。Protocol文档明确指出，系统支持区分“Mozilla”和“Firefox”两个不同的品牌主题[2]。这种区分不仅体现在品牌名称的展示上，还影响了整体的视觉指引，例如，Mozilla品牌与Firefox品牌在所采用的字体和色彩调性上存在差异[2]。 Mozilla的2024年公告希望公众了解其在Firefox之外的更广泛工作[1]。把公告中的组织意图与网页规范对照阅读，有助于明确讨论对象；这些材料并不证明所有文档规则都在那次品牌刷新中首次建立。

其次，在字体职责的界定上，规范要求将字体的使用划分为明确的层级。在Mozilla品牌体系下，官方指定了使用“Mozilla Headline”作为标题字体，而使用“Mozilla Text”作为正文（body text）字体[3]。与之对应，Firefox品牌则分别指定了“Metropolis”用于标题，并规定了“Inter”作为正文字体[3]。需要注意的是，文档也指出，Inter字体不仅是Firefox的指定正文字体，在Mozilla的品牌体系中也作为一种后备（fallback）字体存在[3]。这表明，字体选择是受品牌主题和内容角色（标题/正文）共同约束的。

再看字号尺度。本文建议把内容用途作为选择尺度的一个依据，同时核对所用品牌主题的具体字号和行高设置。Protocol文档提供了两种不同的字号尺度：一种是“标准尺度”（standard scale），适用于一般网站，如营销页面或博客等，其特点是标题尺寸较大[2]。另一种是“紧凑尺度”（condensed scale），则提供了更小尺寸的字号，更适合需要高信息密度的网页应用界面[2]。

情境讨论示例
假设一个团队分别制作品牌介绍页和工具界面两个独立页面，并计划采用Mozilla品牌。本文建议先在交接说明中写清品牌主题，再核对标题、正文与后备字体的角色。品牌介绍页可以讨论标准尺度是否适合内容展示；工具页则可以讨论紧凑尺度是否适合其使用场景。这里提出的是两个页面各自的选择问题，不是要求某类页面一律使用某种尺度，也不说明同一页面各区域怎样独立切换。实际选用哪些设置，仍需回到设计稿和对应文档逐项确认。

本文建议的交接问题
接收设计资料时，可以分别问：页面使用哪个品牌主题，其字体、字号和行高有哪些已说明的设置？标题与正文各对应什么角色，后备字体如何记录？页面的推广或操作用途，为标准或紧凑尺度的选择提供了哪些依据？将答案分开记录，可以帮助团队发现缺失的说明，而不是只凭一张示意图猜测设计意图。

Protocol的品牌主题本身也包含各自的字号和行高设置；standard/condensed是另一项尺度选择，不代表具体字号与品牌无关[2][3]。以上交接问题是本文的资料整理建议，不能代替实际页面的设计与检查。