上云科技 以数字成就品牌之美
网站建设 网站制作
电话咨询
欢迎免费咨询
在线客服

我们不断积累持续专注,
只为在数字世界打造更加出色的你。

2024年成都网站建设时应避免的8个网站设计错误
2023-11-12
208次
一键分享

您是否知道您网站75%的可信度取决于其设计?如果网站设计错误很多,访问者可能会认为您的公司不值得信赖。无论您是从头开始成都网站建设还是网站改版,避免这些错误都会让您的企业以正确的理由在网上脱颖而出。

网站设计

8个常见的网页设计错误

1、不优先考虑可访问性。

像事后才想到的那样对待可访问性是您可能犯的第一个网站设计错误。根据京上云营销网络团队的网络开发经理蒋小明的说法,以下是有关可访问性的四个主要错误:

颜色对比度不足

图像或图形的替代文本缺失或不当

视觉焦点指示器不足或缺失

俯瞰可访问的名称或标签

让我们更深入地研究其中的每一个。

色彩对比不足

颜色对比是一个经常被忽视的可访问性错误。这种错误经常发生,因为公司制作的网站以其品牌调色板为特色——通常在创建时并没有考虑到无障碍设计。

“当网站上使用的颜色组合在背景色和前景色之间缺乏足够的色彩对比度时,文本和图标可能难以感知,尤其是对于那些有色盲等视觉障碍的人来说,”凯利分享道。“根据2022 WebAIM Million年度报告,超过80%的主页存在颜色对比度问题!”

缺少或不合适的替代文字

使用屏幕阅读器的网站访问者依靠图像替代文本来描述图像或图形传达的内容。如果它丢失或没有充分描述图像,您将隔离需要它来细读您网站的读者。

“图片是您网站内容的一部分,因此以与传统网站副本相同的方式来思考它们很重要:通过在您的页面上包含图片来传达什么信息?确保您使用的替代文字传达相同的含义,”凯利说。

视觉焦点指示器不足或缺失

如果没有视觉焦点指示器,访问者将无法充分发挥您网站的潜力。“焦点指示器通常显示为链接和按钮等交互式组件周围的轮廓,”Kelly 分享道。“重要的是要清楚地指示页面上的哪个元素具有当前焦点,以便使用键盘导航并可以看到屏幕的用户确切地知道他们在页面上的位置以及与活性元素。”

俯瞰可访问的名称或标签

如果您的站点以视觉方式传达信息,请注意那些使用辅助技术的站点。“在设计以视觉方式传达信息的页面和组件时,应该使用辅助技术的可访问标签来传达相同的信息,”凯利说。

“例如,网页设计的一个普遍趋势是卡片组件在每张卡片的底部都有一个‘阅读更多’按钮或链接。每个按钮与哪个项目相关联的信息通过设计以视觉方式传达,但是对于屏幕阅读器来说,如果这些按钮缺少具有相关详细信息的可访问标签,通常很难区分这些按钮,例如“阅读更多关于营销中心”。 '”

2、忘记了响应式设计的重要性。

2022年第二季度,移动设备占全球网站流量的58%以上——这甚至不包括平板电脑。如果您的网站在移动设备上不像在桌面设备上那样易于浏览,您就有可能让访问者感到沮丧并增加跳出率。

“现在的用户比以往任何时候都更多地通过多种设备访问网站;手机、平板电脑、笔记本电脑,甚至电视。如果我们的内容在其中任何一个上看起来很差,访问者就会失去信任并点击/点击离开该网站,” 京上云副设计主管雷池勇分享道。“现在是断点时代!”

据京上云的首席产品设计师高春燕说,出现这种情况是有原因的。“网站通常是使用桌面网络浏览器中的工具构建的。一个常见的错误是假设您的客户将以桌面格式查看您的网站,而忽略了移动用户。”

3、为了美观而牺牲用户体验。

在过去几年中流行起来的网站设计错误之一是将美学置于功能之上。随着互联网变得饱和,“随着多年来新媒体和设计的大规模爆炸,卓越几乎是成功的必要条件。不幸的是,这已经以过度使用设计和图形元素而告终,这些设计和图形元素提升了用户的感官,但却缺乏或感觉与网站的真正目的脱节,” 京上云设计体验经理张文分享道。

根据 史小琴 的说法,这会以多种形式出现“......从淡化品牌价值主张的设计趋势到过度使用动画、内容和沉重的图形,它们增强了美感但变得毫无用处。这并不意味着应该采用极简主义或中性主义风格。它是关于平衡以及形式如何支持功能的。”

4、不投资定制。

走在市中心,您经过一家服装店,橱窗陈列富有创意,极具视觉吸引力。它展示了各种打折的服装,并通过背景和引人入胜的文案讲述了一个故事。然后,你路过一家商店,橱窗里的人体模特上只有几件衣服——什么都没有引起你的注意。

将您的网站视为企业的互联网店面。它应该反映您的品牌,并且对您的公司来说是独一无二的。最重要的网站设计错误之一是选择千篇一律的模板而不是对其进行自定义。

例如,默认使用标准英雄横幅可能会适得其反。京上云SAPG团队的高级产品设计师 苏晓明说:“我们都见过它们 - 导航下方的全宽图像通常带有白色或黑色文本,顶部有一个按钮。”

“图像要么非常亮,要么非常暗,或者以巧妙的方式裁剪以使文本清晰易读。我认为这是一个错误的原因有几个。首先是它太普遍了,以至于变得公式化和乏味。曾经引人注目的设计决定现在变得单调乏味。”

5、使用不转化的功能。

另一个常见的错误是使用低效的特征。无论一个元素在视觉上多么吸引人,请记住,首要任务是您网站的有效性。“另一个常见的错误是依赖旋转木马在同一级别展示多个内容,”Derby 分享道。

“无数研究表明,用户并不经常与轮播交互,尤其是在交互成本高的移动设备上。”

6、缺乏层次感。

您是否曾经访问过某个网站,却发现自己不确定应该将注意力集中在哪里?如果是这样,您可能会登陆一个缺乏层次结构的网站。“就像报纸如何使用标题和副标题来表示重要性一样,您网站的排版也应该如此,”兰德里说。

在您的网站上订购具有美学吸引力,但它也很实用。“网站元素的组织……为您的网站提供一个有凝聚力的结构,促使用户完成明确的操作,实现主要目标,并随后创造无缝体验,”史小琴 说。

解决这个问题并不简单,尤其是当您的公司拥有具有不同目标的广泛受众时。但是,根据史小琴的说法,您最好这样做,因为这个问题会极大地影响用户对您网站的体验。“缺乏等级制度会误导用户并阻止他们实现目标,”他分享道。

7、导航不清晰。

清晰的导航可以减少访问者登陆您网站时的摩擦体验,这就是为什么不清晰的导航如此困境的原因。“随着越来越多的企业进入数字世界,网站上的内容变得更加拥挤和复杂,在您的多个接触点和用户旅程中拥有清晰的导航和一致性将确保从第一位访问者到倡导者的平稳过渡,”Devia Pinzon 分享道.

8、没有有效地传达您的商业目的。

当访问者登陆您的网站时,他们应该能够清楚地了解您公司的业务。如果那张照片甚至有点模糊?您猜对了——访问者可能会放弃您的网站。

“网站访问者在加载您的网站时所做的第一件事就是确定他们是否到达了正确的目的地,”兰德里说。“您的网站是否在首屏上清楚地说明了它提供的产品或服务?”

您的网站应该提高您企业的信誉。如果它不能传达您的业务目的并确认访问者他们在正确的位置,则可能需要重新设计网站。

如何修复常见的网站设计错误

现在我们已经了解了最常见的网站设计错误,让我们讨论如何解决这些错误。别担心:意识是成功的一半。现在您知道要避免什么,您可以开始创建一个以网站设计最佳实践为特色的网站。

1、将可访问性放在首位。

“Web 可访问性意味着让每个人都可以访问网站及其上的信息,因此在设计网站时做到正确至关重要,”Kelly说。“当我们在网站设计中犯下这些常见的可访问性错误时,我们就为数百万患有某种形式残疾的人制造了可用性障碍。即使您的网站看起来很棒,但如果部分访问者无法访问某些内容或操作,它就无法充分发挥其潜力来满足您的目标和业务需求。”

以下是解决设计可访问性问题的一些可行方法。

创建用户角色以满足各种用户需求

确保您的角色具有包容性,并将可访问性纳入您网站设计的结构中。“尽早并经常考虑可访问性。在设计网站时,第一步通常是创建用户“角色”,以帮助确保网站满足各种用户需求,”凯利说。“确保你的角色包含各种能力是保证你在项目的所有阶段都考虑到可访问性的一种方法。”

自学无障碍最佳实践

详细了解可访问性最佳实践,以便在处理项目时将它们放在首位。“关于如何设计、构建和测试网站的可访问性,有大量资源、清单和指南,”Kelly分享道。您可以通过查看我们创建无障碍网站的清单来开始。

2、确保您的网站具有响应式设计。

通过响应式网页设计,您可以放心,无论访问者如何访问您的网站,他们都将获得无缝体验。幸运的是,制作响应式网站并不像看起来那么困难 — 如果您使用的是CMS等内容管理系统,您甚至可以使用已经适合移动设备的模板。

“想想您希望访问者从页面上带走的最重要的信息是什么,然后再考虑它在最大和最小屏幕上的显示效果,”Devia Pinzon 说。“你的目标是确保无论使用何种设备,访问者都会对你的内容有相同的理解。”

创建网站的移动版本后,您的工作还没有完成。“一定要始终在手机上测试您的网站,”兰德里提醒道。测试站点可能会发现您之前没有注意到的故障。

3、平衡审美情趣与无缝用户体验。

我们知道当网站将美学放在首位而功能放在第二位时会发生什么。在一个成功的网站上,可以在视觉吸引力与无缝用户体验之间取得平衡,使访问者可以浏览页面并找到他们正在寻找的内容。

根据史小琴的说法,实现这一目标主要归结为有效的团队沟通和协调。“设计团队应该忠于策略,确保设计支持用户的主要目标,并与开发、内容和SEO团队保持良好的一致性,”史小琴 分享道。

4、用心设计网站,不要害怕发挥创意。

仅仅因为您看到许多具有特定设计或布局的网站并不意味着您的网站也需要如此。“真正有意识地考虑应该在这个非常有价值的地方放置什么,”Derby谈到导航下方的区域时说。

问自己有关您对空间的意图的问题是了解最适合它的另一种有效方法。“图像是有意义的还是只是装饰性的?布局的设计是否鼓励用户阅读或采取行动?有没有什么有趣的东西可以吸引他们的注意力几秒钟?

类似于广告的横幅失明效应,用户开始直接跳过这些大型英雄部分,转而尝试深入了解下面真正有意义的内容。对于经常将最有价值的CTA放在英雄横幅中的网页设计师和营销人员来说,这是一个错失的机会。”

或者,您可以决定完全改变您网站的布局,这样它就不会在导航下方显示图像。超过 70% 的企业投资于设计,以帮助他们的公司从竞争对手中脱颖而出,所以不要害怕做一些在你的行业中没有其他人做的事情。

5、不要隐藏无法转化的特征信息。

如果您知道某项功能不会转化或访问者对其不屑一顾,请确保您没有在其上隐藏关键信息。(或者更好的是,完全放弃它。)如果您公司的网站具有轮播功能,请务必考虑最佳做法。

“关于轮播体验的一些可以改进的地方是使用高度可见的控件、限制幻灯片的数量以及将最重要的信息放在首位,”Derby说。“除了第一张幻灯片之外,不应隐藏任何重要内容,因此如果用户不与组件交互,他们一定会获得完整的体验。”

6、确保您的站点具有层次结构。

如果没有层次结构,您的网站就会让人不知所措、混乱且难以理解。然而,有了层次结构,访问者就清楚地知道在哪里看和读什么。幸运的是,您可以通过一些快速修复来在您的网站上实施层次结构。要获得一些想法,您应该研究一些专门从事现代网页设计中的层次结构的网站设计服务。

“一定要使用HTML标题标签和每个标签的大小来向用户传达每行文本的相对重要性,”Landry说。

史小琴 补充道,“为了避免这些错误,关注这三个主要属性至关重要:比例(使用大小差异)、平衡(分配视觉元素)和构图(组织元素)。应用格式塔原则,尤其是接近度,来生成一个有凝聚力的结构。”

7、确保您网站的导航直观。

如果您的网站导航有问题,您可能会在网站的跳出率中看到这一点。将高效导航视为无缝用户体验的必备条件。

“直观的导航可确保流畅的用户体验并支持用户的旅程,提供轻松的信息发现或返回特定点的方式,”史小琴 说。“为了保证这一点,团队应该定义导航级别(最好不超过三个)以及不同级别的页面如何链接回其父级别。此外,验证正确的标签,让任何用户都能轻松理解并确认导航在不同的屏幕尺寸上工作,因为它们的行为可能不同。”

8、确保通过设计和文案传达您的商业目的。

您将使用引人注目的文案和视觉元素来实现这一目标。在开始之前,问问自己您网站的目的是什么。您是否正在创建一个电子商务网站,访问者可以从您的公司购买商品?或者您网站的主要目标是告知您的团队提供哪些服务?弄清楚您网站的使命是什么。您添加到站点的每个功能和副本都应该有助于实现该目的。您可能需要为您的企业使用IT服务,以最大限度地提高您的受众参与度。

避免常见的网站设计错误以提高网站可信度

通过避免常见的网站设计错误,您将提高网站的可信度,并为访问者提供他们想要再次访问的体验。

“成都网站建设是一项团队运动,需要一种循环方法,以确保团队、利益相关者和用户知识之间的良好一致性,”史小琴 说。“没有比测试和迭代更好的方法了,包括用户研究和可用性测试,以确保您的网站朝着正确的方向发展。”