程序员的修炼-03-Web 设计原则

本文是 <程序员的修炼-从优秀到卓越> 的读书笔记的第三篇，这本书的作者是 Jeff Atwood，StackOverflow 的创始人之一，Jeff 的文章涉及面很广，他是一个经验老道的 程序员 、管理者、创业者，这本书谈到了编程之外的很多东西，不管你是初级工程师，还是资深工程师，本书都值得一读。随着你的阅历的增加，每一次重读这本书，都会有不一样的感悟，正如书名“从优秀到卓越”，作者为你指明了道路，至于是否能成功，则要看自己的修炼了。

我会把读书过程中一些精彩的言论摘录下来，有时会加入一些自己的见解或者经历，读书笔记的大纲与书本身的大纲是一致的，这也是我从另外一个地方学到并一直在用的“如何阅读一本书”，记录下来方便自己经常查看，也方便读者查看。下面是<程序员的修炼-从优秀到卓越> 读书笔记系列：

1. 程序员的修炼-01：绝地反击之术
2. 程序员的修炼-02：编程之道
3. 程序员的修炼-03：Web 设计原则
4. 程序员的修炼-04：关于测试的一些思考(未完成)
5. 程序员的修炼-05：了解你的用户(未完成)
6. 程序员的修炼-06：互联网那些事(未完成)
7. 程序员的修炼-07：游戏与编程(未完成)
8. 程序员的修炼-0：阅读之美(未完成)

网站的评判标准

作者在做网站的评委的时候，每个参赛的网站只有 30s 的时间，对于此：“在 30 秒内作出评判是完全不公平的，但那也恰恰反映了现实世界中的真实情况”

作者给参赛的提了一些建议，你的网站首页需要给人一种眼前一亮的感觉：

1. 加载速度要快，尤其是移动互联网时代，超过1s 用户就会失去耐心
2. 这到底是什么东西？不能让进来网站的用户云里雾里，让用户一进来就知道这个网页是干嘛的。
3. 给我看一个例子
4. 清清楚楚告诉我要做什么，并且扫除障碍
5. 拥抱你的受众，即使这意味着要把其他受众排除在外

在任何 Web 应用中，设计首页的基本草图是你应该做的第一件事情，因为他是至关重要的初始设计文稿，也是你的远景声明。

追求简单

追求简单更在于把简单进行到底，从雅虎首页和 Google 首页的历年对比来看，Google 在首页做到了非常克制的简单，而雅虎的首页越来越复杂，信息越来越多，现在来看，这简直就是门户网站的“灾难”

Google 的简单，是把复杂的事情放在了背后，而不是一股脑推给用户

应用会取代网站吗？

我们应该从简单设计入手，必要时按比例放大，而不是一开始就把事情搞得很复杂，然后被迫收缩，这与目前 Moble First 的设计理念类似。

为什么应用比网站更好？

1. 运行速度更快
2. 使用简单的原生 UI 控件
3. 更好地利用了屏幕空间
4. 更适合于移动环境，甚至离线的情况

为什么网站比应用更好？

1. 网站可以运行在任何设备的浏览器上
2. 网站不需要安装
3. 网站不需要手动升级
4. 网站提供了统一的用户体验

从上面的对比来看，其实是各有利弊的，不过我们也可以看到后续的发展，网页和 App 会越来越接近，其开发语言、运行环境越来越一致，各种跨平台的框架让 App 和网页的开发不再差异巨大，随着移动互联网的普及，任何 App 和网页都会是以移动设备优先的角度去开发的。

网页和 App 的界限会非常模糊，最后统一。

切记墨守成规

我们需要采用正确地做事方式，而不是标准的做事方式：

1. 全面了解当前的规范以及它形成的缘由（知其然知其所以然）
2. 偏离这个规范需要有理有据
3. 在实验过程中收集用户使用数据（AB Test）
4. 基于数据做决定

做 Android 系统优化最好也遵循上面的步骤，先弄懂代码逻辑，再弄懂代码为何这么写，然后再去思考如何优化，这期间就需要找到瓶颈，作出修改，拿到用户数据，对比用户数据选择最优解。

诡异的单键设计

iPhone 的单 Home 键设置一直饱受争议，因为这使得后退这个操作比较复杂，在屏幕比较小的机器上还好，可以手势操作，但是在大屏幕机器上，后退到上一页非常不方便，你不得不用另外一个手来进行操作。

可用性并非阳春白雪

如果你的项目里面没人关心可用性，那么记得项目注定会失败。

1. 可用性测试是人们为改进网站所能做的最有效的措施之一
2. 既然大部分组织均有财力请专人来从事常规性的测试工作，每个人都应该自己学着做可用性测试

作者推荐了一本书：《用眼动追踪提升网站可用性》，感兴趣的可以买一本看看

费茨定律的另一面

费茨定律: 一个东西越大，离光标越近，它就越容易被点击。

作者概括了一篇“Visualizing Fitts’s Law” 的文章的核心思想：

1. 把常用的 UI 元素摆在屏幕的边缘，因为光标自动停留在屏幕的边缘，这样的话，那些 UI 元素将更加容易被点击
2. 让可点击的区域尽可能大。目标越大，越容易被点击

同理，如果有的必要的按钮你不希望用户点击，那么做小一点总没有错， 要让不常用或者危险的 UI 元素难以被点击

可用性与易学性

网站的写作应该采用“倒金字塔”的风格： 在文章的开头先把结论告诉读者，接着再写最重要的辅助信息，最后才介绍相关的背景。

毋庸置疑的是，你应该尽量吧最重要的信息放在顶部，不管你是做一个网页，写一段程序，写一封电子邮件，还是做一份简历，等等

另外作者推荐了一本书 写给程序员的UI设计指南 ,感兴趣的可以看一下

只是多一个

如果你想再加一个什么 UI 元素，请确信，你所加的那个 UI 元素不是压倒骆驼的最后一根稻草

敢于说不

创新并不是要接受所有的东西，而应该对除了关键性功能之外的所有东西通通说不。

用户界面很难做

这里主要说的是程序员在做用户界面的时候，总是很粗糙，不易用。不过从现在的发展来看，用户界面设计不再那么困难，各种美观的界面框架可以非常容易的套用。