先给结论:移动页面上链接挤在一起,优先改的是“可点区域和行间分隔”,而不是先删链接。删链接会损失外链落点与内链路径,改间距和点击区只影响样式层,代价小、可回退。判断依据是:如果误点主要发生在相邻链接之间,说明问题在触控目标重叠;如果误点发生在整段文字内部,说明问题在链接密度过高,这时才需要合并或删减。
把手机宽度设成 360px 左右,打开你手上的那个页面,用拇指点最靠近的两个链接各五次。记录误点次数。
两种原因的区分证据很简单:前者在链接之间加 8px 以上垂直间距后误点明显下降;后者加了间距仍然误点,因为读者本来就在猜哪个词对应哪个目标。
适合链接都有独立价值、且每个链接指向不同目标页的情况。具体动作:
inline-block,让每个链接独占一行或占据独立矩形。min-height: 44px,并让整块区域可点,而不是只有文字可点。做完后回到 360px 宽度重测误点。如果误点降到可接受范围,下一步是检查这些链接的锚文本是否仍然能让人预判目标页内容——样式改好了,语义没改好,读者还是不敢点。代价是页面变长,首屏能放下的链接数量减少,对依赖密集导航的页面不友好。
适合多个链接指向同一目标页、或者链接只是装饰性导航的情况。做法是先列出页面上所有链接及其目标页,把指向同一 URL 的合并成一个,把次要导航收进折叠区或页脚。
假设一个页面原本在正文里放了八个外链,分别指向六个不同来源。合并后可能只剩四个链接,其中两个指向同一份资料的移动版和桌面版。这时页面短了,误点少了,但代价是部分外链落点消失,如果这些落点本来承担着向目标页传递链接关系的作用,就要评估是否值得。
判断条件:如果被删的链接指向的页面已经有其他入口,删掉代价低;如果这是唯一入口,优先保留并改样式,而不是删。
面对你手上的那个页面,按这个顺序做:
每一步的结果决定下一步:样式改动无效,才动链接数量;链接数量减少后仍挤,才动信息层级。反过来先删链接,可能删掉了本来只需要加间距就能保留的外链落点。
样式改动会影响链接的可发现性,所以改完要确认三件事:链接是否仍然可被正常抓取和跟随;锚文本是否仍然描述目标页内容;页面在窄屏下是否出现横向滚动。如果链接被收进折叠区,要确认展开操作本身不依赖悬停,因为移动端没有悬停状态。
最后,把改动前后的误点记录放在一起对比。如果误点下降但链接数量没变,说明问题本来就在触控目标;如果误点下降且链接数量减少,要确认减少的链接不是唯一入口。这个对比结果会告诉你,下一个页面该从哪一步开始改。