可避免的设计缺陷会伤害您的网站

网络应该会变得更好,这就是承诺。 而且你会认为它会随着对可访问性和可用性考虑的所有意识的提高而增加。 但奇怪的是,我们已经超过了25年,并且事情实际上总体上变得更糟。 怎么会这样?

它不能归咎于教育。 互联网设计与开发的每门课程都值得一提,它涵盖了良好设计原则,可用性和可访问性的基础知识。 它不能归咎于工程标准,因为W3C指南比以往更加严格和明确。 它也不能归咎于技术,因为该技术更支持开发高质量的网站,而不是更少。

不,这个悖论的答案实际上非常简单。 这是因为设计师的力量被营销人员及其客户的需求所剥夺。 所以设计师知道文本和背景之间应该有很好的对比,但是他或她不能实现那个好的设计原则,因为营销人员认为使用“暗银”文本而不是黑色看起来会更酷。当然,我们必须为标题“淘汰Twitter使用的蓝色字体”,所以“所有年轻人都能更好地认同我们的网站。”

对“看起来很好”以及复制其他人正在做的事情的关注优先于高速,低带宽和良好的可用性等实际考虑因素。 如果您是需要就您的网站的外观做出决定的客户之一,那么本文适合您。 这也适用于那些有勇气与客户谈判以使网站更符合他们应有的方式的设计师,而不是像其他所有类似的网站一样。 现在是未来的时候了。

1。 对比度差

这最近变得时髦。 令人惊讶的是它可能是这样,鉴于在过去的25年代反复传递给我们的信息,我们必须避免对比度差。 这种时尚的前身似乎是Twitter和Bootstrap,但他们反过来可能受到其他人的启发。 我们来看一个例子:

以上是Twitter帮助页面中的一个片段。 设计背后的哲学似乎是一条信息越重要,它在页面上显得越暗。 因此,页面的H1标题是黑色文本,因为这似乎被认为是非常重要的。

虽然在屏幕截图中不清楚,但主体文本实际上是深灰色(不是全黑),因为它看起来很重要,但不如标题重要。

链接不是标准的蓝色,它们是“Twitter蓝色”,这是一种非常苍白的色调,与白色背景形成鲜明对比。

在页面下方的H2标题是比主体文本更苍白的灰色阴影,有些人会发现这一点令人困惑。 标题不应该比文本的其他部分更难以看到,除非它们是一个主要的分心(在这种情况下,你可能应该质疑它们是否需要成为标题)。

左侧面板导航选项也是浅灰色和浅蓝色调,并且这个想法似乎也是让这些项目淡化为无意义,因此它们不会分散您对主要内容区域的注意力。

最后,最苍白的区域是反馈区,这显然是最不重要的部分。 但即便是Twitter比这个网站做得更好:

从这个例子可以得出的唯一合乎逻辑的结论是,他们不希望你知道问题的答案。 如果你原谅这种表达,那就超越了苍白。

2。 编码错误

这只是一种极度懒惰的症状,甚至无法检查您的页面呈现方式。 在这个时代似乎不可能犯这个错误,但仍然不知何故人们正在设法做到这一点。 他们甚至设法以错误的理由去做,如下例所示:

看起来只是一个忘记将编码设置为UTF-8的普通情况,对吧? 除非它不是,因为此页面的编码设置为UTF-8。 网站设计师正确地做了所有事情,甚至将元数据中的所有撇号转移到实体字符39的极端长度,即使这甚至可能不是必需的。 将内容插入到设计中会出现问题,因为这里显然发生的是包含MS Word智能引号的错误编码文本已粘贴到内容部分,从而确保它在每个浏览器中都会错误地呈现,因为编码页面设置为UTF-8,内容不以UTF-8编码。

虽然大多数人都愿意忽略那些被称为“智能撇号”的小问题,但这非常令人讨厌,而且当标题中出现错误时,情况会更糟。 最重要的是,当您将内容发布到网络上时,必须检查内容是否正确显示,并且您应始终确保使用了正确的编码(大多数情况下将使用UTF-8或UTF-16)。 请记住,网站主要是关于第一印象,如果有人对您的业务的第一印象是“草率”或“懒惰”,那真的不好。

3。 使用Flash

根本没有理由再这样做了。 Flash已经过了一天,但那一天结束了。 仍然有很多网站,特别是赌博网站(最不合适的地方)仍在使用Flash。 此外,网络上一些最大和最成功的网站在许多不同的环境中广泛使用Flash。 所以,如果它对他们来说足够好,为什么它对你来说不够好?

好吧,有一点,Flash是一个巨大的资源匮乏。 它也充斥着漏洞,被恶意黑客作为特洛伊木马传递机制的目标,并且由于结合了持久性Flash cookie(也称为本地共享对象)而具有本质上的隐私风险。 这些cookie绕过了浏览器的安全设置,并且可能包含比常规cookie更多的信息。 更糟糕的是,LSO在不同浏览器之间共享数据,使普通用户更难以维护隐私。

充其量,对Flash了解得足够多的用户会将您使用Flash视为懒惰或过时,但也有可能用户认为您的业务缺乏安全意识,无视隐私问题,或者更糟糕的是你不值得信任。

可以在常规HTML 5中完成可在Flash中完成的所有操作,因此如果您仍在使用Flash向用户表明您不知道如何在HTML 5中复制功能,那么您太便宜了这样做,或者你是故意利用Flash的黑暗面。 如果你正在考虑使用Flash并且你没有不诚实的意图,那就不值得这么麻烦了。

4。 自动播放视频

如果用户普遍无法忍受一件事,那就是令人讨厌的假设,即如果您的网站提供视频内容,他们就会想要播放它。 新闻网站尤其对这种罪行感到内疚,他们中的许多人甚至无耻地将一个永无止境的播放列表添加到他们自动播放的视频中。 YouTube默认情况下也启用了自动播放列表,但至少他们不会自动播放您的第一个视频。 当然,用户必须选择自动播放,他们不应该选择退出。

有限带宽计划的用户,尤其是移动用户(其中​​大多数人),不会意识到您的网站在他们的浏览器中加载和播放视频而他们没有意识到这一点。 唯一一次可以认为适合自动播放视频的是视频非常小(以字节为单位),自包含,并为用户体验增加价值。

如果有这么多用户将这种行为描述为令人烦恼并实际上询问如何禁用它,那一定非常烦人。 是的,我们知道Firefox,Chrome和Chromium的用户实际上很容易完全禁用自动播放,但有多少用户真的很乐意在以下方面进行挖掘:配置或安装插件来阻止不应该的行为首先被剥削了?

请注意,我们在那里讨论了剥削问题? 这是因为HTML 5的创建者没有做任何错误,包括AutoPlay的可能性。 只是他们并没有预料到人们会像这样错误地使用它。

5。 无限滚动

这是另一个曾经被营销人员完全劫持的新颖而有趣的概念,使其成为挫折而非娱乐的源泉。 营销人员发现,如果他们在网页上使用无限滚动,他们可以让人们在页面上停留更长时间。

但是,搜索结果再一次讲述了一个故事。 看这个例子:

正如您所看到的,一般的基调是无限滚动令人讨厌。 它不会增强用户体验,会导致大量的可用性问题,并且随着页面的增长和生成更多内容,它可能会导致内存和性能问题。 当用户打开多个标签时,以及当提供商在多个标签中的无限滚动网站上提供富媒体内容时,尤其如此,这肯定会导致问题。

6。 在不需要时生成pop-under或pop-over窗口

任何不会增加用户体验的东西都会减损它。 脱离用户体验会产生怨恨,如果有可行的替代方案,用户将避开您的网站。 这就是为什么那些处于非常安全的位置的网站像在美国士兵的宣传玩具熊一样随意地甩到阿富汗儿童身边。 但是,熊至少带来欢乐,弹出窗口只会带来烦恼。

来自TripAdvisor的这种行为最糟糕的事情是,由于用户已经在他们的网站上,他们所做的事情确实没有任何意义。 TripAdvisor复制用户已作为pop-under的同一窗口的唯一可以想象的原因是:

  • 愚弄谷歌的跳出率分析
  • 如果你反弹,试着让你有第二个想法

这些都不是一个特别好的主意。 当然可能有其他原因可以做到这一点,但如果它们存在,它们并不明显。

7。 烦人的叠加

这不是“国际Bash TripAdvisor日”(但是),但由于他们如此慷慨地提供令人讨厌的网页行为的例子,它真的会看到一个礼物马在嘴里忽略这一点。 所以这就是TripAdvisor刚刚在我设置pop-under屏幕截图时所显示的内容:

你可能已经猜到了这个有点愚蠢。 这就是我已经在他们的网站上了。 我已经在考虑在他们的网站上购物了。 所以这个流行音乐除了妨碍我这样做之外什么都没做。 至少它不是那些类似的叠加之一,请求我订阅时事通讯或下载“免费”电子书。

绝对不应该使用这些东西,除非它是向用户提供一些非常重要的信息。 这方面的一个例子可能是如何玩他们在浏览器中请求的游戏,或安全或隐私警告消息。

这主要是常识问题(这可能是营销人员失败的原因)

真正显而易见的是,当你在网上做一些只对自己有益的事情,对用户没有任何好处,并且在某些方面给他们带来不便,侵犯他们的隐私,或者实际上花费他们的钱(如自动播放的情况)视频和无限滚动网站),用户会反感它。 也许不是所有用户,但足够的声音活跃多数影响了更多。

如果您的网站存在任何这些设计缺陷,您应立即采取措施纠正这些缺陷。 它们可能会损害您的公众形象并使用户远离您的网站。

标题图片由...提供 丹德拉戈米尔

波格丹兰萨

Bogdan是Inspired Mag的创始成员,在此期间积累了近6年的经验。 在业余时间,他喜欢学习古典音乐和探索视觉艺术。 他也非常着迷于修复工具。 他已拥有5。