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.设计规范
问题来源：两人的水平不同，知识面不同，沟通往往要涉及大量的细节内容。
[读书笔记]让你的设计深入人心-- 可用性设计
最后，分享一张完整的读书笔记，来自我的小米便签。
网友评论