如何让拼图更易读、更友好

人脸、商品、界面文字和关键细节，如果是核心信息，就不要被挤进太小的格子里。

如果图片里有文字，一定要在手机尺寸下测试。看不清就应该裁得更紧，或减少图片数量。

不要把浅色文字放在浅色照片上，也不要把深色文字放在深色照片上。如果必须加字，可以使用简单底条，或把文字放到图片外。

背景色应该帮助图片形成边界，而不是和关键边缘混在一起。

图片太多会让每一张都看不清。表达重复意思的图片应该删掉。

好的可读性往往从取舍开始：更少图片、更清楚层级和足够间距。

用户常常是在快速滑动、通勤或小手机屏幕上看拼图。为疲劳眼睛设计，意味着减少互相竞争的细节，并保持清楚间距。

不要把关键信息只放在低对比角落。重要细节应该经得起快速一瞥。

如果一张拼图必须放大才能理解，可能需要减少图片数量或换一种布局。

图片里的文字对屏幕阅读器、翻译工具和小屏幕都不友好。重要解释最好也出现在页面正文或配文里。

如果必须把文字放进拼图，使用短标签、高对比度和一致位置。

不要只靠颜色解释分类。颜色差异最好配合位置、标签或图片内容一起使用。

对读屏软件来说，一张拼图就是一幅图，所以描述要涵盖整体的要点。描述它的用途和关键内容，而不是逐格描述，例如：四张修复橡木桌的照片，依次为打磨前、打磨后、上色后和放进完成的房间。一两句话就够了。

平台提供替代文本字段时就填写；没有时，把同样的信息放进说明文字或帖子正文，因为图片里的文字无法被可靠地朗读或搜索。如果图片里有关键文字，请在说明里重复一遍。

措辞要客观。“漂亮的拼图”这类说法对读者毫无信息量，罗列没人需要的细节也只是噪音。好的替代文本回答两个问题：这张图是做什么的？看不到它的人会错过什么？

对比度是可以测量的。普通大小的文字与背景的对比度至少要达到 4.5:1，大号文字至少 3:1，这是 Web 内容无障碍指南（WCAG）使用的数值。免费的对比度检查工具可以在几秒内比较两个十六进制颜色，不必在明亮的显示器上凭肉眼猜测。

照片作底的文字对比度不均匀。把文字放在纯色条带或明显偏深或偏浅的区域上，而不是直接压在细节上。如果文字必须在照片上，就在后面加一块纯色或半透明的底板，并在手机尺寸下重新检查。

不要把颜色作为唯一的信号。如果绿色代表完成、红色代表待办，请再加一个对勾或文字。大约十二分之一的男性和两百分之一的女性有某种形式的色觉缺陷，所以只靠颜色的编码会让比想象中更多的读者读不懂。不依赖颜色的层级设计可参考构图规则。

让别人只看五秒，或自己快速瞥一眼，然后问这张图在讲什么。如果答案很模糊，说明层级需要加强。

在手机尺寸下重复测试。很多可读性问题只有缩小后才出现：文字太小、对比弱、格子拥挤、主体边缘不清。

先修复最影响理解的一点。不要一次全部重做，一个层级或对比问题修好后，整张图可能就清楚很多。

易读的拼图不只帮助有特殊需求的用户，也帮助所有观看者。清楚层级、可读文字和强对比，会让图片更快被理解。

把最小观看尺寸当作真正测试。如果拼图在最小尺寸下成立，通常在大尺寸下也没问题。