■ 互联网的每次革新其实信息组织形式的革新，而不是技术革新。技术革新、科技革新的背后是人们观看事物的角度发生了变化。

■ 一般做一个网站都会先看看同行怎么做。但如果同行怎么做你也怎么做的话你的网站肯定不会更成功。从别人那里学习，然后拿出不一样的东西。

■ 如果你完全遵照统计得来的“用户习惯”来做也不行，这个设计不可能达到最好。好的设计能超越用户习惯，比他们的习惯进步一点点，培养用户新的习惯。

■ 用户第一次来你的网站，你要想办法让他们了解到你的网站能为他们带来什么价值——必须是可以让人理解的价值。培养信任度，让他产生好奇。用户第一次使用你的网站，多少都会有一点不习惯，不会使用，一时找不到要的东西。当用户理解你能为他们带来什么好处时，当他们信任你时，他们自然会花点脑筋兴致勃勃地学习一下。用户不是白痴，只是往往没耐心。

■ 当然，我们的界面就需要提供适当的缓冲，让他能继续玩下去。

■ 使用不习惯造成的挫折感很大程度上源自不信任。

■ 让用户感觉自己学到东西，这样的设计才有粘性。如果他们觉得你的网站面目模糊，找不到特点，糟透了，转身就把你忘记了。

■ SEO（搜索引擎优化）的作用是配合搜索引擎，想办法把用户真正需要的东西推荐给用户。

■ 对人没好处的任何行为都不将长久。

你可能感兴趣：

1. 屏幕分辨率与布局
2. 上海人如何购买世博门票
3. 密码明文输入？

这文章噱头比较大，但有点问题。在PC上，用户难以预测何时会有人偷窥密码，假如增加一步是否需要密码遮蔽的选择，又增加了用户的输入负担。此外，简单密码的倾向不完全是密码掩饰造成的，往往是用户觉得密码难以记忆。大部分人习惯于用一到两个密码反复使用且没有过一阵子更改密码的习惯，主要是因为确实麻烦，且没有必要。即便你改用明文输入，背不出密码的依然背不出。误操作的还是误操作。对于邮箱很多的用户来说那些用邮箱登录的网站就是麻烦，有些人明文的邮箱也会时常输错。而对于名字众多的用户来说也有识别障碍。浏览器的自动填表功能解决了这一系列问题。但有些用户除了自己的大脑不信任任何东西，坚决不采用自动填表……问题是很复杂的，情况多种多样。

但是一切设计问题都要围绕特定产品展开。我们讨论灯罩该不该用方形没有很大意义。如果细分到新巴洛克风格的卧室落地灯是不是该用方形灯罩就具有讨论意义。脱离具体情景空着想好像都有道理，仿佛事情很清晰。

银行密码绝对要遮蔽，毫无疑义。用手机号码加密码登录的中国移动也需要对密码进行遮蔽。但凡涉及钱财交易和用户真实身份的网站需要绝对安全，至少要装样子让用户感到自己处于安全状态。但有些不涉及钱财交易的网站就不需要这么麻烦。比如你在一个blog留言，在一个虚拟社区娱乐，密码只会带来负担。其实只要一个识别个人身份的特殊标识即可。形式无所谓。由于盗密几率低，密码简单一点其实无所谓。可以省去密码的应当省去。话说有些管理员后台可以看到用户密码。遮蔽的密码真的无人知晓吗？

遮蔽密码不是为了增加用户输入负担，也不是为了防止偷窥。很重要的一部分原因是让用户用得安心，让用户自以为很安全。你得知道你在干什么。关键是根据你的网站定位来设计每一个细节——包括密码输入。而不是在PC上盲目采用明文密码输入。

你必须知道你在干什么。不是看别人怎么弄的自己也怎么弄。也不是光听用户说。我不觉得哪个灯饰设计师是盯着一堆用户调查数据完成了设计。

我以为这篇文章诞生的一大原因是作者本人体验过了手机端密码输入。我体验过几次招行手机支付平台，经历过该平台的改版。在手机端，我坚决抵制密码完全遮蔽。当前输入字母可见也是不足取的。手机操作请先将多余功能屏蔽。比如有一版手机支付平台的输入方式切换和屏幕缩小调整共用了同一个键，在用虚拟鼠标选中输入框并输入第一个字符前该按钮为缩小键，输入第一个字符后变为输入方式切换键，且此时方提示当前输入方式。但是不少人习惯选中输入框后立即切换输入方式，于是屏幕缩小了，不知道该如何放大了。事实上缩小功能并不那么重要，至少不会比放大功能重要，但是12个基本键按了一圈都不见放大。

也有不少人会无法理解表示“_年_月”的输入框居然还能输入字母。假如和PC上一样仅可以输入数字那么操作还是比较流畅的，但是此处可以输入字母，于是用户必须切换输入方式，或者狂按每个键多次以调出数字。由于仅最后一个字母看得到，假如你输入过快，根本意识不到自己输入错误。无法理解的是，我们的银行密码仅限于6位数字，那何必增加字母甚至符号输入？另外，偷窥手指动作比偷窥输入的文字内容更容易。遮蔽密码有何意义？最安全的方式就是加快用户输入速度，让用户赶快输完离开页面。这样用户使用起来也高兴。手机这东西限制过多，不是人人在全键盘，人人在手写。等人人手写了直接签名识别算了，也不要搞什么考验记忆力的密码输入了。

话说回来，越快越安全原则在手机上适用，那么在PC上是否也适用？个人电脑还是自动填表吧，要么勾选记住我。

你可能感兴趣：

1. 屏幕分辨率与布局
2. 上海人如何购买世博门票

1 邮局

邮局门店最多，但跑到就近的一家一问，人家不出售指定日门票。某邮局指定窗口没有明显标识，工作人员说指定日门票要5月1日才出售。那我就想了，今年五一已经过去明年五一世博会已经开门，敢情邮局没油水不卖打折票。

2 交通银行

本人没有交通银行借记卡，也无交行信用卡。嫌提出几百元钱再去交行排队购买太麻烦。交行其实不错的，将世博会门票购票归入公司服务，不像中国银行出售奥运门票时那样特开窗口，给足个人购买者面子——公司窗口你用过没？做梦也没用过。

不去门店还能打电话，接线先生嗲得不得了，比周立波还嗲，特别亲切，但是没交行的卡免谈。不过网上购票可用银联卡。送货也快，市区内EMS，5天，就到了。一般2046淘宝店买碟片市区内都是一天，我们交行5天，每天发的票多嘛，已经特快了，别叽歪。

3 中国移动

电话购票需要开通手机钱包服务。我就上网查，什么是手机钱包？手机里还能装钱啊，人民币还是美金？于是查到这个手机钱包介绍页面，在Firefox3.0下显示效果如下图所示：

我惭愧啊，用什么Firefox啊，你不知道中国移动不认识W3C啊，FF算什么东西，行规算什么东西，外国人想出来的东西中国移动全不放眼里。什么东西，看不懂不要开通，随你便。

于是乎我决定网购。首页没找到站名，绕圈在公告里找到世博-移动商城地址，准备登录一下，一看，中国移动就是牛，密码输入是明文的，假如我们公司有人做个B2C密码输入还是明文的，你这鱿鱼都炒焦了，中国移动不一样的，计算机毕业去中国移动那就是赚大了，我当年年少无知太傻冒了。（关于密码是否需要明文输入另有新日志讨论）

相关帮助页面配图还是用word排版的，回车符号和错别字鉴别波浪线都在。

我是不敢在中国移动买的。为什么？你觉得安全有没有保障？明的东西也做不好你觉得看不见的安全防范他们有没有做过？你觉得网络欺诈手机诈骗怎么搞起来的？你当连裆模子和敲边模子是假的啊，单脚跳？朋友，帮帮忙。

更正：友人原来是在电信买的，因为不敢在移动买。

4 中国电信

中国电信电话服务7*12小时，9:00-21:00。于是我享受不到了。我不是太阳系的人，十点十一点月亮出来了我开始活动了，我狼人。

那我就网上购物看看。找到了号码百事通指定日普通票页面，这详情做成标签切换形式，其中，配送/退换/支付、积分说明、促销活动三块内容与标题相同，等同于没有内容。

我想么中国电信思路勒清，这种阿猫阿狗都知道的内容就不写了。我点购买按钮，没有任何反应。噢，中国电信不给狼人提供服务的，顿悟。

补充：我个朋友买了，页面告知支付错误。再买（这是玩心跳，大家为我朋友鼓掌），再次支付后跑到一个页面说本系统尚处于测试阶段。支付到底成功没？不详。后来电话联系瞎搞八搞发现支付成功了，15天内出票。15天？我马上问我朋友，这是什么慢递啊？现在你相信了吧，交行和中国邮政效率很高的，超乎想象。

再补充：IE下确实可以运行。原来有个弹出框，可能脚本没写好，没有做基本的浏览器兼容性测试。

以上测试日期为2009年7月9日，中国移动word图表在此之前。我知道我国计算机工作人员革新很快的，等本日志见光后已经改邪归正。想买世博门票的人总归买得到的，人家电视广播网络不是宣传了么？销售火爆，送票到家，四大途径，异常方便。

噢，不要忘记上世博会官方网站。

你可能感兴趣：

1. 屏幕分辨率与布局
2. 有多少个上海ATP1000大师赛官网？（更新）

屏幕分辨率给我们带来哪些困扰？

曾几何时800X600是标准尺寸，2008年出到第三版的《写给大家看的设计书》（The Non-Designer’s Design Book）中提到Web设计时还说千万不要让你的内容超出800X600的范围——这曾经很有道理，但现在听上去就像在胡扯。根据UCD与会人员提供的数据显示，1024X768的分辨率可能占到30%至40%，但其他类可能占到同等比例。包括尺寸未统一的上网本、1920X1080的高清电视屏、各种各样的宽屏，甚至手机的小屏幕。一片混乱，有时候你都无法确定统计表该如何制作，列出哪些项更好——“非主流”的屏幕分辨率各自所占比例不高，汇集起来确实一个很大的比例。

面对的对象过于复杂，不可能面面俱到，所以首先需要归类，考虑主流的几个分辨率，其它一概忽略不计。

宽度问题

假设以1024X768为基准，宽度问题则分为小于1024与大于1024两种。

大部分与会者认为未来的趋势是大于1024，虽然国内还有人在用800X600，但势必逐渐减少，所以设计时可以不予考虑。目前流行的960px定宽就明显没有顾及800X600时会出现的左右滚动条。这个问题和现阶段写样式是否要顾及IE6类似。虽然已经肯定遭淘汰，但目前还有并不算少的用户在使用（IE6依然是目前中国最主流的浏览器，使用率过半，看上去问题比小分辨率严峻地多），我们就不应当让用户浏览网站时手足无措，感到自己被遗弃。个人建议应当保证网站最主要的内容可以在800px宽度下显示。比如你定死1000px的宽度，最右侧的一列就可以是广告或相对不重要的内容，这样分辨率为800X600的用户也无需反复左右拖动滚动条。或者你可以直接采用自适应布局。但是对信息量稍大的网站而言自适应布局很影响整个页面的排布，因为你的内容（文字或图片）都是固定大小的。（你不敢把字体设置得更灵活，因为你知道不同浏览器的基准字体大小不同，对“更大一些”和“更小一些”的解释也不同，灵活意味着会出乱子，那还不如让用户用Ctrl+或Ctrl-自行调整字号。但许多用户不会这招，有些浏览器会自动调整页面大小适应屏幕，于是你不得不在字号时同时考虑万一字号增大会产生怎样的效果。）自适应势必面临页面的重新布局，分辨率小的时候有些地方会拥挤，分辨率大的时候会出现不和谐的留白。你需要让你的设计变得更灵活。

分辨率大于1024X768的，主要采用自适应或定宽加修饰性背景图片来解决。你可以用一张照片作背景图，并让背景自适应屏幕。你还可以在固定宽度（比如960px）之外使用漂亮的背景图，让宽屏用户看到更多内容，但这些内容是防止宽出来的部分过于单调而特别设置的装饰性内容，并不是网站的主要内容。

宽度过大和过小的问题其实有内在联系。虽然宽出来不少，但我们的视线范围只有那么一点。如果用户浏览你的网站需要转头或者大幅度转动眼珠，他们应该不会再一次上你这儿来自找麻烦。

也就是说，用户和PC屏幕之间的距离和PC屏幕大小之间的比例如果基本不变，分辨率造成的网站设计宽度问题就不是一个恐怖的问题。注意主要内容所在的位置和宽度，注意修饰性内容如何表达，一切元素由核心内容为中心点散布开来，用户看到的边角内容肯定不同，但不会影响整体感，也不会让用户看不到应当看到的内容——比如导航条。

需要特别注意的是在高清电视机和手机屏幕上浏览网站。对电视机而言，应当有一个显示比例调整。不会说宽度为960px的网站真的会局促在分辨率为1920X1080屏幕的中间。面对屏幕较大的电视机我们会离得比较远，这之间的比例换算不应留给设计师。

而手机屏就需要重新设计了，这是最没争议的地方。无论你的手机屏幕有多大分辨率有多高，目前的手机看起来都不适合展示过多内容。

不过如果你的网站架构清晰，可能会省一点事。不妨丢掉样式再看你的网站，重要的东西是否显示前面，网站层次是否清晰。比如h1之类的标签使用是否合理，几个输入框的前后次序有无问题。有时候手机浏览网站会浏览到一个无样式的简洁版本，你必须方便用户只按上下键就能顺利浏览。同时还方便了使用RSS阅读的用户和有视力障碍需要使用屏幕阅读的用户。

这里引申到另一个问题：无样式或样式丢失时的显示问题，此时为宽度零限制状态。你的用户网速可能很慢，加载时间比较长，你需要考虑如何让最重要的东西先加载，让他耐心等待下去。也可能用户没有加载到样式表，此时你的界面要做到条理依然清晰。或者你的用户在某些特殊的显示模式下浏览网站，你要保证界面依然友好。

除此之外，本次会议上并未讨论屏幕分辨率和打印效果之间的关系。假如你的网站宽度过大，而纸张依然是A4大小，会不会影响用户的打印效果？建议为手机写一个样式后再为打印特别写一个样式，对文章重新布局，以适应打印需求。其中，需要调整行距、字号等细节。对于整站打印，免不了需要考虑宽度问题。

高度问题

除了宽度问题，还有高度问题。在过去，宽屏变宽改变的是宽度，高度一般不变。但现在某些宽屏比例过分，高度也会适当下调。此外还出现了上网本，它的第一屏可见高度甚至会在500px以下。于是我们想要第一屏在高度上符合黄金分割变得比过去困难。如果你将最主要的内容都放在500px以内，空出来的地方就要搭配得当，否则1280X1024的用户会觉得头重脚轻。但是为了不增加用户思考成本，一些主要的内容（比如非常大的支付按钮）必须在第一屏看到。此时你只能采用更讨巧的设计。让高度比较小的可以看到完整LOGO、完整导航，以及主要内容的主要部分。让高度“正常”可以看到一个在高度上也符合黄金分割的漂亮页面。让分辨率特别大的用户可以看到更多内容，但依然符合比例。咨询类网站考验排版功力，当水平方向比例得当、垂直方向对齐充分，上下拖动滚动条时和谐不会被打破。就像版式做得很好的报纸，折起来看不一定就比摊开看来得不爽。因为匀称的比例体现在每一个细节上，每一个局部上。

页面过长的时候你可以让重要元素在底部重复出现一次。页面过短的时候可以让底部内容浮于最下方，不过如果分辨率过高的话这种做法有可能会损害垂直方向的布局。如果你的核心显示内容是一张非常大的图片或其它一些在高度不够时冒着显示不完全风险的元素，请修改你的元素，或者让该元素的核心区域变小。比如一个不提供拖动效果的弹出框必须小巧到能完全显示，否则就是设计失败。一些客户端软件同样需要考虑这些问题，重新组织内容，必要时增加动态效果。

提到内容，需要明确一点，网站的内容必须适合在线阅读。比如菜单标题在3到30个字之间，一级菜单有多达20个标签，此时你需要重新确认内容再着手设计。我们的报纸标题字数都是精心设计过的，网站一样的道理。只是许多用户自行提交的内容会主题不明，长度不一，你需要在美感和阅读性上取平衡：省略标题多余字数增加了阅读负担，即便鼠标悬停显示完整标题也不如重新组织语言更让人赏心悦目。如果你的网站有用户参与，你需要考虑的细节将翻倍。

规模小一点的网站往往处理起来方便一些。比如在高度和宽度上同时采用自适应，局部文字区域使用滚动条。这些区域往往不会很大。或者直接采用横向拖动方式，这样的网站容易让人印象深刻。高度自适应的难度没有想象中大，横向拖动需要在页面上配按钮，不要让用户左右拉滚动条或者好奇为什么不能上下滚动。

Flash网站一般都会完全居中。Flash很好地解决了分辨率问题，虽然缩放效果并不总是随人愿。

总结

最后总结一下。

无论屏幕分辨率是多少，我们都需要注意：

• 在最黄金的区域——无论什么分辨率肯定能在第一屏看到的区域——显示最重要的内容，找到视觉中心。黄金区域根据人的视觉习惯而定，最佳显示区域并不等同于屏幕的宽度。
  
• 与编辑、浏览器提供商、硬件生产厂商协同解决显示问题，在没有解决方案的前提下采用巧妙的设计以满足第一条。比如增加动态展开效果。
  
• 考虑各种可能的情况，保证主要内容显示正常，主要功能完好，必要时进行特殊处理。比如手机阅读。
  
• 美化你准备抛弃的非重要区域，不要让它们以未设计过的姿态示人。
  
• 具体问题具体处理，没有一种解决方案适用所有网站。
  

现实生活中我们面对的对象通常大小固定。设计书籍时我们会固定书籍尺寸，画图时画布大小固定。有时候我们可以自行确定对象大小，有时候又会遵守一些约定俗成的尺寸规范。但Web设计面对的对象大小不一，充满未知。此时需要重新裁切画布或移动取景框位置，让不同大小的取景框都能看到最佳景致。