2017 年网页设计的十大趋势

又迎来了崭新的一年,让我们来了解网页设计的发展趋势吧。“2016 年是对话式商务的元年。”“GIFs 是伟大的。它们无处不在。”


又迎来了崭新的一年,让我们来了解网页设计的发展趋势吧。

2017 年网页设计的十大趋势

随着技术的蓬勃发展,它们已经深入到了我们日常生活的方方面面,而用户们也越来越注重线上的体验。

自身、互动、相关这三个关键词,是用户期望通过他们的 UX 设计来满足的体验。而这也意味着网页设计师将要面临更加严峻的网站开发挑战,他们需要感知用户的体验,并贯穿到网站开发的全过程。

2017 年会出现哪些新趋势?

去年,我写了篇关于 2016 年七大网页设计趋势的文章。它受到了众多网友的关注。因此,我决定不再更新去年的文章,而与大家分享一篇关于 2017 年网页设计趋势见解的新文章。

让我们开始吧!

1. 传统网页设计的消亡

网页设计正从传统的概念中逐渐的消亡。或像 Eric Meyer 在最近的 Offscreen 杂志中所说的,他停止称自己为网页设计师,而是称自己为“体验设计师”。

在传统的网页设计中,设计的作用更多是让研发人员看起来不错,而现如今网页设计已演变的不仅如此了。

网页设计师(或体验设计师)不再只是使网站“看起来美丽”。 相反,他们需要研究用户的体验以及他们之间的故事。

2. 对话式 UI

2016 年是对话式交互发展的重要的一年,作为 hashtag 的创始人以及前 Google 员工Chris Messina 说:

“2016 年是对话式商务的元年。”

Chris 在这篇文章里提到,人们将通过聊天应用,通讯应用和其他自然语言界面来与公司、服务商和机器人进行交互。作为通讯应用平台(例如 Slack,Facebook Messenger 或 WeChat)也超越了社交网络应用的下载,企业开始思考如何利用这一变化。

2017 年网页设计的十大趋势

因此,对话式用户界面(例如网站)的设计,将成为大多数网页设计师在 2017 年关注的重点。

2017 年网页设计的十大趋势

虽然,仍然有诸多问题尚未解决,但请放心:对话式界面将成为 2017 年里的一个主要的话题。

3. GIFs 和其他动画

众多的网站和应用程序正在使用着动画,而 GIFs 也逐步的成为了主流。

作为 Buffer 网站的内容制作官 Ash 说:

“GIFs 是伟大的。它们无处不在。”

现在它已经内置到 Facebook 和 Twitter 中,你也可以将 GIFs 用于你的网页设计。

但不要过度的依赖它们——虽然,它们很好的吸引了用户的注意。GIFs 可让你提供更丰富的产品体验,演示工作流程,或者为你的客户提供简单的指导。

2017 年网页设计的十大趋势

随着多款 GIF 制作工具的出现(如 Photoshop,Giphy 或 record.it),网页设计师在其设计的过程中也不会受到限制。

4. 下一代响应式设计

响应式设计将继续占据着主导地位,因为它是实现最佳用户体验的有效方式之一。CSS media queries 为网站提供了灵活性,并根据访问网站的不同设备进行调整。

2016 年 4 月,谷歌对网站的排名算法进行了调整,并对网站内容进行了优化。我们看到了不少公司正忙于重新提升他们网站的 Google 排名。

作为建站者,我们必须接受这种情况。虽然,没有一个通用标准,但我确信的是网站提供的选项越少,响应的时间越短,那么网站的转化率就会得到提升。

2017 年网页设计的十大趋势

5. 极简主义的网页设计

在 2017 年极简主义将会达到一个全新的高度。当用户点击首页后,呈现的将是类似于“卡片”一样的展现,它们成为了用户获取网站更多信息的入口。而对于网站本身,多图片的展示也可用于可视化的专题推荐,并可以促使用户进行点击。

2017 年网页设计的十大趋势

Netflix 就是一个比较成功的网站示例。卡片图像不仅能够诠释节目或电影的更多内容,而且可以减少网站的使用空间。

总体上,人们更青睐那些在视觉上清晰、简单的网页设计。

6. 数据可视化

现如今,数据和分析越来越重要。而大品牌服务商正为用户提供了一个查看自己网站的统计数据的机会。

2017 年网页设计的十大趋势

通过可视化的数据展示来增加用户与数据间的交互。当涉及让用户更好的表达时,丰富多彩的图表会特别有用。例如你可以使用 Tableau 来创建吸引用户注意的图表。

7. 减少图库图片,增加真实照片

这是一个简单却有趣的网页设计趋势。 在过去几个月浏览网站的过程中,我们发现使用图库图片的网站在不断的减少。作为用户,我们更愿意看到那些能够表明公司或业务的照片,而不只是一张通用的图片。

我也有这样的感觉,网页设计师宁可不选择图片,也不会使用图库图片。

摄影是一种艺术的表现形式,却被人们遗忘了若干年。但在2017年它会强势回归。然而,铭记于心的事情是你网站的服务目的是什么。因此,上述的一切,包括网站图像的选择,请务必要这样做。

个人照片(团队照片)同样很受欢迎——请给品牌一个门面

2017 年网页设计的十大趋势

不仅真实图像的使用率在不断的增长,而且像卡通、漫画以及其他插图的使用比例也在增加。尤其是在一些科技类的社区中,通常会用一则漫画来谈论特定的主题或阐述一些细节。

8. Material Design

近年来,由 Google 推出的材料设计语言正稳步的推广到其应用程序中,包括 Gmail,Google 地图,Google 云盘和 YouTube 。而早在 2013 年,材料设计就以搜索词的形式出现了,但直到 2015 年它才成为了主流。

它是一种在页面上创建具有意义的层次排版结构的设计方法,在移动和响应用户动作的同时,将用户的焦点绘制到不同的区域。他们称后者为材料动效。而材料设计则是利用几何形状从视觉上来增强他们网站的体验。

由于它具备极大的灵活性,以及所有设备的兼容性,它也越来越受欢迎。

这是一个关于材料设计及其未来的持续讨论。要详细了解材料设计,请参阅Google上的简介

9. 长滚动页网站

它是一个拥有利弊的长滚动页网站。总而言之,我们看到了越来越多的长滚动页网站的出现,例如 Facebook,Twitter 或 Instagram 。它们看似无底,然而又很成功。

在 Facebook,Twitter 和 Instagram 网站上,用户通过长时间滑动页面,来不断的刷新与浏览新的内容。作为慵懒的人类,我们已经习惯了现在的行为方式。许多网站也都在摒弃菜单和标签选项,取而代之的是将所有内容放在一个长长的页面上。而网站也可以拆解为图像、文字与视频,用以增添一些让人们感到有趣的体验。

那么,就继续愉快地滚动吧!

2017 年网页设计的十大趋势

10. 字体排印越来越大

字体排印越来越大,并且更大胆。

2016 年我们已经看到了字体的大小与外观设计的增长,但这种趋势不会很快就停止。品牌名称将会变得更大、更醒目,甚至会全屏出现。而动态的颜色与纹理也将添加到那些有趣、充满活力的字体中,并创造出一个让你“哇”的效果。

2017 年网页设计的十大趋势

无论是用于绘图,还是用来吸引用户的注意,字体排印工作都在有条不紊的进行着。而大型字体的排印可以有效地打破网格的界限,尤其针对那些拥有较长滚动页面的网站。

总结

虽然,我们认为这份列表上的所有内容都相当不错的,但不要尝试将每一个趋势都纳入到你设计的新网站上。它们中的一些适合为企业服务,而你也可以选择一些客户需要和想要的样式和功能。同时,不要尝试太多不必要的功能,这样会立刻降低网站的用户体验。所以,请谨慎的选择,最重要的是要有创意。

感谢你的阅读,如果觉得文章不错,不妨点个赞。

注:

  • 由于译者水平有限,欢迎大家多多指正;
  • 本文版权归原作者所有。

 

原文地址:10 Web Design Trends for 2017

原文作者: Thomas Peham

译者:IT程序狮

本文由 @IT程序狮 翻译发布于人人都是产品经理。未经许可,禁止转载。

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/25100/

(0)
CatherineCatherine
上一篇 2017-05-10 15:10
下一篇 2017-05-10 16:52

相关推荐

  • 移动端搜索功能设计:3个阶段解析搜索流程设计要点

    这篇文章笔者想和大家聊一聊有关搜索功能的设计,搜索功能是每个内容型APP的核心,它的易用性决定了用户是否能从APP里快速找到自己想找的内容,那么决定搜索体验好坏的关键点又是什么呢?这里我总结了两点,“操作的易用性”和“结果的准确性”。看似简单的两点却有很多的学问,笔者把搜索的交互流程划分成三个关键阶段,“搜索前、搜索中及搜索后”,接下来将从这三个阶段逐一分析整个搜索流程中的相关设计。

    2017-05-11
  • 如何才能读懂甲方给出的设计需求?

    转到交互岗已经有一阵子了。原来在做产品的几个月里没少和技术、设计进行沟通,每当自己把意思想法传达下去的时候,反馈回来的结果基本都要进行进一 步的修改,这种返工和修改在产品快速迭代的过程中很浪费时间。当时自己没有觉得表达有问题,已经把需求的目的结果都表达清楚了。可能是自己没写过代码、没 做过设计所以在一些专业的术语的表达上,方案实现方式的选择上存在偏差,导致技术、设计没有完全按照自己设想的预期做出结果。

    2017-05-24
  • 10个步骤,了解新手入门过程的设计原则

    新手入门是每个应用程序最重要的元素之一。很多时候,它的难易程度决定了用户是否会继续使用应用程序。在用户界面上,新手入门不仅仅是简单的5个介绍软件的页面或说明性的工具提示内容。下面我会使用最有趣的例子来描述新手入门过程的设计原则。

    2017-05-03
  • 【案例】菜鸟裹裹如何打造双11极致物流体验

    作者:CNUX设计实验室(菜鸟无线UED团队)   如往年一样,2016年的双十一如期而至。当大多数人都在关注、鼓励你买买买的时候,有多少人关心你盼望包裹的那种期待?有多少人能体会你等待包裹时的焦虑?有多少人理解…

    交互专题 2017-08-07
  • 浅聊四个主流的页面间跳转动效

    最近一直在做交互规范总结的工作,在不断梳理页面间跳转逻辑的同时,发现页面间的逻辑关系并不能和页面间跳转的动效很好的结合上。虽然只是零点几秒 的切换动效,却能在一定程度上影响用户对于页面间逻辑的认知。为了输出详细的规范,花了大量时间把玩现在公司线上的产品以及国内外优秀的APP,尤其是苹 果、谷歌自己开发的APP。(如果某些方面在设计规范中并没有给出答案,就在原生APP中找答案吧!)

    2017-05-29
  • 撇开设计师的视角,普通用户是如何看待设计细节的?

    做设计久了,设计师很少能够真正站在用户的角度看待网站和APP。今天的文章,我们来聊聊普通用户眼里的设计细节~我们应该迎合用户,如果连对的东西都不能坚持,产出物的最终目标就会发生偏离,甚至完全无效。 ——@冯铁

    2017-05-13
  • 关于用户体验

    产品不被喜欢的原因是漏了什么?答案是用户体验。如果你是一个产品经理,是否有深刻思考过这个问题呢?有人会说思考过,但似乎没什么用,产品还是不被喜欢。那是用户体验不重要,还是我们思考的不够呢?答案是后者。首先我们提出本篇要解决的核心问题:如何让产品被喜欢?(说明一下,这个产品可以是某种实物性的产品,也可以是一种服务性的产品。)这个问题提出后,很多人的脑海中会蹦出质量好、外观精致、用的舒服、服务周到等,但想到这些的人,一定还会有一个感受,就是...

    2018-04-09
  • Axure教程-蜻蜓FM收音机iPhone端高保真原型案例下载

    本文是原型库网站金乌投稿——蜻蜓FM收音机iPhone端高保真原型。使用AxureRP7.0制作蜻蜓.FM网络收音机产品原型分享

    IxD案例 2015-01-04
  • 走心!优秀的移动端UI应当如何用微交互打磨细节?

    UI设计的细节很重要,它不仅仅体现在静态的元素上,动效和微交互也是如今UI和UX设计中最重要的细节。想要打造优秀的移动端UI设计,微交互和动效设计是绕不开的问题,今天的文章我们来聊聊这个。

    2017-05-19
  • 实例分享|在界面排版中,需要注意的七大原则(下)

    在上篇《实例分享|在界面排版中,需要注意的七大原则(上)》大家了解了界面排版的前四个原则,今天接着将后面三个原则也分享出来。一、亲密原则
    二、对比原则
    三、平衡原则
    四、相似原则
    五、简洁原则
    六、封闭原则
    七、情感原则

    2017-05-08