你应该知道的网页设计中的规则和禁忌

你应该知道的网页设计中的规则和禁忌,第1张

你应该知道的网页设计中的规则和禁忌

网页设计是一个棘手的话题。当你创建一个网站时,你需要考虑很多事情。为了简化这个任务,我在这里准备了一个列表。每个网页设计师在设计网页时都应该考虑这些因素。好消息是这些是一些简单的设计原则。

我们开始吧!

我该怎么办

1。无论使用何种设备,都应该提供相同的用户体验

用户将使用不同的设备访问你的网站:他们可以通过台式电脑或笔记本电脑、平板电脑、手机、音乐播放器甚至手表访问你的网站。UX设计的一个关键部分是确保用户应该有相似的用户体验,无论他们通过什么访问你的网站,无论他们使用什么样的设备。

如果用户通过手机访问你的网站,他们应该可以毫不费力地找到他们需要的一切,就像他们在家里通过桌面查看你的网站一样。

2。设计简洁易用的导航

导航是可用性的基石。记住,一个网站设计的再好也不重要,但是你必须保证用户可以用自己的方式浏览。这就是为什么你网站上的导航应该这样设计。

简单(每个站点都应该有最简单的结构)

简洁(导航选项必须清晰易懂,便于访问者理解)

一致(主页的导航系统在每个页面上都应该是相同的)

设计导航方法,尽量减少点击次数,帮助用户到达他们想去的网页。同时,应该很容易浏览和找到他们想去的地方。

3。更改已访问链接的颜色

链接是导航过程中的一个关键因素。当访问过的链接没有改变颜色时,用户可能会无意中重复访问同一页面。

知道用户访问过哪些页面可以防止他无意中一次又一次地访问相同的页面。

4。轻松浏览您的页面

当用户访问您的网站时,他们更可能快速浏览屏幕,而不是阅读页面上的所有内容。因此,如果访问者想要找到内容或完成一项任务,他们会浏览直到找到他们需要的内容。作为设计师,你可以通过设计一个好的视觉层次来帮助他们。视觉层次是指以暗示重要性的方式排列或呈现元素(比如他们的目光应该集中在take?第一、第二等。)

标记重要内容,如屏幕标题、登录表单、导航项目或其他重要内容,以便访问者可以立即查看。

Basecamp使用的z扫描模式

5。仔细检查所有链接

当用户点击网站上的链接并收到提示404错误页面时,用户可能很容易变得沮丧。当访问者在搜索内容时,他们希望每个链接都能把他们带到所指向的地方,而不是404错误提示或其他一些他们不想去的地方。

6。确保可点击的元素对用户来说是显而易见的

一个物体的外观可以告诉用户如何使用它。视觉元素看起来像链接或按钮,但不能点击(即带下划线的单词没有链接,元素有文本动作,但没有超链接)。这很可能会让用户感到困惑。用户需要知道页面的哪些区域是纯静态内容,哪些区域是可点击的。

用户应该知道哪些是可点击的元素。

橙色的盒子是一个按钮吗?答案是:不。形状标签使它看起来像一个按钮,但它不是。

什么不该做

1。让你的访问者等待网页加载

用户的注意力和耐心往往很差。根据NNGroup的研究:

10秒是将用户的注意力集中在这项任务上的最短时间。

当访问者不得不等待你的网站加载时,如果你的网站加载速度不够快,他们会变得沮丧,可能会离开你的网站。如果加载时间过长,即使你有一个设计精美的加载指示器,也可能迫使用户离开网站。

2。不要在新标签中打开链接

这种粗鲁的行为会禁用后退按钮,而后退按钮是用户返回上一个站点的常用方式。

3。让推广掩盖了内容

促销和广告会模糊旁边的内容,使用户更难完成任务。不要说任何看起来像广告的东西通常都会被用户忽略(这种现象叫做旗帜盲点)

4。劫持卷轴

劫持滚动是设计师和开发者通过 *** 纵滚动条的区别。包括动画效果,固定滚动点,甚至滚动条本身的重新设计。劫持滚动是很多用户最讨厌的事情之一,因为它脱离了用户的控制。当你设计一个网站或用户界面时,你希望用户控制他们浏览网站或应用程序的速度和动作。

Mac页面使用了一些烦人的滚动效果。它使用单页视差布局,其中点代表页面的每个部分。

5。自动播放带声音的视频

后台自动播放视频、音乐或声音会刺激用户。应该谨慎使用这些元素,并且仅在适当和可预测的情况下使用。

脸书视频设置为自动播放,但不会出现声音,除非用户有意以某种方式观看视频(例如,通过视频交流)。

6。为了美观而忽略可用性

或者网站用户界面的设计不应该影响用户阅读屏幕上内容的能力。重要的是要避免繁琐的内容和不均匀的颜色,这会阻碍网站的可读性或导致颜色对比度不足(例如,下面的例子)。

字体的低对比度总是不好的做法。

7。使用闪烁的文字和广告

闪烁的内容可能会引发敏感人群癫痫发作。它不仅会导致癫痫发作,而且可能会让普通用户感到烦恼或分心。

作者:尼克·巴比奇

原文地址:https://UXplanet.org/dos-and-don-ts-of-web-design-8c9d6a5de7c6

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zz/779022.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-04
下一篇 2022-05-04

发表评论

登录后才能评论

评论列表(0条)

保存