发表于: 2019-01-12 21:09:25
1 916
今天完成的事情:
修改了编程王部分图
明天计划的事情:
编程王
遇到的问题:
暂无
今天的收获:
移动端字体7准则
1. 留足空间
一种层次在影响着行或段落的视觉流 这是特殊的层次:字母间距小于字间距 字间距小于行间距 以此类推
要在移动端创造最佳易读性 尤其要注意这些特殊层次 这些格式塔式的词语 行 段落的文字组合 在自然光
环境下同样至关重要
2. 行宽
行宽是一行文字的长度 众所周知 舒适阅读的理想行宽是65个字符左右 在桌面端浏览器中 65个字符很难触
及边缘 在移动设备上 你必须得缩减行宽 移动端并没有普遍认可的行宽标准 不过传统上 报纸或杂志上每一
个窄列都会趋向于39个字符 鉴于这个理想行宽已经经历了数个世纪的考验 它在移动端字体上也运转良好
3. 宽松行距 紧凑行距
行距是行之间的空间 行距太紧凑 会让视线难以从行尾扫视到下一行首 行距太宽松 字间距会开始形成队列
产生了我们通常意义上的河流,阻断了行的视觉流 从左至右: 理想行距 太紧凑 太宽松 在屏幕上表现良好
的字体都有一个关键特征——大的凹槽 大凹槽需要更大一些的行距来保持空间层次 反过来 更短的行宽需
要更小的行距 所以你可能需要将桌面端的行距设得宽松点 同时记得将移动端的设置得紧凑些
4. 找到最佳状态
所有字体至少都有一种最佳状态 在屏幕上展现最佳的尺寸 还有在浏览器中最能保持字形的抗锯齿选项 最佳
状态下 多数笔画通常都能排列在像素网格中——像素字体 如果你还记得的话 那些字体仅仅在字号调整到最
佳状态下才有效 将字体设为最佳状态能形成更强烈的对比 为移动端设计时 对比尤其重要 因为户外的强光
可能分散注意 从易读性研究中 我们知道大脑识别的是文字顶部 而不是底部 所以要成就更加平顺的视觉流
我们要确保字符顶部最契合像素网格
5. 不要忽视起伏边
起伏边是一段文字的边缘 你读的多数内容是居左对齐的(至少对于拉丁语系而言)导致右边沿参差不齐 从左至
右 左对齐 居中对其 两端对齐
6. 减少反差
增强文字与背景对比的同时 我们也要减少不同层次文字间的反差 在移动端 实际可见的文字更少 所以反差被
放大了
7. 按比例调整字间距
为移动端调整字号时 我们要意识到字间距发生了必要的变化
总结
假如你追求易读性 要牢记三条原则 行内的视觉流要平顺 空间层级要清晰 要有足够的对比 这尤其适用于移动端
页面 没有不可撼动的规则 全凭你双眼决断 不过本文的指南可以作为理想的出发点 让你在移动设备上优美地排
列文字
评论