服务卡片在桌面整齐，到手机却拥挤，先查看内容关系与排列方式，再考虑间距和字号。三列缩成三张很窄的卡片，或把桌面内距全部等比缩小，往往不能保留原来的可读性。验收要让访客看清服务差别并找到下一步，而不只是把盒子塞进屏幕。
先把拥挤描述成具体问题
拥挤可能是标题异常换行、说明文字过长、图标挤压内容、按钮过近，或者卡片之间缺少分组。不同现象需要不同处理，不能一律归因于屏幕太小。
假设官网有多个服务入口，手机每张卡片标题占三行，说明与按钮贴在一起，用户可能难以比较。这时先检查卡片保留了哪些信息，各部分是否有清楚主次。重要差异缺失时，增加留白也不会让选择更容易。
给修改意见保留具体页面、宽度、卡片和现象。可以说明标题挤压图标、说明与动作无法分组，而不是只写“手机高级一点”。维护者能够对照真实内容，才知道哪项规则需要变化。
内容负责人、设计与开发应共同确认必要信息。删掉一句话可能让卡片轻松，但如果那句话是区分两项服务的唯一条件，就应重新表达或改变排列，而不是直接移除。
排列先解决结构，再解决细节
桌面多列与手机单列可以表达相同服务，但允许不同阅读顺序。变窄后若一张卡片已无法维持合理标题和说明，应讨论换列，而不是让所有文字继续缩小。相关操作可参阅《移动端官网不是 PC 缩小版：Google 移动优先索引下，响应式设计真正要保证什么？》。
不同数量也要检查。五张卡片的最后一排、只有一张时的宽度，以及某页只出现三项推荐，都可能改变版面。共享模块应根据实际内容说明排列，不需要为了整齐增加没有价值的入口。
JVDS 的合作卡片历史规范记录了桌面网格与手机自然撑高，并在后续调整手机间距和外观。这可作为共享组件需要分别制定规则的实际例子，不意味着所有官网都应该采用同一组像素。
排序同样服务比较。若最重要的一项在手机被推到很后面，应先看页面任务与内容逻辑。不要为了桌面对称而打乱手机顺序，也不要为了把最后一排填满复制卡片。
把内部空间和卡片间隔分开
卡片内距负责文字、图标和边界的关系，卡片之间的间隔负责分组。两者不应一起机械减半。内部太小会让内容贴边，外部太小会让相邻入口混在一起。
可以先看标题与说明、说明与按钮、卡片与卡片各自的关系。哪些需要保持，哪些可适度收紧，哪些需要重排，应有明确理由。不能用一组“所有间距统一减少”的意见处理全部层级。
图标是辅助识别，也可能占据不少空间。手机上如果图标仍使用桌面侧栏宽度，文字会被挤压。可以评估图标的位置和尺寸，但应保持内容可理解，不能把唯一识别元素删除后留下含糊标题。
动作区域应容易找到并操作。卡片若整体可点击，说明与入口关系需清楚；若包含多个动作，主次与范围更要检查。视觉变紧不能导致相邻操作难以区分。
使用最长的真实内容，而不是理想占位
同组服务名称长短不同，某些说明会在手机形成更多行。验收应使用正式内容，特别是最长标题、最详细说明和不同语言，避免设计稿整齐但实际录入后失控。
等高不应成为裁掉正文的理由。如果卡片说明需要完整阅读，可以让高度按内容变化，或重新组织内容。省略号只有在用户能明确找到完整信息且不损失关键判断时才适合讨论。
还要考虑用户放大文字。W3C 的文字缩放说明关注内容与功能保持完整。窄屏加放大后，固定高度更容易出现遮挡，应在项目要求范围内实际检查。
中间宽度也不能遗漏。某个页面在桌面三列正常，在手机一列正常，却在两列阶段拥挤。检查窗口连续变化，找到内容关系失效的位置，再确认断点与排列规则。相关操作可参阅《响应式UI设计怎么做？从断点到内容优先级的完整方法》。
状态变化不能破坏原来的密度
默认卡片整齐，触摸、焦点或强调后也应保持内容可读。边框、阴影与填充变化不应挤压标题或遮住说明。若某项状态增加了内容，需核对其他卡片的布局是否受影响。
纯导航卡片不应只有经过时才出现必要说明。手机上能否直接理解服务差别，应在默认状态判断。若使用展开方式，入口与展开后空间都要检查，不能把拥挤简单藏到第二层。
若卡片会跳转，应实际操作每一种目标类型。服务页、资料下载与表单可能有不同下一步，不宜全部使用同一句泛化动作。密度优化不能损害目标表达。
返回后也要查看页面。可能出现保留高亮、滚动位置改变或卡片重新排列等现象。是否合理需按真实规则判断，截图里整齐不代表操作过程完整。
还要核对图像和装饰是否占据了与内容不相称的空间。若图标很大、卡片说明被挤到狭窄角落，减少外部间距可能无济于事。先确认装饰为理解提供了什么，再分配空间，而不是所有元素都保持桌面比例。
两项服务说明如果长度差异很大，可以查看是否使用了不同写作层级。一项只有口号，另一项包含范围和条件，会让比较困难。内容规则可要求各卡片回答相同基本问题，同时允许必要长度差异，而不是强制相同字数。
如果某些说明确实需要较长篇幅，考虑在卡片保留判断摘要，详情页完整解释。摘要不能删除影响选择的重要条件，目标入口也要清楚。把内容藏到详情的目的应是支持深入阅读，不是让当前卡片无法做任何判断。
密度意见可以写“在当前手机宽度，标题与图标互相挤压，请改为上下关系，保持正式标题和说明完整，并复查同组长标题”。它给出了对象、原因与验证，而不是提出无法衡量的“松一点”。
更新后保留一组真实文字样例供运营试排。例子应含短标题、长标题和较长说明，并标出必要信息。这样下次新增内容出现异常时，可以判断是文案超过规则还是组件空间不足，避免反复随机修改间距。
用一条比较任务验收整组卡片
让测试者说出两项服务的区别，再选择其中一项进入。这个任务帮助发现标题、说明和入口是否协同。它不测业务转化效果，只检验当前信息是否足以支持基本判断。
记录犹豫发生在哪里：名称看不懂、说明相似、动作不清或位置难找。优先处理相关内容与结构，再调整间距。若只让测试者评价好不好看，反馈很容易回到主观颜色与留白。
样本包括最窄的项目支持条件、常用手机、变化中间宽度与较长内容。成功标志是必要信息完整、分组清楚、动作可用，卡片没有横向溢出或互相遮挡。未覆盖条件保持待测。
检查后也要看桌面。共用规则修改可能改变原来的多列布局、等高或按钮位置。优化手机不能默认桌面不受影响，复查范围应由实际改动决定。
给新增服务留下一套可维护规则
记录标题与说明的内容要求、允许的排列、内部与外部间距、图标位置、动作类型和长内容处理。规则应解释为什么这样安排，不只是列出几个数值。
新增卡片先用这套规则试排，核对是否真有独立服务差异。为了填满版面而增加重复入口，会让手机比较更困难。若一项服务需要更多解释，可在详情页承接，但卡片仍应保留必要判断信息。
运营替换文案后，在实际页面复查，不只看编辑器中的字数。真正影响密度的是最终字体、宽度和分组。超出规则时回到内容任务讨论，而不是继续降低字号。
一组手机服务卡片的完成标志，是访客能读懂差异、选择正确入口，团队能持续新增而不破坏关系。桌面整齐与手机易用可以有不同布局，规则围绕信息与操作就能保持一致。
常见问题
手机卡片应该都单列吗？
不是所有场景都一样。根据内容长度、操作和可比较性判断，当多列无法保留必要信息时再调整，不能只按设备名字决定。
保持等高可以截断说明吗？
需先确认说明是否含重要判断。关键内容不宜为等高隐藏，可以改写、自然撑高或提供清楚的深入入口。
缩小字号是不是最直接？
可能让内容暂时放下，但不一定可读。先处理排列、内容层级与空间，再考虑合理字号，避免让用户承担布局问题。
卡片整体可点，还需要按钮吗？
按任务决定，避免重复动作造成含糊。重要的是范围和目标清楚，并在实际触摸及键盘操作中确认。
调整间距后怎样知道完成了？
用真实内容完成比较与进入任务，检查不同宽度和状态，再复查受影响的桌面位置。单张整齐截图只能证明一个静态条件。
链接复制成功
