10个你喜欢(也让访问者讨厌)的网页设计错误

在只有50毫秒(0.05秒)，有人会决定他们是否喜欢你的网站。如果那个人是你想要成为买家的人，那在极短的时间内绝对是至关重要的——这是让他们留下或离开的区别。

即使你让他们留下来，你还有另一个问题。

得到这个——38％的人将不再参与网站如果内容或布局不吸引人。

呵!

这给你的网站设计带来了巨大的压力——你需要在正确的地方拥有正确的元素，并在正确的时间呈现给人们，如果你想让他们进一步进入你的网站而不是离开。

那么，你如何知道哪些元素是正确的，哪些元素会让你的用户感到厌烦呢?

当然，如果不考虑你独特的分析和用户数据，就没有确切的方法知道你到底需要什么设计元素，甚至每一个细节。然而，当涉及到帮助您做出更好的设计选择时，有一些相对通用的最佳实践。

例如,主页上的感言或者在页脚保留社交图标。

这些最佳实践之外的元素被认为是实验性的。而且，大多数时候，我们发现这些元素会因为个人偏好或过时的最佳实践而出现在网站上。

每个网站都是不同的，而这些网站的受众也同样不同。但是，就像我们绝对知道最佳实践是有效的一样，也有一些元素是无效的。

这里有10个设计选择会意外地让你的用户失去兴趣的例子。

1.你的导航很混乱

你是否曾经上网，却不知道该怎么走或者该去哪里?这是不和谐的，因为你知道(或你认为)你在正确的地方，但你却找不到你需要的东西。

这是一个糟糕的网站导航的案例。菜单可能被隐藏了，或者在页面的右侧，甚至在页面的底部。

如果你想知道……本例中的导航位于左侧。

当一个网站非常努力地想要与众不同、有创意和/或独特的时候，我们经常会看到这样的结果。或者，在某些情况下，没有人可以决定什么是你应该首先看到的最重要的东西。

当然，我们希望每个网站在外观和感觉上都是不同的、有创意的和独特的。但你不应该太过分。你可能最终会损害用户体验，以至于有人会放弃，因为他们很难弄清楚自己应该做什么。

你从来没有希望你的用户必须考虑如何使用你的网站。它应该总是让人感觉很直观。

你的菜单应该在页面上清晰和突出。它必须易于发现、理解和执行:

我们尽量保持简单在代理方．

你不仅会用塞满的网站导航菜单来迷惑人们，而且还会对SEO不利．所以，将主菜单选项的数量限制在5到7个之间。

下拉菜单的组织方式应该是用户能够理解的，而不是从内部组织的角度来看，对你来说最有意义的方式。

你的网站分析能给你提供非常深刻的见解，让你知道你的用户是如何到达他们需要去的地方的，以及用户可能会在哪些地方离开你的网站当他们应该留下来并采取行动的时候。

在决定你的菜单结构时要考虑到这一点，你希望你的菜单易于理解，并能快速找到他们需要的信息。

2.你依靠主页滑块来传达多个相互竞争的信息

啊，主页滑块(有时也叫旋转木马)。网站的元素所有设计师都喜欢讨厌：

我知道，你可能会想，“嘿，滑动器有什么问题?”

我对你的本能反应是，“你觉得拨号上网有什么问题吗?”

时髦的吗?也许吧。但事实是，它们根本不起作用。

设计师的影响乔·里纳尔蒂写了一篇非常简洁和有说服力的文章说明原因主页旋转木马或滑动条看起来容易的眼睛，但他们不是一个好主意．

这是我最喜欢的一句话:

“我无法收回JNCO牛仔裤的尴尬阶段，但你可以通过放弃旋转木马来帮助你的网站跳过这个尴尬阶段。旋转木马可能看起来很炫酷，但在将访问者转化为合格的线索方面，它们根本不起作用。”

简而言之，主页滑块(或旋转木马)没有效果，因为它们不能转换。

虽然你可能认为你的用户会花时间坐下来，等待查看所有选项的主页滑块点击通过和开始他们的旅程。(或者，如果你是Denny's，你可能会认为有人真的会像我一样积极地浏览所有东西。)

你就错了。

滑动条解决了内部问题——它们允许多个内部利益相关者感觉到他们的优先级是重要的。

然而，它们并不能解决用户的需求。

那么，如果你不能滑球，你会怎么做?你简化!

如果你在HubSpot上托管一个网站，利用智能内容功能，它允许您精心制作和显示独特的消息传递，这些消息传递将根据您设置的任何变量作为触发点而变化。(例如，你可能对美国人和加拿大人有不同的信息。)

或者，只专注于一个单一的，非常重要的信息，并使它在“英雄节但是，如果你真的需要滑块的“闪光”，也许可以选择一些视频或动画选项。

乔也有一些伟大的建议替代主页滑块．

3.你还在逼着一切都不顺手

我不知道你是否注意到了，但互联网实际上并不像报纸一样会折叠!尽管如此，“超越界限”的概念在网页设计领域已经持续了几十年。

根据该网站的说法，如果你不把它放在页面上方，它就不存在。

但这种“超越折叠”的想法是无稽之谈，尤其是在设备和屏幕尺寸无穷无尽的情况下。

当用户登陆一个网站时，他们会滚动。我们的手机文化让这成为了第二天性。当设计师感知到(看不见的)折叠时，它提供了一个不现实的边界他们正在解决的问题．

在你的英雄空间里，你的信息应该响亮而清晰，但要保持单一且不受干扰。你想要解决这个问题的一件事你希望你的用户在他们的时间在这里完成。

不要包含太多的废话。简洁直接。不要包含太多的按钮，你希望用户遵循一个非常明确的路径。

拥抱空格在这些部分是至关重要的。空白提供的额外空间将迫使用户关注您的关键信息。

提前看到卷轴也是个好主意。你可以通过添加一些鼓励滚动的动画来吸引用户。或者你可以把重点放在关键部分的转换上。

4.如果你坚持自己的品牌，易用性就会变得糟糕!

网站的可访问性最近收到了大量的议论，这是理所当然的。这不是一种趋势，也不是什么将要淘汰的东西。网站的可访问性对于所有人使用互联网是至关重要的。这是知情权。

是的，它沉重，它复杂，它不能被忽视。

即使最近关注的是可访问性，我们实际上已经看到许多公司团队在他们自己的网站上拒绝接受可访问性。这并不是因为他们不想包容;因为这要求他们改变或放弃既定的品牌标准．

在这方面，“对比”是最糟糕的。

看，网站可访问性不仅仅是为屏幕阅读器设计。这是关于优化可读性。

例如，如果使用的颜色没有足够的对比度，色盲的人可能很难区分按钮上的文本——想想淡黄色按钮上的白色文本。

这可能是一个很难付诸实践的改变。品牌标准只是标准，改变它们可能需要讨论和重写，以符合可访问性的期望。

最好的开始是简单地检查你现有的颜色对比工具，如Color.review．只需添加两个十六进制代码，网站就会给出一个及格/不及格的分数，让你走上改变的道路。

5.你用太多的行动呼吁给你的访客施加压力

谁没在网站上看到过这个每一个按钮，一直往下这个页面吗?虽然我不得不通过坚持网页设计的“一件事”原则来赞扬这些网站，但这实在是太多了。

号召行动应该是有帮助的．它们应该战略性地放置在用户可以进一步深入网站的逻辑位置。

过多的按钮只会阻止用户点击它们。这给人一种噱头和咄咄逼人的感觉。没有人喜欢咄咄逼人的销售人员——但你的网站是所有销售人员中最咄咄逼人的吗?(诚实)。

这不仅仅是位置的问题，想想层次结构你正在用你的按钮的样式创建。一个有效的CTA不一定要用红色和粗体字。每个CTA都不应该一模一样。

最具威慑力的风格应该是bottom-of-the-funnel提供命令最少的(像a鬼按钮)应该是简单地引导用户到内部页面的链接。

另外，不要害怕添加文本链接。有时链接不需要是一个按钮，而是一些带有简单箭头的文本，以显示用户可以深入。

6.你使用了太多的动画

动画和视频现在在网页设计中非常流行。

严肃地说，每个人似乎都在尝试移动元素。特别是在视频的情况下，它是看到的巨大的成果．

说到动画，使用侏罗纪公园法则你可以做，并不意味着你应该做。当页面上的每个元素都移动时，它只会分散用户的注意力。它唤起人们对一切事物的注意，但却什么也没有。

亲爱的凌。我该去哪儿找?

有意地放置动画，将访问者的注意力吸引到关键元素上，比如漏斗底部的商品，即时聊天，甚至联系方式都非常有效。

另外，不要被动画吓倒。有时最小的动作可能是最有效的。这不是“要么做大，要么回家”的策略。

7.你在《Bells & Whistles》背后隐藏内容

我们看到了使用不必要的悬停效果一次又一次。这是对“你能让它流行吗?””的请求。

但问题是，它们会让用户感到非常沮丧，几乎无法在手机上运行，并且完全隐藏在屏幕阅读器中——事实上，上述易用性问题也同样适用于此。

我们已经讨论了很多关于以用户为中心的问题，以及它不仅对你的设计产生的影响，更重要的是对你的内容产生的影响。

如果你花时间去创造优秀的内容，并专注于解决用户最大的痛点，那么你为什么要将其隐藏在悬停效果、标签或手风琴效果中呢?

这又回到了我之前所说的——不要让你的访问者思考。

在这种情况下，不要要求用户挖掘你的内容，然后假设他们一旦找到它就会知道如何访问它。这是一种令人沮丧的用户体验。尝试最佳实践，找到显示内容的方法，以便用户能够轻松阅读。

最后，隐藏内容完全疏远了整个用户群体。

屏幕阅读器无法阅读隐藏的文本。所以，如果一个视力受损的用户导航到你的网站，网站的整个部分他们根本不能消费。

8.你仍然在使用劣质的库存照片

我不敢相信现在已经是2019年了，我仍然需要说这句话，但我们又来了——库存照片是显而易见的，它看起来就像它感觉一样假．

“我是一名职业女性，我确实是非常对这些图表感到不安。”
“她牙缝里有菠菜——我要告诉她吗?”

现在，公平地说，我知道为什么有时候公司会掉进使用它们的陷阱。

并不是每个人都有足够的预算请专业摄影师拍摄照片，而且有很多企业不喜欢用智能手机拍摄，所以库存摄影可能是唯一的选择。

我不是说库存摄影是不可接受的，但我是说你可以做得更多对你选择的库存照片更有目的性．

不要只想着挑选一些库存照片考虑策划一组代表你的品牌的图片．

保持一些小东西的一致性，比如灯光、拍摄对象的穿着方式、他们使用的技术，所有这些都有助于塑造一个完美的品牌形象，而不是在你的网站上随意插入图像。

这些随机的图片并不能代表信任，用户怎么知道你的公司哪些是真实的，哪些不是呢?如果你被认为是不值得信任的，你的买家的旅程将难以置信地比大多数。

9.你的幻灯片/弹出式cta和聊天机器人压倒性的访客

我极力提倡帮助你网站上的用户，我们整个网站的方法论但在有用和烦人之间有一条细微的界限。这是一件非常非常容易让人讨厌的事情。

弹出式呼叫行动和活聊天机器人总在问你是否需要帮助的人，就像在电器商店里离你两步远的烦人的20多岁的电子产品销售员问你是否需要帮助一样。

听着，我会在需要的时候寻求帮助的，谢谢，但现在我想做一些自我发现。

最好让用户知道你在那里，准备好在他们需要的时候支持他们。但是，一旦你让他们知道了，就让他们做自己的事。你不需要在他们每向下滚动20%的页面时就弹出一个新的退出意图。

如果你的网站策略是有价值的，它将把你的用户带到他们需要去的地方，而不是纠缠他们。如果你觉得它做不到这一点，重新访问你的导航和页面结构。

10.没有上下文的图标

图标很酷。我们实际上一直在使用它们。但是，我们有一个简单的规则，图标不允许单独存在。

几年前，图标非常流行。现存的每一个网站都没有任何优点，除非他们有自己的定制图标集，期望翻译概念的每一个细节。

这太疯狂了。

图标，很像图像，帮助提供必要的，可浏览的背景，在网站上的副本。也就是说，图标不应该用于你网站上的每个标题、信息框和菜单项。

所有这些只会造成视觉上的混乱，而实际上并没有增强用户体验。

要有目的性，要有目的性，要有品牌意识。

额外收获:你在网站文案中过多地谈论自己

好吧，在这个列表的最后，我不得不谈谈我最讨厌的事情之一——这可能会让你感到惊讶，因为我是一名设计师。但是，这是我们每月最常见的错误之一网站的围墙是只谈论自己的网站．

这是无聊的，徒劳的，毫无用处的。

看看你现在的网站，计算你使用“我们”和“我们”短语而不是“你”陈述的次数。

你的网站是关于你的用户，而不是关于你自己。

当创建网站文案时，你应该高度专注于解决用户的问题。想想他们访问你的网站、研究你的产品或服务是为了解决什么问题?

你的文案，你的网站导航，你的资源应该集中在帮助用户解决他们的问题上。而不是你有多伟大。

这里有一个提示——如果你的主菜单中有一个标签为“解决方案”的部分，你的导航并不能帮助用户解决他们的问题。简单地切换到“我们如何提供帮助?”将注意力重新放在用户身上。

“我既不承认也不否认我做了其中的一些事情。但如果我知道，我现在该怎么办?”

我是不是戳到你痛处了?别担心。不会有事的。这张清单上的所有内容都是完全可以修复的，而且大多数问题都可以在不做大量繁重工作的情况下解决。

如果你还在怀疑，我能理解。这些事情很难放手。但是，帮我个忙，确保你的用户能够接受这些决定。

如果您的网站上现在有一个(或多个)这样的例子，您能做的最好的事情来证明或否定它们的有效性是做一些用户测试．

围绕这些元素做一些实验。也许你想看看用户是否参与了某个部分或者你想看看它是否真的推动了转化率，不管是什么情况，写下它是什么，并决定你想测试它多长时间。

然后，定义一个成功的参数。“嘿，这真的有用!”“看起来像什么?是X转换量吗?是特别的吗跳出率？一个热点图分数吗?不管是什么，都写下来。

现在，利用你的工具!您可以很容易地使用工具收集的数据谷歌分析和幸运的橙色对于这些测试。真正的数据是完全了解用户实际反应的唯一方法。

运行实验，读取数据，并做出相应的更改。

你在你的网站上做的实验越多，你就有越多的数据根据用户的需求和行为做出明智的改变。