网页设计常见10大问题

　　自1996年以来，我们一直在总结网页设计十大问题的列表。今年，我们完成了一个大规模的可用性研究，在美国和英国有215名参与者，看看今天的网页设计错误是什么。

　　在分析从小型本地企业到娱乐场所，非营利组织到全球组织的43个站点的结果后，我们确定了10个最常见和最具破坏性的网页设计错误，这些错误对用户造成了伤害。(通过伤害他们的用户，这些设计缺陷绝对也会损害网站的商业指标)

　　这已经不是大新闻了，今天最重要的问题都不是新的或令人惊讶的。网页设计已经走了很长的一段路，但是这些一贯的问题依然存现代设计模式和美学改变，潜在的用户需求保持不变。用户仍然需要查找信息，能够阅读信息，并知道要点击的内容以及它所在的位置。

　　1. 想不到内容的位置

　　人们使用它们找不到信息，许多网站提供的类别名称不完整，没有充分或准确地描述其中的内容，其他的安排是基于公司而不是用户对内容的想法。当网站结构不符合用户的信息组织方式的心理模型(mental models)时，人们无法找到他们需要的东西。

　　让用户参与创建你的网站结构，一些可用性工作(如卡片分类，决策树或可用性测试)可以在创建一个对用户有意义的网站结构方面发挥很大的作用。

　　ATT.com：有关旧手机交易的信息是在现有客户下，但用户在智能手机下查找。

　　2. 相互矛盾的连接和导航分类

　　当用户不能清楚区分相似的导航类别或链接时，他们很难找到恰当的内容路径。类别和链接名称本身需要有自己的涵义，同时也应该与站点上的其他选项结合。如果多个部分或页面可以满足特定的信息需求，用户必须探索每一个路径或努力做出最好的猜测。或者，他们可能会转向搜索甚至离开网站。

　　BAM建筑网站上的用户希望了解建设项目的细节，但不确定这些信息是否属于关于我们，公司业务，或者公司技术，大部分是从我们的产品开始，但该部分包含了组织为客户提供的工作类型的概述，而不是项目细节，项目信息和案例研究是我们的技术特色。

　　卡片分类和可用性测试有助于避免重叠类别名称，链接太相似的问题通常源于糟糕的内容策略。

　　造成这些问题的两个可能原因是：

　　标签相似：链接导致内容不同，但由于某种原因，它们有相似的标签。如果是这样的话，试着重命名你的链接来区分它们。

　　内容区分性差：如果高度信息相关的链接指向不同页面，解决方案可能不是重命名链接，而是重新组织和合并内容。

　　3. 信息孤岛

　　有些站点上的信息比较碎片化，分散在站点上，它们之间几乎没有连接。

　　当用户发现一个没有相关信息的信息孤岛时，他们没有理由认为网站的另一个区域提供了补充材料。如果用户需要更多的信息，他们会到竞争对手的网站或搜索谷歌。

　　试图重新访问信息的用户可能最终会选择在站点的另一个完全不同的领域，对内容的看法不同于第一次体验。那些找出不连贯信息的信息，拼凑起来。无论哪种方式，他们都对网站留下了负面的印象。

　　从组织的角度来看，这不仅是用户体验的失败，更是内容管理的噩梦：站点的某个区域的信息可能重复、不同或甚至与其他地方的信息相矛盾。

　　解决方案之一是在提供相关信息的页面之间添加相关链接，一个更好的解决方案是考虑为什么信息分散在整个网站，挑选适当的时候，并选择最佳位置。站点的其他区域可以引用关于该主题内容的位置，而不是复制信息。

　　4. 重复链接

　　即使用户已经知道他们所需要信息在网站中的位置，但他们依然可能会遭受意外或者漫长工作流的阻碍。

　　Web团队经常会问，要获取内容需要多少点击。没有确切的数字(no magic number)， 点击质量的重要性要远远大于其数量。当用户在点击页面时应该更接近信息目标，用户在选择他们想到东西时需要重复的点击，这会一次又一次的激怒客户，并让他们进行了不必要的努力。

　　团队构建页面有时候会闭门造车，从而没有考虑到创建内容的流程。创建新页面时，要考虑用户如何到达那里并思考是否还有更直接的路径。

　　纽约市政府综合网站：让用户感到沮丧的是当点击寻找消防站(Find a Firehouse)链接时，只能在下一个页面中再点击一次拼写都不一样的链接。

　　这种偏见也恰好说明了人们为什么忠诚于特定的产品、服务、网站或其他工具。我们会冒险使用其他可能更好用的方法，也可能会继续使用已经尝试过并且靠得住的工具。

　　5. 隐藏费用和价格

　　人们想要了解价格、订购费用、服务费用以及流程开始之前或之后的额外费用，在一些网站中用户进行复杂的操作只为了寻找基本的信息，例如：他们不得不尝试在AARP网站上购买会员 ，这样才能查明会员费用，用户应该要在进行复杂操作之前就能找到到这些信息。

　　6. 在小型网站中搁浅用户

　　为部分或者特殊内容单独创建的网页、次级页面需要谨慎的处理这些网站上的用户。在我们的许多研究中，当参与者没有主动的跳转到了一个新的站点或者子站点，然后努力的想要回到父站点，但是该站点并没有提供返回选项。

　　有些人能够通过多次使用浏览器的“后退”按钮或重新输入网站的网址来导航到父站点，但是许多人甚至没有注意到他们已经切换了站点(因为父站点和子站点的外观和感觉相似) 并且很疑惑为什么他们以前使用的导航消失了。

　　在创建一个单独的子网站之前需要再三考虑，确保用户可以根据需要轻松导航回到父站点。

　　英国红十字会主站(www.redcross.org.uk – 上图)及其培训网站(英国(www.redcrossfirstaidtraining.co.uk -下图))看起来非常相似，使用相同的LOGO链接到每个网站各自的主页 ，以及相同的第一个导航类别(我们做什么(What We Do))。寻找急救课程的用户被引导到了培训网站，并在试图返回主站点时迷失方向。

　　7. 糟糕的搜索结果

　　当用户确切地知道他们在寻找什么的时候，用户会选择搜索作为最后的手段。在任何情况下，站点都需要通过提供强大的搜索结果来支持用户。

　　不幸的是，网站搜索功能仍然是许多网站的主要弱点，有些站点的搜索结果与用户的查询不匹配。此外，有些搜索结果展现的只是网站的一部分内容而已，不会清楚的向用户展示所有的搜索内容。

　　搜索结果名称不全或者附有无用的摘要，会让用户不由的猜测链接背后的内容。散布在网站搜索结果中的广告也会让用户感到讶异，这些广告会让他们头也不回的离开网站。

　　定期查看搜索日志，了解更多有关用户的搜索行为和搜索引擎成功与失败的信息。使用网站内容标签和网站搜索工具的功能，如“最佳匹配”，会搜索出针对特定查询的最适合的结果。

　　8. 不完美的过滤器和功能模块

　　功能模块和过滤器通常能提高用户体验，利用它们，用户可以将搜索范围缩小到所需的资源、产品或内容。然而，简单地添加功能模块和过滤器并不能保证得到更好的可用性，这些工具需要支持真正的用户和真正的用户需求。

　　功能模块和过滤器定义了用户的搜索范围，不同的筛选条件在不同地方也能给用户提供不同的帮助。

　　假如：专门关注上星期二 ”关于可持续性” PPT演示文稿的员工，可以用文档类型和日期来缩小搜索范围，也可以通过搜索主题来找到内容。一个电子商务网站可能希望买鞋子的客户通过鞋跟高度来缩小购买范围，而购买外套的客户则希望通过衣服特定的保暖等级，来缩小自己的搜索范围。

　　当网站尝试采用几乎一刀切的方法时，网站所使用的“分面导航”(facets)和过滤器就会存在缺陷。相同的标准和特性可能不适合所有的内容类型，要谨慎地将用户的选择限制为二选一或者接近二选一。

　　购买家具的人可能在找蓝色的椅子，或者他们在找蓝色以外任何颜色的椅子(个人理解：前者是目标明确，我就要蓝色的椅子;后者是我想要椅子，但是没想好颜色，同时我不喜欢蓝色)，这两个需求都应该得到支持。

　　给内容打的标签必须正确且可靠，这样用户搜索时才能得到相关的结果。例如：在美国退休人员协会网上，用户在搜索鸡肉食谱时会感到很困惑，10个搜索结果的前6个没一个食谱里有用到鸡肉。

　　Maplin.com：用户无法轻易的找到价格低于50£的蓝牙音箱，用户没有办法通过网站的过滤器来搜寻符合他们价格要求的商品。相反，他们不得不通过几个价格区间的选项进行查找。用户必须一次只选择一个价格区间(例如40£-50£和30£-40£)，然后记住每个区间里他们想要的商品。

　　9. 压到用户的大量信息

　　眉目不清的信息会让用户难以找到他们需要的信息，密集的“文字墙”让发现感兴趣的信息变得困难，信息量过载的页面充满了争夺用户注意力的内容。

　　请记住：用户习惯扫视网页，而不是阅读网页，你可以通过编排网页内容，让用户能轻松的获取他们感兴趣的的信息——使用简短的句子和段落、项目列表、标题和加粗的关键字。

　　一个狭窄的区域分了好几个长段落，让用户很难看到重点，无法区分耳机的特点。

　　10. 隐藏链接

　　多年来，我们的可用性研究表明，用户往往会忽略或无视长得像广告或者被放置在通常是放置广告的页面位置的内容。这个问题依然存在，当内容与实际广告一起列出时，情况就更糟了。

　　网站的设计师有时会认为，将更多的设计元素，如：边框、背景色或图形添加到链接上能让链接脱颖而出，但结果通常是相反的：在链接周围的设计越是奇特，用户越是会误认为它是一个广告。

　　Pitfield London在网页右边的菜单信息里放有营业时间和链接，在下面放了一张咖啡杯的动态图和一些前往其他网站的广告图。由于这些广告的位置和显示的样式，导致用户很难在这个页面上找到咖啡菜单。这个网站还用了相似的设计画了张banner，用来引导用户前往Pitfield London。

　　已经取得进展：有待进一步发展

　　我们可以放心地假设，没有人会着手创建一个设计糟糕的网站。如果这些问题多年以来都是众所周知的，那么它们为什么会持续存在呢?这个问题的潜在答案很多，可能会填满一本书。其中的一些错误可能反映了一个更深层次的、具体到组织的UX战略失败。

　　例如：

　　网站信息层次结构的问题可以与组织结构或公司的内部政治联系起来。

　　不同的部门在不了解对方的情况下创建内容，也没有遵循总体的内容策略，这时就会产生问题。

　　较差的搜索结果可能是因为内容管理系统较差，内容标记有缺陷或缺失，或者搜索工具不佳。

　　这些问题背后的原因并不比解决这些问题重要，通过在网站开发过程中的用户研究和可用性测试，并关注研究结果，可以很容易地识别上面列出的许多错误(如果不是全部的话)。

　　网站永远不会是完美的，没有网站是完美的。总有一个表格字段需要修改，还有一个内容需要编辑，还有一个导航类别需要确定，但是知道需要解决的问题对于朝着正确的方向前进是至关重要的。

　　在进行用户研究时，要坚持以前的发现。当设计偏好在5年后改变时，那些旧的发现可能会使你避免在第二个、第三次或第四次中犯同样的错误。

　　名词解释：

　　分面导航(facets/faceted navigation)：也称多维度导航，是分析一系列的内容然后根据条件把不相关的内容排除掉，留下我们想要的内容。

　　(译者注：a.具体想了解的话可以点击这里;b.文章里用的是facets，但作者提供的链接里用的是faceted navigation，所以两者应该是指同一个东西)。