10个提高网站可用性的实用技巧[译]
来源:菠菜博 发布时间:2009-06-12 12:37:00
不论是企业网站、个人博客,或者购物网站、游戏网站,我们都希望能吸引访问者并且给他们留下愉快的访问体验。
可用性是用户体验的一种度量,它可以用访问者完成网站功能的方便程度来描述——无论是通过自身知识还是通过学习新方式来完成这种功能。我认为Jakob Nielson的解释非常到位,他说:
可用性是评估网站易用程度的一种属性。同时“可用性”这个词也指在设计过程中提高易用性的方法。
在本文中我希望能够提供一个可用性清单,内容覆盖了从视觉设计,到可以用在任何项目中的简单导航提示等多个方面。
1. 当前位置导航
要让用户在任何时候都知道自己身处哪个模块,或者在浏览那个分类。对任何网站来说,这都可以极大提升可用性。在这一点上,创建当前位置导航可以算是最有效的提升可用性方式。
当前位置导航的理想方式是在服务端创建,这样可以大量节省HTML和CSS代码。如果不方便在服务端创建导航,那么使用CSS操纵你的body元素 从而直接定义每个导航标签也是一个不错的方法。
另外,你可以方便的 使用JavaScript创建当前位置导航菜单。
要注意,你的当前位置导航最好和鼠标滑过样式保持不同,这是很多网站缩不注意的。
2. 可用的表单标签和按钮
使用HTML的label属性,可以让用户通过点击注释标签来激活表单元素,这是HTML的一个伟大的内置功能,但不幸的是,很少有用户知道这回事。
怎样让用户了解这个功能呢?你可以通过改变鼠标指针形状的方式来提醒用户,这只需要一两行代码就可以实现。
做成这样之后,用户就很容易的知道这标签是可以点的,我经常觉得HTML标准里没有把这些可以点的元素统一设置为小手指针是非常不应该的,所以我通常我会这样统一定义:
label, button, input[type="submit"]{cursor:pointer;}
3. 将你的LOGO链接到首页
我认为logo不链接到你的网站首页是一件令人沮丧的事情,恰恰有很多网站没有这样做。用户研究表明,这样做是很有必要的,用户需要它!
如今越来越多的网站意识到,给LOGO加链接的重要性。用户已不满足于一个标记为“主页”的文字链接,用户希望点一下logo就可以回到首页。
拿Facebook为例,它为每一个导航元素增加了“ref”属性来跟踪用户点击。如下图:


猜你喜欢
- 本文实例为大家分享了python实现单链表反转的具体代码,供大家参考,具体内容如下代码如下:class Node(object): 
- 以下摘录自 oreilly.JavaScript.The.Definitive.Guide.5th.Edition.Aug.200
- 当外层div盒子设置宽度为100%时,可echarts渲染出来宽度只有100px,这种情况大多数echarts所在的div设置了displa
- Python中内置了一些与时间处理相关的库,如time、datatime和calendar库。其中time库是Python中处理时间的标准库
- MySQL5升级为MySQL8问题my.ini首先推荐一个软件“everything”,一个轻巧的遍
- 1.之前的写法(不报错):data = cursor.fetchall()data_name = data[0]['task_typ
- 在任何一个数据库中,查询优化都是不可避免的一个话题。对于数据库工程师来说,优化工作是最有挑战性的工作。MySQL开源数据库也不例外本站收录这
- 安装pyqt5wind@wind-ThinkPad-X250:~/Downloads/PyQt5_gpl-5.12.2$ python3 -
- 本文实例为大家分享了原生js实现tab选项卡切换效果的代码,供大家参考,具体内容如下1.html部分<body> <div
- 单例模式的实现方式将类实例绑定到类变量上class Singleton(object): _instance = Nonedef
- 昨天对其配置了一天,其配置为Jena 2.4.0,MySQL数据库版本为5.1.42-community,JDK版本为1.6.0,MySQL
- 表单类控件承载了一个网页数据的录入与交互,本章将介绍如何使用指令v-model完成表单的数据双向绑定。6.1 基本用法表单控件在实际业务较为
- 鼠标回调函数:def setMouseCallback(windowName, #窗口名称onMouse, &n
- 前些日子在SmashingMagazine看到一篇关于CSS3新技术不错的文章,它详细介绍了CSS3的新特性和它的使用方法,它包括:浏览器专
- 为了方便快捷开发,有些常用的代码块可以直接在IDE编辑器中保存为一个代码块,用简写的方式快捷调取,常用的方法:先建一个模板分组并命令为myT
- 调用pytorch内置的模型的方法import torchvisionmodel = torchvision.models.resnet50
- 任务1、记录用户登录日志import timedef show_info():? ? print('输入提示数字,执行相应操作:0退
- 在使用google或者baidu搜图的时候会发现有一个图片颜色选项,感觉非常有意思,有人可能会想这肯定是人为的去划分的,呵呵,有这种可能,但
- MySQL字符集多种多样,下面为列举了其中三种最常见的字符集查看方法,该方法供您参考,希望对学习MySQL数据库能有所启迪。一、查看MySQ
- 看下面的例子就明白了class Test(object): def __init__(self, value='hell