VOCABULARY / 词条
移动优先
Mobile-First
先为最小的屏幕与移动情境设计产品，再向更大的屏幕扩展：小屏幕迫使团队先决定什么最重要，移动设备特有的能力也从一开始就被纳入考虑，而不是把桌面版做完后再削减成移动版。
识别特征
- 第一版版式与内容取舍是在最小屏幕上做出的
- 较大屏幕的版式是在小屏版本上增加列、信息与操作，而不是反过来删减
- 定位、触控、摄像头等移动设备能力在需求阶段就被考虑
概念边界
移动优先是关于设计顺序与取舍的立场，不是一种排版技术。它不等于响应式设计：响应式设计是用流式网格、弹性图片与媒体查询让同一页面适应不同宽度的实现手段，可以从桌面向下写，也可以从移动向上写；移动优先回答的是先为哪种情境做取舍。它也不同于渐进增强：渐进增强按浏览器与网络的能力从基础功能逐层叠加，关心的是在最差条件下核心任务能否完成；移动优先按屏幕与情境排序，最小的屏幕不一定是能力最弱的环境。它也不意味着"只做移动端"或把桌面版做成放大的手机界面——向上扩展时更大的屏幕同样应当得到合适的版式。
什么时候考虑它
- 相当一部分使用发生在手机上，或这一比例正在增长
- 页面内容与功能过多，团队难以就优先级达成一致
- 产品能从定位、触控或传感器等移动能力中真正受益
什么时候慎用
- 主要任务依赖大屏幕与精确指针，例如密集的数据编辑或专业制图工具
- 把小屏版本直接放大当作桌面版，宽屏空间被浪费
- 以"移动端放不下"为由删掉用户在任何设备上都需要的内容
取舍
从最小屏幕开始迫使团队尽早决定优先级，得到的核心体验更聚焦，也让移动设备的能力进入早期设计；代价是桌面上的高密度任务可能被当作事后补充，而小屏上的取舍一旦被当作内容本身的取舍，较大屏幕的用户会失去他们需要的信息。
条件规则 · 编辑建议
相关词条
两者都是"从小处开始、向上增加"，但渐进增强按浏览器与网络能力分层，移动优先按屏幕与使用情境排序；最小的屏幕不一定是能力最弱的环境，两条轴可以同时采用。
小屏基线通常是一列由上到下的内容，较大屏幕再在此基础上增加栏位。
移动优先决定基线内容，自适应多窗格说明大屏上如何把这些内容并排展开，而不是把手机界面放大。
小屏幕的限制迫使团队删去非必要元素，这一取舍同样减少了用户需要同时处理的信息。
来源与支持范围
Luke Wroblewski 在 2009 年 11 月 3 日的这篇文章中主张 Web 应用应先为移动端、再为桌面设计，并给出三条理由：移动使用量快速增长；小屏幕的限制迫使团队确定优先级、只保留关键任务；移动平台提供定位、指南针、多点触控、加速度计等桌面浏览器缺少的能力。本词条的定义与"增长、约束、能力"三点据此转述；文中引用的用户增长预测属于当年的数字，本词条不作复述。
检索日期：2026-10-20 · 快照待确认作者的图书页面说明《Mobile First》由 A Book Apart 于 2011 年 10 月出版，主张网站与应用应越来越多地先为移动端设计，认为从桌面开始可能是一种越来越落后的思考方式，并介绍团队如何在组织、操作、输入与版式等方面从桌面转向移动设计。本词条据此说明这一立场的来源与关注范围。
检索日期：2026-10-20 · 快照待确认Ethan Marcotte 于 2010 年 5 月 25 日发表的这篇文章提出响应式网页设计，把流式网格、弹性图片与媒体查询列为其三项技术要素，用一套适应性的体验代替为各设备分别建站。本词条只据此区分：响应式设计是实现手段，移动优先是设计顺序与取舍的立场。
检索日期：2026-10-20 · 快照待确认定义参考以上来源；数字界面示例、选择建议、条件关系及配方由本样例编辑，尚未经用户研究验证。
类型扩展与实现说明
本词条尚无可操作示例；插画为编辑示意，以同一虚构页面从手机到桌面逐级展开来表现设计顺序，不代表任何具体的断点或框架。应用到产品之前仍须用真实设备与真实任务检查各尺寸下的取舍。
{
"values": [
"先决定什么最重要，再决定放多少",
"设计应从使用最受限的情境出发"
],
"tension": "小屏幕带来的聚焦与大屏任务所需的信息密度之间",
"questions": [
"如果只能放一件事，这一页放什么？",
"这次删减是位置的取舍，还是内容的取舍？",
"屏幕变大之后，用户多得到了什么？"
]
}打开本词条的 Agent JSON 文件这个文件原样收录本词条的全部字段，并附上来源、存档与编辑声明。