网页常见可用性错误

《网页常见可用性错误》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、.网页常见可用性错误——布局外观错误1布局、外观错误　　1.1页面宽度　　1.1.1页面内容宽度选择不当　　问题　　设计页面宽度时不考虑使用800*600分辨率的用户　　分析　　根据W3Counter在2006年7月9日发布的全球Web调查显示，使用800*600分辨率的用户仍占11%，所以在设计页面宽度时，要照顾这部分用户。　　游戏站的用户大多是游戏玩家，他们中间绝大多数人的浏览器分辨率是1024*768或更高的分辨率，所以游戏专题为了获得更好的效果，可以在1024*768分辨率下设计页面宽度，一般为900~1000像素宽。但不排除其中也有一部分800*600分

2、辨率的用户，为了保证这些用户能在第一屏获得更好的效果，要把主要内容放在页面左侧。　　公司首页、毒霸、WPS、词霸等站，应尽量保证800*600分辨率下不出现横向滚动条，即页面宽度为公司常用的760像素宽。　　除了固定页面的宽度，设置页面宽度的像素值外，还可以将页面宽度设为100%，以保证各个分辨率下的用户都不出现横向滚动条。对于信息量比较大的页面建议使用100%宽度。但100%宽度的页面会增加宽屏用户浏览网页时视线移动的距离，可以用Javascript控制这类页面的宽度，给它限定一个最大绝对值。　　案例　　神州学习网，面向的用户中有很多是大学生用户，目前大学里80

3、0*600的显示器还是占不小的比例的。而这个网站采用1024下的页面宽度，显然会失去一部分用户。毕竟类似的学习网站还有很多。研究.　　我们政府的网站，面向的用户是全国人民，不应该采用1024分辨率下的设计宽度。　　1.1.2页面内容宽度不一致　　问题　　页面中的一部分内容宽度超出主体内容的宽度　　分析　　设计师常常有这样的设计稿：页面主体宽760像素，照顾分辨率800*600的用户。同时为了使1024*768分辨率下的用户浏览起来不至于感觉两侧太空，会把页面中的某一部分，如头部，设计成1000的宽度。制作这种页面时，要注意把两侧多出来的部分做成自动延展的，如果有图

4、片，做成背景图。　　设计师使用这种方法设计页面的时候要注意两侧多出来的部分，不要放置内容，只能放一些纯修饰性的东西。　　案例　　页面在800*600分辨率下出现了横向滚动条。　　这个页面的原设计稿是这样的：研究.　　两侧的焰火超过了页面的主体，页面应该这样来做：1.2字体　　1.2.1字体样式过多　　问题　　页面中的字体样式过多研究.　　分析　　显示太多的属性会让用户难以找到感兴趣的对象，增加了用户的记忆负担。　　案例　　研究.　　我们政府的网站，文字样式有十几种。让用户抓不住重点。　　同为门户，网易首页的文字样式就规划得很清晰，重点突出。　　1.2.2相同样式的

5、文字功能不同　　问题　　外观相同的文字，功能不同，违背一致性原则，让用户在交互过程中有挫败感。　　分析　　外观相同的文字在用户看来会具有类似的功能，如：是不是链接，是不是在新窗口打开链接。如果相同样式的文字在页面中，既有链接文字，也有非链接文字，就会让用户在浏览页面时不断去试探文字的功能。很可能用户试图点击文字的时候却发现文字不是链接，心中默认即将在原窗口打开的链接却在新窗口打开了，这样就会给用户带来挫败感。　　案例研究.　　“中华人民共和国中央人民政府”网站。“应急管理”和“主题服务”文字样式相同，却前者是链接而后者不是。　　CCTV首页，顶部导航：“繁体”链接

6、的目标是原窗口，而后面文字样式相同的英文版、西班牙文版、法文版链接的目标是新窗口。　　某学校网站的导航栏。前面的链接都是打开一个页面，最后一个“联系我们”却是发送邮件的链接。用户以为点击它会和前面一样打开一个页面，但点击后却启动了Outlook。　　1.2.3字号太小　　问题　　页面文字字号太小，而且使用了固定大小的字号样式，使视力不好的用户无法阅读。　　分析　　老年、视弱的用户也许很难看清网页上的12像素文字。他们往往会使用类似IE中的“查看->字体大小->最大”菜单来放大文字阅读。但如果使用像素作单位来定义文字大小的样式，对IE来说，这个菜单就失效了。大部分网

7、页应尽量采用百分比为单为来定义文字大小的样式，主要面对视力不好用户的网站更应该这样。　　案例　　中国老年网，网站主要用户是中老年人。大部分文字都是12像素，在IE下无法放大观看，让老头老太太们拿着放大镜去瞅吧。1.3导航栏　　1.3.1动态导航栏研究.　　问题　　导航栏的内容和功能会因用户状态或用户在网站中的位置不同而改变。　　分析　　多变的导航会把用户弄糊涂：用户很可能没有意识到导航发生变化了。他们也不知道导航在什么情况下会变化。这就造成用户要去不断试探才能了解其中规律，让网站的可学习性降低。　　案例　　CCTV首页与二级页的导航看起来内容一样。但首页导航链接的

8、目标窗口是