在小屏幕上,先照顾阅读

从字、留白和触达范围,重新看一遍页面。

先读完一段,再决定它够不够大

小屏幕的排版,容易把注意力都放在“装得下”上。可文字即使装进了页面,也可能读得吃力。字号、行长、行距和对比度会共同影响阅读,单独调大其中一个值,未必就能解决问题。

可以先选一段包含标点、数字和链接的真实正文,在手机上连续读完。留意视线是否总要寻找下一行、数字是否挤在一起,以及放大文字后内容是否仍按正确顺序排列。

留白应该帮助理解

标题和正文的距离,表达两者的关系;段落之间的空隙,给一个想法留出停顿。把每一处间距都放大,页面会变得松散。把每一处都缩小,层级又会黏在一起。

这次阅读实验只改变同一段文字的字号,让其他条件尽量稳定。这样更容易判断变化来自哪里。它不是对所有设备都适用的结论,也不会改变整站的阅读设置。

按钮要给手指留位置

桌面上好点的链接,到了手机上可能变得难以准确触达。实际检查时,要看可点击区域的范围,而不只是文字有多大;也要留意相邻操作是否过近,页面滚动时是否容易误触。

键盘操作也值得一起检查:焦点要能看见,移动顺序要跟阅读顺序一致,打开的内容要有清楚的返回入口。鼠标悬停不应是发现重要说明的唯一方式。

让页面适应内容,而不是反过来

  1. 在窄屏、横屏和平板宽度分别查看,不只检查一台手机。
  2. 增加浏览器文字缩放,确认标题和按钮没有互相遮挡。
  3. 使用较长的中文标题、网址和反馈内容,观察是否产生横向滚动。
  4. 关闭动画或 JavaScript,确认文章仍能读,入口仍能找到。

尺寸模拟适合发现布局问题,真实设备则能补上触控、键盘、浏览器栏和系统字体的差异。两种检查各有用途。

回到字号实验,自己读一遍

返回学习笔记