1、网页设计的可用性原则,交互设计初体验,一、了解网页设计的可用性定律,1、网页设计的可用性定律,2、强迫我们思考的地方,2、强迫我们思考的地方,我们不该让用户花时间思考的事： 我在什么位置？ 我该从哪里开始？ 他们把放在什么地方了？ 为什么这个东西叫这个怪名字？ 这个页面上什么是最重要的？ ,2、强迫我们思考的地方,当我们访问WEB时，每个问号都会加重我们的认知负担。当这种负担积累到一定程度时，我们会毫不犹豫的离开。 在网络上，竞争有时就在一个点击的差别。如果你得罪了用户，他们会跑到别的地方去。,二、用户实际上是如何使用WEB的？,FACT 1：不是阅读；而是扫描,FACT 1：不是阅读；而是扫
2、描,我们为什么扫描？ 我们总是处于忙碌之中； 我们知道自己不必阅读所有内容； 在日常生活中，我们善于扫描。,FACT 1：不是阅读；而是扫描,我们扫描的焦点通常会放在具有以下特征的文字或短语上： 1）：与手头任务有关的； 2）：我们当前或接下来的个人兴趣； 3）：易普遍引起大众兴趣的词。 我们在网页上看到什么，取决于我们自己想看到什么。,FACT 2：不做最佳选择，满意即可,满意策略：大多数情况下，我们不会选择最佳选项，而是选择第一个合理的选项。 我们总是处于忙碌之中； 即使猜错了，也不会产生严重后果； 对选择进行权衡并不会改善我们的机会； 猜测更有趣,人们在使用某个东西，但并不理解它的工作原
3、理，甚至完全误解。 很多人完全不是以设计师设想的方式使用网络和软件，但他们用得很好。,FACT 3：勉强应付，不追根究底,三、创建能够自我解释的网页,面对疾驰而过的用户,每个页面上都必须建立清楚的视觉层次； 尽量使用习惯用法； 把页面划分成明确定义的区域； 明显标识可以点击的地方； 最大限度降低干扰； 优秀的导航系统。,1、建立清楚的视觉层次,越重要的部分越突出； 大号字体/加粗/特别颜色/接近页面顶部/旁边留白 逻辑上相关的部分在视觉上也相关； 逻辑上包含的部分在视觉上嵌套；,2、习惯用法是好的帮手,习惯用法之所以成为习惯，是因为好用。 设计者常常不愿使用习惯用法。 如果使用创新的用法，必须
4、保证： 1）新用法与习惯用法同样不言而喻； 2）带来很大的价值 尽量使用习惯用法。,3、页面划分成明确定义的区域,用户在扫描时获取更多信息： “这是今日头条” “这是最新推出的产品” “我从这里可以注册并登录。” 让用户很快确定关注哪些信息，或者放心的跳过哪些区域，提高使用效率。,4、明显标识可以点击的地方,Click！ Click here to 我国南方将遭受大范围雨雪天气 特别的颜色（不推荐） 鼠标滑过的效果 小三角箭头的用法：,5、降低视觉噪声,眼花缭乱、适得其反 不要让所有内容都试图得到用户的注意 省去不必要的文字 欢迎词 指示语 背景噪声,6、优秀的导航系统,寻找目标时，先询问还是
5、先浏览？ 如果选择浏览，导航系统将引导你在站点的层次结构中穿行。 Web空间的奇怪之处更凸显了导航的重要：无法感知大小；没有方向，只有层次结构；感觉不到位置。,6、优秀的导航系统,导航的用途常被忽视：营造空间氛围，给我们脚踏实地的感觉；它告诉我们当前身在何处。 优秀的导航系统：让站点ID出现在页面可视层次的首要位置；让一个返回主页的按钮（HOME）始终可见；站点ID也可以同时作为返回主页的按钮； 实用工具；1、2、3 面包屑和选项卡,四、主页的控制,1、主页要完成的任务,站点的标识和使命； 站点的层次结构； 提供搜索是必须的； 导读（内容简介、产品推荐） 内容更新； 必要的快捷方式； 注册及登录状态的提示； 友情链接。,2、主页控制中常见的约束,谁都想占有一席之地； 想要参与的人太多； 一个页面要适合所有人。,五、页面的测试,像绑架一样的测试方法,对于站点内任何一个页面而言：这是什么网站？（站点的ID）我现在哪个页面上？（网页名称和层次关系）这个站点的主要栏目有哪些？在当前层次上，我有哪些选择？（导航）我如何搜索？,作业点评,
