[读书笔记]让你的设计深入人心-- 可用性设计
Reading Notes: 让你的设计深入人心 -- 让你的设计深入人心
--注:笔记来源于《大巧不工 - Web前端设计修炼之道》2017.06.11
1.CSS2盒子模型黄金法则:box-sizing
a.如果某个盒子有填充,请不要给它设计高度;
b.如果某个盒子有宽度,请不要给它设计任何填充;
2.HTML5 select新增data属性表示数据来源。
3.可用性法则:Don't make me think
a.用户喜欢扫描而非阅读:我们擅长、不需要阅读全部、节奏快;
b.用户喜欢尝试性选择:按照自己的理解来,选择多半不是最佳选择,而是第一个自己认为合理的选择;
c.用户喜欢勉强应付:用户不关心产品内部机制,达标就好;只要能用就不去轻易地改变。
[读书笔记]让你的设计深入人心-- 可用性设计4.针对扫描而设计:
4.1层次清晰:页面有清晰的层次才能保证用户能在很短时间内熟悉你的页面。
a.通过加大字号、加粗字体、加深颜色来区分层次(案例:旧版淘宝移动页面订单列表);HTML标签的层次。
b.对于逻辑上或者业务上相关度高的部分要进行整合,不同逻辑性内容有明显的边界。
c.页面上体现包含关系。
4.2尊重习惯
尊重用户在网站上产生的习惯,降低学习成本。
4.3 明确能点击的元素
链接可点击的认知与引导,是否引导足够、是识别性强。
4.4 降低视觉噪声
5.信息架构:卡片法
[读书笔记]让你的设计深入人心-- 可用性设计6.标签云:由一套相关的标签(链接)以及与之对应的权重组成。需谨记:“链接生来不平等,我们要想尽办法让用户容易定位到那些重要的链接。”
7.设计有用的信息
提供无用的信息不但不能帮助用户,反而会伤害用户。
错误的信息设计并不是要设计“警告信息”,而是要设计“提示信息”,帮助用户解决使用中所出现的问题。
[读书笔记]让你的设计深入人心-- 可用性设计错误类型分两种:环境类报错、错误操作。预防和引导性提示。
8.系统一致性
在一致性的设计原则上,必须做到几个一致:视觉一致、操作一致、内外一致。
之前提过用户总是勉强应付,不到万不得已不会去求助系统,所以保持软件产品在概念、元素、视觉的一致可以使用户快速的了解产品,降低支持成本,从而减少用户犯错误的几率。
[读书笔记]让你的设计深入人心-- 可用性设计9.设计规范
问题来源:两人的水平不同,知识面不同,沟通往往要涉及大量的细节内容。
[读书笔记]让你的设计深入人心-- 可用性设计最后,分享一张完整的读书笔记,来自我的小米便签。