Web 3.0：全新的Web设计时代已经到来

你是否注意到现在的网站有什么不同？与几年前相比，网站的设计发生了变化。许多人称这种变化为web 3.0的到来——一种新的网络设计时代。

从更大的角度来看，web 3.0关注的是数据及其管理。我们生活在一个信息时代，随着数据量的增加，对其管理的需求也在增加。

你以前听过区块链(blockchain)和去中心化网络(decentralized web)的名词。

你也会听说过人们想要把权力从像google这样的公司中夺取出来，甚至是facebook，后者在近年来出现了一些与隐私相关的问题。

那么人工智能(ai)和机器学习(machine learning)呢？

这些都是真实存在的技术，以一种形式或另一种形式融入到现代网络中。目标很简单，个性化用户体验，使网络更加易用。

然而…

这篇文章与上述技术都无关

尽管我理解以上提到的所有技术在当今时代都非常重要，但我在这篇文章中的重点是web design 3.0。

换句话说，过去五年里网站发生了什么变化，web 3.0对网站设计的影响如何？

这就是web曾经的样子：

在2000年代中期，我们开始看到web 2.0的出现，大致如下：

但是，与web 3.0的设计相比，这简直不值一提：

新的网络设计时代强调完美的精确度，冲击性的配色方案，并添加了与整体设计相辅相成的新设计元素。

那么，我们是如何走到这一步的，你需要了解些什么呢？

什么是web design 3.0：回答你的问题

在这一部分，我将重点回答以下问题：

• web 3.0网站与以前的网站有何不同？
• 为什么设计师使用如此多的形状和其他设计元素？
• 页面构建工具是否跟得上潮流？

在回答这些问题之后，我们将看看最前沿的设计工具，以及一些你可以找到设计灵感的平台。

那么，让我们开始回答第一个问题。

#1：web 3.0网站与以前的网站有何不同？

我想说，近年来最显著的变化是增加了创意元素。

设计师们对使用背景元素（如形状和曲线）来实施特定的设计导航路径变得更加自如。

当正确使用时，形状和斑点可以帮助突出有价值的内容，同时提供愉悦的用户界面（ui）。

除此之外，web 3.0设计还使用了大量的插图和视觉内容。不仅丰富页面，而且常常用于说明特定产品或事物。

一旦你看到这样的设计，你就知道这个公司付出了很多努力，以使用户体验愉悦。

2018年末，mailchimp重新设计了他们整个网站，其中一项新引入的内容就是使用插图。

以下是使用插图的前三个原因：

首先，插图能够引起访问者的注意，与其他任何内容不同，但这并不是重点。

• 将复杂变简单。传统上，网页设计师会依靠标题来解释他们的产品。如今，插图可以为您做大部分的工作。您可以围绕您的产品及其特点设计整套插图。毕竟，视觉学习是一种现象！
• 品牌形象。您所使用的插图风格可以帮助推广积极的品牌形象。插图可以展示不同的品牌价值观、优势和特点。这是无法单凭文字表达的。
• 视觉特征。每个品牌都是不同的。通过视觉，您可以展示与众不同的身份。

这也适用于图标和动画等有关元素。这两者都需要稍微更多的个体工作——最好由平面设计师完成——但奖励是有的！

第三个最重要的变化是排版。

字体一直是设计的重要部分。如果您还不相信，我向您挑战，将您网站上的字体更改为完全随机的字体。

好的排版所带来的差异是巨大的。自从web 3.0网站进入主流以来，字体的种类也变得多样起来。

你可以通过使用简单的网页设计来摆脱困境，纯粹是因为你使用的字体类型。我建议收藏书签，typewolf。

这个网站是有关排版和字体的宝库。jeremiah shoaf经营着这个网站。他多年来一直维护着自己的网站，并在网站上有成千上万个不同的列表。

此外，他撰写指南并定期维护他的“每日网站”目录。每当我开始一个新项目时，typewolf是我首先访问的网站之一。

通过学习排版及其对网页设计的影响，您将在使设计更具专业性方面节省大量时间。

#2：为什么设计师使用这么多形状和其他设计元素？

不仅是由专业人士设计的网站使用这种新趋势。大多数现代wordpress主题和框架也是为了实现这些趋势而构建的。

但是，为什么使用形状以及它们如何有益于网页设计？两个主要因素是美学和简约主义。形状和其他几何元素有助于将整个设计统一起来，确保流畅的流动和一致的用户体验。

传统上，各个部分会单独用不同的颜色来划分，有时甚至没有任何颜色。

在这个例子中，你可以看到简单插图的使用如何丰富这种极简设计和支持背景图案。这反过来有助于突出主要导航元素的可读性。

您还可以使用支持性背景元素来突出重要内容，就像这样：

总的来说，这是一种统一性和创造性思维的结合。如上所示的背景形状可以帮助实现色彩心理学以进一步提升用户体验。

在帖子的后面，我们将看一下最受欢迎的网页设计灵感网站。那里您将看到在网页设计中实现几何形状的不同技术。

#3：页面构建器是否跟上了潮流？

不仅是像visual composer和elementor这样的页面构建器可以帮助您构建更好的落地页，像squarespace、webflow和weblium这样的品牌在网站构建器领域也取得了显著进展。毫无疑问，所有这些设计工具都在遵循最新的网页设计趋势。

elementor已经下载了超过2500万次，它不断发展其组件库，以包含构成现代网页的元素。而weblium使用人工智能帮助没有经验的网站管理员创建视觉上令人惊叹的网站。

最好的部分是您永远不必写一行代码。现代页面构建器提供基于网格的布局，无需繁琐的技术细节。

您可以使用拖放工具创建新的行、部分和调整单个组件的大小。或者，您可以完全避免这样做，使用预先构建的模板。

不言而喻，学习html和css仍然是非常鼓励的，同样需要学习矢量艺术和常规图形设计。页面构建器容易出现效率低下的问题，只能通过深入研究代码来解决。

web 3.0设计工具：当前趋势

在早期，网站是基于线框图和草图构建的，您必须在纸上设计。photoshop在一定程度上有所改善，但当然还不及我们现在拥有的工具。

现代设计工具专门关注设计网站和移动应用的想法。这为像素级别的设计提供了可能性，可以将一些设计导出为现成的网站。

一旦您拥有了自定义设计，您可以专注于自己编写代码，或者使用页面构建器来实现接近完美的设计副本。

以下是会产生重大影响的工具。

#1：sketch

sketch是一种独特的mac os设计工具，可以说是市场上最好的数字设计工具之一。尽管它仅限于一个特定的操作系统。

sketch之所以如此受欢迎和追捧的原因之一，是因为它提供了几乎您在数字设计方面所需的一切，包括设计网站、移动应用、矢量图形，还有原型设计和外部插件以增加功能。

就个人而言，我真的很喜欢sketch的一点是它是一个非常强大的软件。就市场上的其他选择而言，它是具有代表性的专业软件的标准。

而就网页设计而言，sketch的一个令人兴奋的特点是它是专为支持网页设计而构建的。因此，您可以创建网格，可以创建多个图层，以及更多其他功能。

在很多方面，它就像是photoshop，但用于网页设计。它不包括您用于编辑照片的平均功能，但它提供了您编辑矢量图形，插入图像，管理字体，管理页面大小，创建额外网格等所需的一切。

如果您看一下现代网站，尤其是一些大品牌的网站，那么99%的网站都是使用sketch设计的，因此它在专业设计师中非常知名。

而且，如果您是一个新手并且想要学习，请查看这个在线课程。

#2：lunacy

正如提到的，sketch专为macos构建。幸运的是，icons8已经为windows用户创建了一种替代方案。而且最好的部分是，它完全免费。

lunacy是一款基于windows的矢量编辑工具，它从sketch借鉴了很多灵感。它作为一个独立的矢量编辑软件完全具备功能，但也支持sketch文件。

因此，如果您下载了使用sketch构建的任何项目，您将能够在lunacy中使用它们。最后但并非最不重要的是，lunacy是社区支持的。也就是说，您可以请求并对其他人提交的功能进行投票。

一切都是为了使设计网站的过程更加简便。

#3：figma

最后一个主要的网页设计工具是figma。恰巧的是，figma也是与sketch竞争最激烈的竞争对手。而且，它完全免费使用。它是为浏览器构建的，但也有桌面应用程序可用。

由于它是免费的并且具有大量功能，所以figma也是我自己最常使用的应用程序。用户界面感觉自然，没有任何额外的负担。所有按钮和功能都是为了让您无缝地创建自定义设计。

顺便说一下，我也喜欢使用figma进行任何类型的常规矢量作业。无论是创建报价、新的按钮样式，还是其他任何事情。

web 3.0设计灵感：向最佳学习

您无需参加ux课程来学习出色的设计原则。您只需要访问一些精选的灵感网站，您将很快了解当前的趋势。

以下部分致力于帮助您找到任何即将进行的web 3.0项目的最佳设计灵感。

使用列出专业设计的网站可以帮助鼓励您在未来做出更好的设计选择。

#1：lapa ninja

lapa ninja（拉帕忍者）是我最喜欢的灵感网站之一。我喜欢它列出的网站类型，也喜欢它追踪网页设计领域的最新动态。

坦白说，没有其他网站能像它一样做到这一点。此外，它的数据库中已经有超过2000个列表。所以你不必等待新设计的添加。我特别喜欢这个平台的另一件事是，你实际上可以通过分类浏览一个网站或单独的网站和设计。

你不仅可以选择博客或商业类别，还可以选择特定的类别，如作品集、健康和不同的行业。所以你可以缩小搜索范围。

除此之外，浏览起来非常简单，包括了我们在本文中讨论的大部分内容。

查看每个列表，很容易看到我们现在在网页设计中看到的变化。

所以这是一个非常宝贵的资源，你可以偶尔访问，或者在你陷入设计困境或计划设计新东西时访问。

#2: onepagelove

单页网站（one-page website）实际上是指没有其他页面的网站。有些人称之为落地页，但大多数人称之为单页网站。它们比你想象的要常见得多。onepagelove可能是最好的网站，为这样的网站提供适当的曝光。

与lapa ninja类似，你可以将搜索范围缩小到特定的类别。每个列表都包括一个完整页面的截图和一些关于作者的详细信息。

除此之外，你可以按照自己的喜好浏览并查看任何吸引你注意的网站。我无法回忆起有多少次我从onepage love列出的网站中借鉴灵感。它就是那么好！

#3: awwwards

最后但并非最不重要的是，我们有awwwards。可能是世界上最古老的网站灵感网站。然而，它在不同年份间保持了一致性。

awwwards的理念是人们提交网站设计，会员们对他们最喜欢的进行投票。之后，awwwards委员会进行个别投票，并决定一段时间内的少数几个获奖者。

通过成为获奖者，你可以在你的网站上添加一个特殊徽章，突出显示你在设计理解方面的卓越成就。

就灵感而言，这个网站上列出的很多设计都非常独特。这是一个真正有创意和有雄心的设计师的游乐场。

值得收藏，每周查看一次。

结论：从这里开始

网页设计是一个竞争激烈的行业。这不是因为人们想要制作比别人更好的网站。它最具竞争力的地方在于用户界面和用户体验。

找到吸引人们注意的新方法可能会带来更好的销售成果。此外，通过提供出色的用户体验，你会发现人们更经常地返回你的网站。

自2018年以来，越来越多的设计更加注重设计的视觉效果。因此，预计在这个领域会有更多的变化和增加。