详细内容

值得关注的网页设计趋势

image.png

在美学和功能之间平衡是一件很难的事,但是要做到正确,你就做好了提高用户参与度和转化率的准备。


1.不规则的网格布局。

网格化布局为设计者提供了一种简单的方式,可以把网页的所有元素组合在一起,给每一个页面提供一个主题,使它更容易浏览。这一设计理论始终存在,但是它们的应用已经改变。

2017年3月,CSS网格的引入,给设计师更多的选择。设计者们正在转向使用更加中性的空间和不规则的网格来实现超现代的设计风格。该方法包括渐变设计和简单的空白样式,使内容突出,便于阅读和浏览。这种风格也更容易被眼睛看到,鼓励用户在你的网站上花费更多的时间。

它们不同于当时的风格,但是它们对渐变的现代化影响了整体设计,现在已成为创意中流行的设计选择。在stripe网站上可以看到另一个现代渐变的例子。

2.字体清晰,颜色鲜艳。

与这些现代设计风格相辅相成,你需要突出字体。抓取大标题、大胆的字体风格有助于用户关注你的内容,而字体之间的空白处让你更容易阅读和浏览内容。他们是最好的补充。由于人们通常只花几秒钟,至多几分钟,浏览你的页面,你需要用突出的颜色和设计来吸引他们的注意。其目的是为用户创造一个简单而愉快的体验,让他们尽可能长时间地在你的网站上保存这些内容,并最终转化成付费用户。

还可以看到这些字体和颜色来替代图像。它尤其适用于移动设备。图像会减慢页面速度,但缩放排版的大小不会影响性能。这也能在页面上创建更清晰的线条,帮助你实现号召式的语言。

3.设计者将旋转木马放在过去。

你有没有注意到旋转木马(网页顶部的幻灯片显示了多种图像和文本)在过去的一年里很少出现?就像上面的图片一样,我们可以看到品牌不断向前推进新的创新设计,并且让过去的旋转木马保持原样。该品牌致力于网页设计,一次将所有的信息都显示出来,而非将有价值的内容和CTA隐藏。另外,轮播会增加网站载入时间,从而提高网站页面跳出率。

4.精心设计的页脚样式。

在过去的几年里,网页设计的页脚一直被忽略,或者从整个网页设计中排除。网页设计中最引人注目的趋势是“页脚升级”。以前用来提供联系信息或注册表单的内容已转换为包含主页的其他元素。就像上面的例子一样,他们在页脚区域包括了其他的元素,现在感觉到包含了整个网页设计。

5.UX驱动斜角。

最近几年,我们已经看到了使用直线、水平线来划分站点页面的各个部分的趋势。关于这个问题的一些用户经验研究后,我们发现使用对角线作为分隔线,不仅在视觉上很有趣,而且还能为用户的眼睛创造方向,让用户可以跟随页面,或者直接指向呼叫-to-行为。使用对角线设计会增加整个站点滚动的用户数量。

6.要注意抽象形状。

Web设计趋势包括使用抽象图形。为了给用户带来更多的吸引力,我们开始看到品牌的多元化设计。Elje组很好地介绍了这些图像,但并没有实际嵌入照片。值得注意的是,公司也开始将现代渐变融入其设计!

7.改善用户体验。

增加的用户体验是网页设计中一项有趣的特性。《纽约时报》开发了一套系统,当你翻转浏览你正在阅读的文章时,你就可以在页面顶部引用你能看到的目录和文章标题。这样,用户在浏览大量,内容繁重的网站时会感到更轻松。另外,这种网页设计使得顶部导航更加完善,创造了更好的用户体验。

8.网页设计者的深度也越来越深。

大的下拉阴影在外观上越来越流行,看起来不会很快。Olapic就是利用这种网页设计趋势的公司。在上述视觉效果中,他们通过添加大而不透明的阴影和重叠图层来增加更多的深度。

设计这个网页的关键是要确保所有的阴影都朝同一个方向进行,就像它们来自一个光源一样。

9.增强微交互。

用户对文章和私密信息的反应会有不同的反应。通过这些微交互,用户可以不用重载页面就可以与他人进行交互。

这种方法有别于传统的静态网站用户体验,它需要用户重新加载页面,比如提交评论。这个场景看起来有些不方便,但是它会给用户造成速度上的障碍,导致他们中有些人跳过页面,这意味着你将失去潜在的转换。微型交互帮助平衡这些速度上的障碍,为用户提供更丰富的交互。

在你的网站上使用微交互,可以让用户实时交流,并提高他们在移动连接领域所期望的速度和连接能力。

10.更高级的滚动触发动画。

滚动式触发器鼓励用户通过特定触发的交互元素,继续向下滚动网页,从而增加参与度。最好的滚动触发动画是简约风格,旨在增加转换。

滚动式动画也会清理你站点的外观。网站上没有一系列的按钮和菜单,你的站点将会传递给你的用户真正的互动体验。

11.响应式设计。

应答设计不是一种趋势,而是一种原则,它已经存在多年了。但其重要性也不容忽视。回应性设计指的是网站设计时根据不同的屏幕大小进行调整:移动设备、平板电脑、电视、可穿戴设备或桌面。

尽管已经进行了近十年的用户体验革命,但是最近其应用范围才更加广泛。这种设计元素还会继续扩展,以包含新形式的技术,如增强现实和虚拟现实。

seo seo