首页 关于我们 项目案例 网站建设 网站优化 微信公众号 技术课堂 联系方式
QQ联系点击这里给我发消息
电话联系
手机联系
QQ联系点击这里给我发消息
电话联系
手机联系
【当前位置】

良好的网站设计原则和有效的网页设计指南

发布时间:2019-05-27 15:13
发布者:康康
浏览次数:
为了正确使用这些原则,我们首先需要了解用户如何与网站互动,他们如何思考以及用户行为的基本模式是什么。

用户如何看待?

基本上,用户在网络上的习惯与顾客在商店中的习惯没有什么不同。访问者浏览每个新页面,扫描一些文本,然后单击第一个引起他们兴趣的链接或模糊地类似于他们正在寻找的东西。事实上,他们甚至没有看到页面的大部分内容。

大多数用户搜索有趣(或有用)和可点击的内容; 一旦找到一些有希望的候选人,用户点击。如果新页面不符合用户的期望,则单击“后退”按钮并继续搜索过程。

  • 用户欣赏质量和信誉。如果页面为用户提供高质量的内容,他们愿意通过广告和网站设计来妥协内容。这就是为什么那些设计精良的高质量内容网站多年来获得大量流量的原因。内容比支持它的设计更重要。
  • 用户不读,他们扫描。通过分析网页,用户可以搜索一些固定点或锚点,从而引导他们浏览页面内容。用户不读,他们扫描。请注意句子中间“热”区域是如何突然出现的。这是扫描过程的典型特征。
  • 网络用户不耐烦,坚持即时满足。非常简单的原则:如果一个网站无法满足用户的期望,那么设计师就无法正常完成工作,公司也会亏钱。认知负荷越高,导航越不直观,用户越愿意离开网站并寻找替代方案。[JN / DWU]
  • 用户没有做出最佳选择。用户不会搜索最快捷的方式来查找他们正在寻找的信息。他们也没有以线性方式扫描网页,从一个网站部分顺序地移动到另一个网站部分。相反,用户满意; 他们选择了第一个合理的选择。一旦他们找到似乎可能导致目标的链接,就很有可能立即点击它。优化很难,而且需要很长时间。满意度更高效。
  • 顺序读取流程在Web中不起作用。底部图像上的右侧屏幕截图描述了给定页面的扫描路径。
  • 用户遵循他们的直觉。在大多数情况下,用户会混淆而不是阅读设计师提供的信息。根据Steve Krug的说法,其基本原因是用户并不在意。“如果我们找到有用的东西,我们会坚持下去。只要我们能够使用它们,如果我们理解事物是如何工作的,那对我们来说并不重要。如果你的观众会像你在设计广告牌一样,那就设计出很棒的广告牌。“
  • 用户希望拥有控制权。用户希望能够控制他们的浏览器并依赖整个站点的一致数据表示。例如,他们不希望新窗口意外弹出,他们希望能够使用“Back”按钮返回到他们以前的网站:因此,从不在新的浏览器窗口中打开链接是一个好习惯。

1.不要让用户思考

根据Krug的第一个可用性定律,网页应该是明显且不言自明的。当你创建一个网站时,你的工作就是摆脱问号 - 用户需要有意识地做出的决定,考虑优点,缺点和替代方案。

如果导航和站点架构不直观,问号的数量会增加,使用户更难理解系统的工作方式以及如何从A点到达B点。结构清晰,视觉线索适中,易于识别链接可以帮助用户找到他们的目标。

 

我们来看一个例子吧。Beyondis.co.uk声称“超越渠道,超越产品,超越分销”。这是什么意思?由于用户倾向于根据“F”模式探索网站,因此这三个语句将是用户在加载后将在页面上看到的第一个元素。

虽然设计本身简单直观,但要了解页面是什么,用户需要搜索答案。这是一个不必要的问号。设计师的任务是确保问号的数量接近于0.视觉说明放在右侧。只需交换两个块就可以提高可用性。

 

ExpressionEngine使用与Beyondis完全相同的结构,但避免使用不必要的问号。此外,口号变得有用,因为用户可以选择尝试服务并下载免费版本。

通过减少认知负荷,您可以更轻松地掌握系统背后的想法。一旦实现了这一点,您就可以了解系统有用的原因以及用户如何从中受益。如果他们无法找到自己的方式,人们就不会使用您的网站。

2.不要浪费用户的耐心

在每个项目中,当您要向访问者提供某些服务或工具时,请尽量减少用户需求。用户测试服务所需的操作越少,随机访问者实际尝试它的可能性就越大。首次访问者愿意使用该服务,而不是为他们将来可能永远不会使用的帐户填写长网页表单。让用户浏览网站并发现您的服务,而无需强迫他们共享私人数据。强制用户输入电子邮件地址来测试该功能是不合理的。

正如37Signals团队的开发人员Ryan Singer所说,用户可能会急于提供一个电子邮件地址,如果他们看到这个功能后被问到这个地址,那么他们就会知道他们会得到什么。作为回报。

 

Stikkit是一个完美的例子,用户友好的服务,几乎不需要访客,这是不显眼和舒适。这就是您希望用户在您的网站上感受到的内容。

 

显然,Mite需要更多。但是,注册可以在不到30秒的时间内完成 - 因为表单具有水平方向,用户甚至不需要滚动页面。

理想情况下,删除所有障碍,不要先订阅或注册。仅用户注册就足以阻碍用户导航以减少传入流量。

3.管理以吸引用户的注意力

由于网站提供静态和动态内容,因此用户界面的某些方面比其他方面更受关注。显然,图像比文本更引人注目 - 正如标记为粗体的句子比纯文本更具吸引力。

人眼是一种高度非线性的设备,网络用户可以立即识别边缘,图案和动作。这就是基于视频的广告非常烦人和分散注意力的原因,但从营销角度来看,它们完全可以吸引用户的注意力。

 

人性化完美地运用了焦点原则。用户可以直接看到的唯一元素是“免费”这个词,它具有吸引力和吸引力,但仍然平静而纯粹的信息。微妙的提示为用户提供了有关如何更多地了解“免费”产品的足够信息。

通过适度使用视觉元素将用户的注意力集中在网站的特定区域,可以帮助您的访问者从A点到B点,而不必考虑实际应该如何完成。访问者的问题越少,他们的定位感越强,他们对网站所代表的公司的信任度就越高。换句话说:在幕后发生的思维越少,用户体验就越好,这首先是可用性的目标。

4.争取功能曝光

现代网页设计通常受到批评,因为它们引导用户具有视觉上吸引人的1-2-3完成步骤,具有视觉效果的大按钮等。但从设计角度来看,这些元素实际上并不是坏事。相反,这些指南非常有效,因为它们以非常简单和用户友好的方式引导访问者浏览网站内容。

 

Dibusoft将视觉吸引力与清晰的网站结构相结合。该网站有9个主要导航选项,第一眼就可以看到。但是,颜色的选择可能太轻了。

让用户清楚地看到可用的功能是成功的用户界面设计的基本原则。如何实现这一点并不重要。重要的是内容被充分理解,访问者对与系统交互的方式感到满意。

5.利用有效的写作

由于网络与印刷不同,因此有必要根据用户的偏好和浏览习惯调整书写风格。促销写作不会被阅读。将跳过没有图像的长文本块和以粗体或斜体标记的关键字。夸大的语言将被忽略。

谈生意。避免使用可爱或聪明的名字,营销引导的名称,公司特定的名称和不熟悉的技术名称。例如,如果您描述服务并希望用户创建帐户,“注册”优于“立即开始!”,这比“探索我们的服务”更好。

 

Eleven2.com直接指向了这一点。没有可爱的话,没有夸张的说法。而不是价格:只是访客正在寻找的东西。

有效写作的最佳解决方案是

  • 使用简短的短语(尽快达到目的),
  • 使用可扫描布局(对内容进行分类,使用多个标题级别,使用可视元素和打破统一文本块流动的项目符号列表),
  • 使用简单和客观的语言(促销不需要听起来像广告;给你的用户一些合理和客观的理由,他们应该使用你的服务或留在你的网站)

6.力求简单

“保持简单”原则(KIS)应该是网站设计的主要目标。用户很少在网站上享受设计; 此外,在大多数情况下,尽管有设计,他们仍在寻找信息。力求简洁而不是复杂。

从访问者的角度来看,最好的网站设计是纯文本,没有任何广告或其他内容块完全匹配访问者使用的查询或他们一直在寻找的内容。这是用户友好的打印版网页对良好用户体验至关重要的原因之一。

 

Finch清楚地呈现了有关该网站的信息,并为访问者提供了多种选择,而不会过度拥挤不必要的内容。

7.不要害怕白色空间

实际上,高估白色空间的重要性真的很难。它不仅有助于减少访问者的认知负担,而且还可以感知屏幕上显示的信息。当新访问者接近设计布局时,他/她尝试做的第一件事是扫描页面并将内容区域划分为可消化的信息片段。

复杂的结构更难以阅读,扫描,分析和使用。如果您可以选择通过可见线或某些空格分隔两个设计段,则通常最好使用空白解决方案。分层结构降低了复杂性(西蒙定律):您设法为用户提供视觉层次感越好,您的内容就越容易被感知。

 

白色空间很好。Cameron.io使用空格作为主要设计元素。结果是可以很好地扫描布局,使内容成为它应得的主导地位。

8.用“可见语言”有效沟通

在他关于有效视觉传播的论文中,Aaron Marcus阐述了使用所谓“可见语言”的三个基本原则 - 用户在屏幕上看到的内容。

  • 组织:为用户提供清晰一致的概念结构。一致性,屏幕布局,关系和可导航性是组织的重要概念。应对所有要素适用相同的公约和规则。
  • 节约:用最少量的线索和视觉元素做最多的事情。需要考虑的四个要点:简洁,清晰,独特和重点。简单性仅包括对通信最重要的元素。清晰度:所有组件都应该设计成其含义不含糊。独特性:必要元素的重要属性应该是可区分的。重点:应该容易理解最重要的元素。
  • 沟通:将演示文稿与用户的功能相匹配。用户界面必须保持平衡易读性,可读性,排版,符号,多视图和颜色或纹理,以便成功通信。使用最大值 3种字体,最多3个点大小 - 每行文本最多18个字或50-80个字符。

     

9.公约是我们的朋友

场地元素的传统设计不会导致枯燥的网站。实际上,约定非常有用,因为它们减少了学习曲线,需要弄清楚事情是如何工作的。例如,如果所有网站都有不同的RSS-feeds视觉呈现,那将是一个可用性的噩梦。这与我们的常规生活没有什么不同,我们倾向于习惯于如何组织数据(文件夹)或购物(放置产品)的基本原则。

通过惯例,您可以获得用户的信任,信任,可靠性并证明您的可信度。关注用户的期望 - 了解他们对网站导航,文本结构,搜索位置等的期望。

可用性会话的典型示例是使用日语翻译页面(假设您的Web用户不懂日语,例如使用Babelfish),并为您的可用性测试人员提供在不同语言页面中查找内容的任务。如果惯例得到很好的应用,用户将能够实现一个不太具体的目标,即使他们无法理解其中的一个词。

史蒂夫·克鲁格认为,只有当你知道自己有更好的想法时,才能更好地进行创新,但是当你不知道自己时,就要利用惯例。

10.尽早测试,经常测试

这种所谓的TETO原则应该应用于每个网页设计项目,因为可用性测试通常提供关于给定布局的重大问题和问题的重要见解。

测试不要太晚,不要太少而不是出于错误的原因。在后一种情况下,有必要了解大多数设计决策都是本地的; 这意味着你无法普遍回答某些布局是否比另一个更好,因为你需要从一个非常具体的角度进行分析(考虑需求,利益相关者,预算等)。

要记住的一些要点:

  • 根据Steve Krug的说法,测试一个用户比测试一个用户好100%,并且在项目早期测试一个用户比在接近测试时测试50个好。根据Boehm的第一部法律,错误在需求和设计活动中最常见,并且在删除后更加昂贵。
  • 测试是一个迭代过程。这意味着你设计一些东西,测试它,修复它然后再测试它。可能存在第一轮中未发现的问题,因为用户实际上已被其他问题阻止。
  • 可用性测试总能产生有用的结果。要么你会指出你遇到的问题,要么你会指出没有重大的设计缺陷,这两种情况都是对你的项目有用的见解。
  • 根据温伯格定律,开发人员不适合测试他或她的代码。这也适用于设计师。在网站上工作几周之后,你再也无法从一个全新的角度观察它了。您知道它是如何构建的,因此您确切地知道它是如何工作的 - 您拥有智慧独立的测试人员和您网站的访问者所不具备的。

一句话:如果你想要一个好的网站,你必须进行测试。