正在阅读:9个网站中常见的可用性错误9个网站中常见的可用性错误

2009-03-16 23:59 出处:蓝色理想 作者:iamsure 责任编辑:zengxiaolan

  现在,比较牛的设计师和开发者都认识到了可用性在他们工作中的重要性。可用性好的网站会极大地提高用户体验,并且好的用户体验会让用户更加快乐。用聪明的设计决策取悦并满足您的访客,而不是阻挠和激怒他们。

  下面是9个网站经常面临的可用性问题 ,以及对于这些问题的推荐解决方案。

  1、太小的链接点击区域

  设置超文本链接的目的是被点击,确保它们很容易点击才有意义。下面的示例中的链接实在是太小了;点击它们的难度太高。 这些是 评论中的链接,Hacker News 是一个社会新闻的网站。 (点击区域用红色突出显示):

9个Web设计中常见的可用性错误
图1  

  下面例子中包含相同的界面元素,链接的评论,但是这个例子中有一个很大的可点击区域:

9个Web设计中常见的可用性错误
图2  

  Newspondcomments link.
  为什么我们需要一个更大的点击区域? 很简单。 因为我们移动鼠标并不是很准确。 一个大号的点击区域使鼠标光标悬停在链接上更容易。如何能有一个大号的点击区域呢?我们可以使整个链接更大,或者使用CSS "padding"属性增加链接周围的空间。 代码如下:
  <a href="http://www.examplesite.com"style="padding: 5px;">Example Site<a>

  为了使例子简单点,这个CSS样式直接写在代码里了,但在现实生活中您可能是在您的CSS文件中添加一个样式,给这个链接一个class或者是一个id,然后指向它。
  在37signals上,你可以阅读到更多关于填充链接以更适用于鼠标点击的文章,的文章棉衣链接的目标 。文章认为,填充为用户提供了“舒适的感觉。真的非常容易点击链接。感觉链接就像是在配合你工作不是和你对着干你。”

键盘也能翻页,试试“← →”键

相关文章

关注我们

最新资讯离线随时看 聊天吐槽赢奖品