第五讲：Web用户体验解构（下）.ppt

7、验证码 7、验证码 7验证码 为什么需要验证码 验证码带来的困惑 其他方式 Page ? * 谢谢！ * * 3、翻页设计 3、翻页设计 3翻页 第一页 最后一页 上一页和下一页 页码显示的数量 翻页区域的醒目度 增大可点击区域 页码的间距 当前页码和总页码 快速跳转 Page ? * 翻页是页面中最常见的元素之一．当内容数量较多，不能在一屏内显示完整时，翻页能够将内容分页显示．并通过页码帮助用户找到所需内容的有效元素，尤其多见于列表页面． 虽然所有页码的呈现方式都非常类似，但细节的差异，却能够帮助用户更加快速地找到所需要的内容，减少操作步骤．甚至提高PV（PageView．页面浏览量）-．通常．翻页包含具体的页码．第一页．最后一页，上一页，下一页等多个元素．需要综合分析用户的使用场景来设计这些细节 Page ? * 1.第一页 　 第一页通常呈现必威体育精装版的．最热门或者网站最希望推广给用户的内容．所以在设计上应该相应地突出第一页．目前网站对于第一页通常有3种不同的设计方式． ·始终保留第一页的页码 ·设计成按钮，通常以‘首页。或’“的形式展现 ·不保留第一页的页码 前2种方式较为类似，只是设计细节不同．适合于第一页的内容会时时变化．用户仍需要返回第一页进行浏览或者定位的情况． 第3种方式适合用户聚焦于当前浏览页面附近的情况，而且用户已经浏览过前面的内容，返回前面重新浏览的可能性较小． Page ? * 2.最后一页 类似地，网站对于最后一页也有以下3种设计方式． ·始终显示最后一页的页码 ·设计成最后一页的按钮．通常以‘末页’或‘’。的形式展现 ·如果没有必要，取消最后一页的显示．由于网站内容都是按照一定规则排序的，如相关性、时间顺序或重要性程度等，因此最后一页的信息可能已经是过期信息或者基本没有用户关注的内容，在设计上就应该削弱最后一页的重要性．目前几大网站都取消了最后一页的功能 Page ? * 3.上一页和下一页 这两个元素是翻页的必备元素，通常以文字的’上一页”’下一页’．符号’ ．或者文字加符号的形式表示．文字的点击区域较大，便于用户定位，符号能够增加用户点击的行动力．因此最常见的是文字加符号的形式，能够促进用户的点击．增加PV量. 当前页面为第一页时，应删除。上一页。的链接或者将其灰化，显示为不可操作的状态．避免用户误操作． Page ? * 4.页码显示的数量 分析知名的有哪些信誉好的足球投注网站引擎和门户类网站，通常都将页码设置在10页左右e．而电子商务类网站，页码通常在5—7页左右，但通过快速定位的方式，弥补了页码数量的不足．给用户更多的控制感， 有哪些信誉好的足球投注网站引擎类 谷歌 百度 门户类 电子商务类 Page ? * 5翻页区域的醒目度 如果要促使用户浏览更多内容．提高网站PV（PageView,页面浏览量）那么就需要通过扩大翻页区域．增加背景色对比度等方式来增加其醒目度，从而增加用户点击并浏览的可能性． 6增大可点击区域 增大可点击的区域，能够方便用户操作．更容易定位． 对于下一页的链接．Google采用文字加符号的设计．同时将前面空白区域也作为下一页的点击区域，增大了点击范围：对于具体页码，通过字符‘o’与页码均可达到翻页的效果，便于用户定位 Page ? * 7.页码的间距 　　设计时．各页码元素之间需要保持一定间距，或者通过划分符号增加视觉分割，便于用户定位．图所示的页码之间距离过小．视觉上过于拥挤，而且用户很容易误操作． 8.当前页码和总页码 　通过颜色，大小或者背景色的对比，突出当前页面．可以增加用户的位置感.或者通过文字直接体现当前页码和总页码．既可以给用户一个全局的认知，也可以了解当前页面在全局中的位置 9.快速跳转 　通过到“第*页”或者“Go to Page*”的方式，给用户提供快速入口，使其能够自由跳转到期望的页面，给用户更多控制感。 Page ? * 4、链接 4、链接设计 　　　链接是网站中最常见的元素之一，包括文字链接和图片链接等，点击链接可以转到新的页面中．虽然它是一个很不起眼的元素，但在设计上却需要注意很多细节． Page ? * 链接的颜色 链接的可点击范围 链接的下划线 链接颜色的变化 区分内部链接和外部链接 链接的交互方式 复习：css样式的四种状态：links,visited,hover, active 盒模型 5、按钮 5、按钮设计 5按钮 什么是按钮 如何增加按钮的点击率 按钮的主次关系 按钮摆放的位置 减少用户定位时间 相关性设计，增加按钮的可理解性 优化视觉效果，增加按钮的吸引力 操作的反馈 Page ? * Page ? * 1.什么是按钮 按钮是网站界面中伴随着用户的点击行