2023 年值得期待的 5 种网页设计趋势

已发表: 2023-02-14

基本上每个行业都会出现趋势,网页设计也不例外。 有时,感觉每个新网站都在复制相同的设计功能,这不一定是坏事。 通常,这些网页设计趋势变得流行,因为它们提高了可用性并使您的网站从过时的美学外观中脱颖而出。

从声控界面到“滚动讲述”,2023 年的网页设计趋势都是关于增强可用性和为用户提供体验网站的新方式。 通过研究这些趋势,您将能够为您的下一个设计项目提供灵感。

网页设计趋势

在本文中,我们将讨论五种网页设计趋势以及它们如此流行的原因。 让我们开始吧!

目录:

  1. 声控界面
  2. 水平滚动
  3. 高级辅助功能
  4. 滚动条
  5. 视差滚动
今年值得关注的 5 个#web 设计趋势️
点击鸣叫

1. 声控界面

在过去十年中,人们浏览网络的方式发生了翻天覆地的变化。 如今,大多数人主要通过手机和其他小型设备与网站互动。 最重要的是,大约 40% 的美国消费者使用语音命令与网络交互[1]

其中很多交互都是语音搜索。 事实上,如果您关注搜索引擎优化 (SEO) 新闻,您就会知道尝试将人们使用的语言与语音搜索结合起来被认为是最佳实践。 这样,您的网站更有可能出现在大量用户的结果中。

一些网站在语音方面开始更进一步,将其纳入导航和转换过程。 例如,Speechly 等服务使您能够将语音功能整合到您的站点中,例如允许使用口头命令填写表格和将项目添加到电子商务购物车:

Speechly 网站

这种类型的功能有可能将网站的可用性提升到一个新的水平。 随着声控界面成为网站开发的主流工具,使用触摸屏和鼠标或键盘浏览网页有问题的用户肯定会开始要求他们最喜欢的网站提供这种功能。

此外,声控界面有可能让用户跳过复杂的导航序列并寻找正确的元素。 例如,您可以说“带我去收银台”,而不是寻找购物车图标。 从理论上讲,这可能有助于降低跳出率,因为用户将能够在多种方式之间进行选择来浏览网站。 无论哪种方式,当谈到网页设计趋势时,在可预见的未来,语音激活将继续成为该行业的一股力量。

2.水平滚动

垂直滚动是网络的核心组成部分,很少有人考虑替代方案。 绝大多数网站都设计为通过向下和向上滚动来查看,那么您为什么要考虑水平替代方案?

问题是,水平滚动可以很好工作,因为大多数用户并不期望它。 此外,从一侧移动到另一侧以导航页面并不会真正影响其功能。 唯一改变的是你如何设计它。

LA Art Box 网站是使用水平滚动的网站示例,这是今年要遵循的网页设计趋势之一。

很长一段时间以来,水平滚动一直被归为小众艺术网站和代理机构组合,它们使用它来在视觉上脱颖而出。 现在,网站开始以有趣的方式将水平滚动融入到他们的设计中。 例如,您可以让您的网站设计部分(例如画廊)在全屏水平滚动以更加身临其境。

借助 WordPress 插件,在画廊中实现此功能非常简单,您可以使用其中的许多插件来创建令人惊叹的水平滚动元素。 如果您想将水平滚动融入您的下一个网页设计中,我们建议您在微交互方面不要过度使用它。 这是许多水平滚动网站常犯的错误,它会严重影响网站的性能和可用性。

3.高级辅助功能

可访问性一直是优秀网页设计的关键组成部分。 然而,设计的这一方面每年都变得越来越重要。 在 2023 年,我们一定会看到更多的设计师在他们的项目中强调可访问性。

有很多方法可以使用设计来使网站更易于访问。 Web 设计可访问性的最新趋势之一是关注单手滚动。 我们也将此称为“拇指设计”,因为它围绕着只用拇指导航站点。

能够仅用一根手指触及页面上的每个元素非常重要,因为绝大多数用户都依赖拇指进行导航。 他们依靠其他手指进行更高级的交互,例如填写表格。

网页设计中可访问性的另一个增长趋势涉及向网站的媒体元素添加隐藏式字幕。 由于 YouTube 等平台在自动字幕方面的进步,这相对容易实现:

YouTube 视频中的隐藏式字幕和其他形式的可访问性将在网页设计趋势中保持强劲。

最后,如果您想在 2023 年让您的网站尽可能易于访问,我们建议您重新考虑其调色板。 有些颜色对于有视觉障碍的用户来说特别难以区分,包括海军蓝、棕色、黑色、淡绿色和其他类似的色调。

避免使用这些颜色可能不切实际,但您应该做的是不要将它们用于导航菜单等关键元素。 请记住,就网页设计趋势而言,可访问性和可用性胜过风格,这也适用于颜色。

4.滚动讲述

滚动是我们与网站互动的主要方式之一。 您在网站上向下或横向滚动,找到新元素,并与您想要的元素进行交互。 这是一种已经使用了几十年的优雅方法。

“Scrollytelling”试图利用我们都习惯于滚动来帮助讲故事的事实(顾名思义)。 您可能已经在长篇新闻故事中看到过这种设计技术,其中页面的设计会随着您滚动而变化。 这也是展示科学数据和统计数据的好方法:

使用滚动条呈现的年度报告

滚动讲述是一种强大的技术,因为它会迫使您在浏览页面时注意页面。 这一点尤其重要,因为网络上的大多数用户只会浏览内容,即使内容非常吸引人。

此外,滚动讲述为滚动浏览网站的简单行为增加了一层交互。 用户不再是被动的查看者,而是仅通过导航就可以更改页面的设计。

现代滚动讲述涉及视差,通常还涉及 HTML5 和 JavaScript。 这是因为 HTML5 使您能够以过去不可能的方式为网站的某些部分制作动画。 当您将它与 JavaScript 结合使用时,您可以设计出令人难以置信的沉浸式故事,这些故事通过滚动发挥作用。

与我们正在讨论的大多数其他趋势不同,滚动讲述通常需要网络开发背景。 您可以专注于故事的设计方面,但您需要开发人员帮助您在网站上实施它。

5.视差滚动

视差并不是网页设计中的新元素。 事实上,这种技术已经存在了长时间。 过去,我们有时会建议避免视差,因为它会对您的网站产生性能影响,即使它看起来确实很棒。

如今,移动设备和计算机可以更有效地处理视差滚动。 这意味着您可以将此技术融入您的设计中,而不会对用户体验产生负面影响(除非您对所有内容进行视差处理)。

视差滚动通常是滚动讲述的主要组成部分。 这种技术使页面上的元素能够随着用户导航而移动。 但是,您不一定需要坚持使用视差作为讲故事的工具。 您也可以选择合并它只是因为它看起来很棒。

如果您使用 WordPress,将视差滚动整合到您的网站中相对容易。 许多 WordPress 主题都带有旨在使用视差效果的元素,例如 Neve:

尼夫主题

或者,您可以决定使用插件实现视差滚动。 Advanced WordPress Backgrounds 等工具使您能够为特定的 WordPress 块添加视差效果。 这意味着您可以将其限制在您想要的网站部分。

高级WordPress后台插件

控制将视差应用于哪些元素是必不可少的,因为您不想在每个页面上都过度使用它。 视差滚动非常适合需要在视觉上脱颖而出的设计部分。 但是,如果您过度使用该技术,它可能会产生相反的效果,使您的网站更难浏览。

回到顶部

结论

密切关注 2023 年的网页设计趋势将帮助您保持项目的清晰度。 跟随趋势并不丢人,只要它们是好的,它们会使您的网站更具吸引力,也更易于浏览。

在网页设计方面,可用性应该始终处于您所做的任何更改的最前沿。 这就是为什么 2023 年这么多最流行的网页设计趋势都关注这些元素,包括:

  1. 声控界面
  2. 水平滚动
  3. 高级辅助功能
  4. 滚动条
  5. 视差滚动

您对 2023 年的网页设计趋势有任何疑问吗? 让我们在下面的评论部分讨论它们!

今年值得关注的 5 个#web 设计趋势️
点击鸣叫

……

不要忘记参加我们关于加速您的 WordPress 网站的速成班。 在下面了解更多信息:

参考
[1] https://www.oberlo.com/blog/voice-search-statistics