2016 年 Web 设计的 6 大趋势

你一定遇到过很多关于网页设计的文章。 特别是在 2015 年产生影响的网页设计趋势，以及在 2016 年摇滚的趋势。但是，它们能说明趋势为什么会摇滚吗？ 我猜不会”。

我们并不声称自己是这个领域的终极专家。 然而，我们确实有自己的解释，证明了我们对今年网页设计趋势的真实预测是正确的。

1.忘记“点击”，只记得“手势”

你有没有想过滚动可能是多么辛苦，尤其是当你有无限滚动的时候？ 像《时代》这样的著名杂志在他们的新闻部分有无限滚动，这使得在故事中不断滚动变得很困难，几乎没有尽头。

当然，您可能会使用触控板、光标键或鼠标滚轮来简化桌面上的任务。 如果您在智能手机上访问同一个网站怎么办？ 唯一能帮助您的就是手指或拇指。 想象一下滚动或单击所需的精度。

看看这个场景，今天，滚动比点击更容易并不奇怪。 在您的手机中点击一个精确的目标实际上变得比以往任何时候都困难。 因此，我们希望大多数网站首先进行滚动，而点击则占据第二位。

我们完全有理由期待这种趋势只会向前发展而不会回头。 现代网站有太多东西可以点击。 由于每个页面上存在太多元素或组件，用户需要向下滚动整个页面以检查他们是否缺少任何号召性用语 (CTA)。

让我们举个例子来证明我们的观点。 该示例描述了较高页面、较少可点击区域和流畅的交互式滚动的显着特征。

图片来源： SerioVerify

SerioVerify可能是最好的网站之一，视差滚动的经典例子。 该网站以一种惊人而简单的方式嵌入了视差滚动，只需很少的点击，而且滚动非常容易。 它销售呼叫中心销售优化的云平台软件，并且做得很漂亮。

图片来源：JacobsPillow

JacobsPillow是基于手势的 UI 的另一个很好的例子，其中一个 Facebook 浮动栏从右侧出现，一旦你登陆主页。 更重要的是？ 当您将光标移动到视频按钮上时，它会从“观看视频”转换为“播放”按钮。

2.滚动时逐渐揭开文字

由于要显示的数据太多，加载过去需要大量时间的日子已经一去不复返了。 事实上，页面是可见的，只有在内容完全加载后。 现在用户不必等待太多，因为用户有机会看到页面，即使加载了部分内容。

图片来源：中

Medium是一个网站，用户可以在其中看到博客文章页面，只有标题，而实际的博客文章内容会随着用户滚动而缓慢加载。 这被证明是有益的，不会让用户在开始查看内容之前等待太久。 此外，用户总是在座位的边缘查看为他们准备的东西。

图片来源：负责任的导航

另一个例子证明了为什么这种趋势有一个光明的未来。 NavigatingResponsively将折叠与动画相结合，提供一个引人注目的主页，让您大吃一惊。 在这里，内容在图像和动画之间组织得很好，让它在页面滚动时显示出来。

图片来源：PlumeWifi

PlumeWifi是一个经典的视差滚动结合动画效果的例子，文本随着向下滚动逐渐显露。 这里要注意的一个独特之处是该网站保持了简单性，尽管在每个页面上都结合了所有三种效果。 事实上，订单页面非常好，细节清晰，字体清晰，导致结账扣款。

3.网站根据用户需求进行简化

今天，您拥有一大群专家用户，他们可能看起来很业余，但仍然表现得像专业人士，刷东西和访问多个标签，好像自古以来就适应了移动设备。 人们希望事情变得快，看到人们对缓慢的互联网速度感到恼火也就不足为奇了。

网站变得比几年前快得多。 今天，慢速网站的影响与根本不加载的网站一样。 更简单的设计绝对是一个理想的选择，因为它们不仅更容易扫描，而且用户在加载方面享受网站的快速响应时间。

这就是为什么拟物化设计时代结果不如预期的原因，仅仅是因为内容太多，用户等待不耐烦，网站加载时间很长。 与网站不同，应用程序在超极简设计方面功能强大。 它们提供了如此漂亮的界面，不仅性能好，而且看起来也很棒。

您已经看到扁平化设计是朝着简单化和直接方法迈进的良好开端。 随着 2016 年的推进，这一趋势势必会上升。 让我们分析一下这个趋势，并考虑一些很棒的例子。

图片来源：StinkDigital

StinkDigital是最好的网站之一，它证明了极简设计如何令人惊讶地令人赏心悦目。 当您访问主页时，您只会注意到两件事，一个菜单选项卡栏和一个显示博客文章的类似 Pinterest 的纸板样式。 在网站上移动非常容易，即使是新手用户也可以这样做。

图片来源：工作室旋转

StudioRotate是极简主义网站的另一个极好的例子，它的主页上只有一个菜单栏，然后​​以 About & Follow 的形式指向另外两个子菜单，并带有关闭子菜单栏的选项。

图片来源：约克郡茶

YorkshireTea是一个非常棒的网站，它展示了简洁、大字体和基于手势的号召性用语。 有太多的大尺寸字体、视频和茶壶形式的视频按钮可供使用，除非你讨厌茶，否则你一定不会被迷住。

图片来源：NeffAssociates

NeffAssociates是整洁和干净设计的完美组合，并结合了高效的动画效果。 当您访问主页时，您会出现文本，自行删除，并出现新文本。 这是为了告诉用户，相关的人什么都知道，你想让他知道。

4. 不再为像素而烦恼

只有少数人知道，什么是像素，更重要的是 72 dpi 像素如何组合成一英寸。 如果你有一个响应式设计，你会看到很多百分比和网格。 然而，仍然有一个领域需要处理一个巨大的挑战——位图图像。

迄今为止，超过 90% 的网站在全球建立； 分辨率甚至无法与当今的现代显示器相匹配； 也缺少比例因子。 在当今现代浏览器和显示器的世界中，是时候让矢量图像大放异彩了，去年势头强劲。

谷歌的 Material Design 已经推动了这一趋势，其图标基于字体。 您不仅拥有快速加载的网站，而且还可以根据要求调整图像的缩放比例，而不会损失质量。 这是一个理想的情况，特别是对于设计人员来处理现代网络浏览器。

虽然技术今天已经存在，但在构建高质量显示器时，专业人士需要时间来改变习惯。 一旦普通桌面变成视网膜级显示器，设计师必然会长期坚持这一趋势。

图片来源：洛夫菲拉

Lovefila是一个惊人的例子，说明图片完美像素如何产生巨大差异。 当您打开这个特定的主页时，您的整个屏幕上充斥着太多高质量的颜色和图片，让您在网站上停留很长时间，而不会让您的视线离开屏幕。

5. 对动画说“你好”

动画在将网站过时的风格隐藏在“建设中”的 Flash 动画或 GIF 之后起着至关重要的作用。 动画引发了讲故事，这使整个用户体验同时具有娱乐性和互动性。

但是，在处理动画时，您必须谨慎行事。 不要将它们放在任何地方。 围绕动画精心雕刻个性和其他故事元素。 让大型动画作为主要的交互工具，如弹出通知或视差滚动，而让小规模动画发挥辅助作用，如加载条、悬停效果、微调器等。

图片来源：白爪

WhiteClaw是理解这种 UI 风格的一个很好的例子。 在这里，您将动画效果与视差滚动相结合，以产生宏伟的效果。 有太多的小动画效果导致主页在向下滚动时对用户眼球造成重大影响。

6. 多样化的 UI 模式在未来激增

响应式设计非常适合您的网站，可能在每个屏幕尺寸上都可以看到。 但是，响应式设计确实存在一个缺点，即您的网站一直看起来都是一样的。 响应式设计失去魅力的其他原因是网站主题激增，以及基于 WordPress 的网站的兴起。

拥有相似的外观并不一定是坏事。 然而，设计模式已经成熟，用户的期望也已经成熟。 不过，您不能指望大量适用于 UI 模式的创新。

结帐将结帐； 登录表单应该看起来像登录表单； 等等。在每个地方都重新发明轮子是没有用的。 只需确保使用的 UI 模式应该为用户带来绝对流畅的体验。 让我们看一下当今流行的一些趋势：

• 汉堡菜单：单击时，展开并显示其中的子菜单。 看起来像一个带有几行短线的汉堡包，几乎在所有网站的顶部都出现。
• 注册表格：在 99% 的网站中发现的最常见趋势，是注册或登录网站的门户。 该表单附有创建帐户、登录、社交登录按钮、标签和表单字段。
• 长滚动或无限滚动：在实现长滚动或无限滚动时，您需要注意使用折叠上方和下方的空间。 将所有重要元素放在折叠上方以便快速查看，同时将讲故事放在折叠下方，保持惊喜元素完好无损。 将折叠分成两个清晰的部分，将保持井井有条，并提供令人赏心悦目的视图。
• 基于卡片的布局：这种布局在 Pinterest 诞生之初就非常流行，后来在许多网站上实施。 每张卡片代表大量信息，形成一个统一的概念。 它们的矩形形状可以更轻松地重新排列内容容器，创建单独的断点。
• 中央图像：视觉是人类体验到的最强感觉。 特别是，高清图像会立即吸引用户的注意力。 随着数据压缩和带宽的进步，即使有高质量的图像，也更容易避免加载时间变慢。 放置在首屏的英雄图像或中心图像会在第一眼中产生持久的影响，其次是基于卡片的布局或创意部分。

图片来源：StockX

StockX是一个很好的例子，说明中心图像如何使您的电子商务商店异常出色。 您可以在整个商店中看到其他趋势，通过探索数千种产品进行无限滚动，基于卡片的样式布局以无限行描绘产品 3-5 个产品等等。

2016 年有很多事情要做……所以请拭目以待！

2014 年是移动使用取代桌面使用的一年。 然而，在创建移动网站和移动应用程序之前，组织仍然首先在其桌面网站上工作。 2015 年，无论是在台式机还是移动设备上，网站都变得极简而重要，呈现出一丝专业性。 关键词成为热门话题，更简单的网站吸引了用户的眼球。

随着 2016 年的到来，许多在 2015 年震撼的趋势，如扁平化设计、响应式设计、视差滚动、无限滚动等，即使在 2016 年也将继续震撼，同时增强创造力、简单性和交互性。 此外，图像、动画、动作和博客文章的结合将成为普遍现象，支持 UI/UX 有利于用户。

如果您有任何其他趋势，请随时在评论部分发布！