太多的文章告诉你 Web 设计里什么比较酷,而这篇文章要说的是,从一些表象中,做出的一些靠谱的预测。
手势替代点击
我们早已习惯如何艰难的滚动页面,或许大多数人仍会将鼠标移到屏幕边缘来拖动滚动条。
或者更高级一点,你使用鼠标滚轮,键盘方向键或触摸板,来滚动页面,但是一般的使用者并不具备这些优势。
如今,在移动设备上,滚动比点击更容易,用手指就可以快速地滚动页面。而当想要点击网页上某个确定的目标时却变的很困难——这与我们使用桌面设备的情况正好相反。
因此,我们应该期待有更多的网页能做成滚动第一,点击第二。就像我们随处可见的那种样子:
有数据充分表明,移动设备在不断侵占市场份额,该趋势还将持续。网页中需要点击的内容日趋减少,而滚动日趋增多。我们将会看到更少的链接、更多的按钮、更大的可点击区域,以及能够滚动的长页面。
那些以多页面形式展示文章的网站,在不久的将来也会觉得头疼。想像一下,如果像时代周刊这样的媒体采用无限滚动加载方式的话:
此外,网页还将会被扩展到诸如智能手表这样的可穿戴设备上,虽说尚为时过早,但如果成真的话,网页操作将会是完全的手势操作。
折叠式设计已死
滚动如此廉价,同时电子产品屏幕尺寸碎片化严重,折叠式设计已变得不应景。
设计师大不用像以前那样尽可能的把所有东西都塞到页面顶部了,这使得多媒体应用更加普及——除非滚动页面,否则你只会看到一个全屏尺寸的图片标题。
自从诞生了长长的滚动页,设计师终于有机会尝试多年来只有杂志才能做的事——让网页充满漂亮的图片!在 2015 年,我们期待看到更多充分利用网页空间的设计以及更多更大的图像,像这只汪。
用户越来越快,网页趋于简单化
现在的青少年都是上网专家,甚至一些业余人员也能玩得很专业:多标签、滑动翻回上一页。
所有的东西都变得更快了,我们也越来越失去耐心。想要让一个温文尔雅的人画风一转,就让他卡一会吧。
网页已经被逼得不止要快(这只是技术问题),还要能够让人秒懂。拖慢用户的设计会让用户觉得这网页根本打不开。
简单明了的页面设计更易于浏览,这意味着它们被浏览的更快。所以想要判断哪种设计更先进,只要看看哪个网页更快被浏览完就好了。
造成拟物化设计衰败的最大原因就是——用户变得更感性,更缺乏耐性,复杂无章的设计只会拖慢他们。
原生 App 令众多网页都自愧不如的是,精巧简约,又十分漂亮。之所以这么做,是因为界面设计得越是精细,体验就越好。
扁平化设计只是冰山一角,简单明了才是背后的趋势,我们就放眼期待它在 2015 年有更进一步的突破吧。
像素已死
在桌面浏览器里,一个像素就是一个像素。或许你还懂得每英寸平均由72个像素组成,但如今已经很少人知道像素了。
随着响应式设计的盛行,我们已看到这种向栅格化以及百分比的转变。但我们还面临着一个很大的挑战:位图。
几乎所有的网页,包含的图片,只达到了现代显示器一半的分辨率,且不支持缩放。借助 Retina 显示屏和现代 Web 浏览器,矢量图在 2015 年会变得更受欢迎。
在图标字体和 Google 的 Material design 上,我们已可以看到这样的趋势。网页加载变得更快了,图标缩放至任意尺寸也不会失真,对于设计师和现代 Web 浏览器而言,这无疑是理想的方案。
虽然这项技术已存在,但开发人员尚需时间来改变他们的习惯,以适配更高质量的显示器。一旦 Retina 级(如新的 iMac)显示器成为普及,我们期待设计师也能紧跟其后。
动画回归
如果一个网站需要维护,为了更好的传达这一点,你可能会采用 GIF 或 Flash 动画,但以下几件事情,让动画成为了现代网页设计中的后起之秀。
扁平化设计过于一致,甚至枯燥,动画可以让网站脱颖而出,同时以更少的空间展示更多的内容。
移动应用重新定义了用户期望的内容,譬如使用手势动作来传达含义,网站也开始了做同样的事情。
CSS 动画一类的 HTML5 技术可以很轻松的增强网页设计,同时避免了以往使用插件导致的速度、兼容性等问题。Web 组件更是加速了这一点。
GIF 动画回归,且变得出乎意料地有效。想必你已注意到本文广泛使用了 GIF 动画,它们从未像现在这样可以如此简单的被创建和分享。
Web 组件
随着 Web 技术的持续发酵,语义变得越来越缺乏。在页面里嵌入一大堆凌乱的代码,就为了一个简单的任务,譬如谷歌统计,或者 Facebook Like 按钮。如果可以像下面这样写代码,事情会变得美好很多。
1 | <google-analytics key="UA-12345-678"> |
诚然已可以使用Web 组件,但大范围普及,尚需时日。或许 2015 年。
Google 的 Material design 已发布,可能正是它掀起了 Web 组件的潮流。 基于 Polymer,支持全部现代浏览器,提供丰富的动画和交互组件,仅仅通过一个标签,像这样:
如果这种情况持续下去,2015 年出现更多基于组件的框架就不足为奇了。也许 Bootstrap 4.0 ?
社交饱和 & Email 复苏
社交媒体对消费者来说是一个巨大的成功,但许多作者并不开心。
问题在于饱和。每天有数十亿的帖子,Facebook 会了解用户最喜欢的,并且只展示这些内容。不幸的是,这意味着随着时间的推移,你发布的内容只会越来越多的被你的关注者中的一部分人看到(不过有付费服务可以解决这个问题)。
社交媒体不会消失,但在 2014 年,我们看到很多像 Tim Ferriss 这样的知名博主将他们的注意力从社交媒体转移到了传统的 Email。 他们意识到 Email 比社交媒体有一个显着优势:更高比例的人会看到你发送的东西。
在 Web Notifications(其工作方式与移动应用的通知类似) 趋势尚不足下,我预计这种内容社交的趋势将持续到 2015 年。
非预测: CSS Shapes
这项很酷的技术只有设计师知道。CSS Shapes 允许你使用自定义形状来布局,如下图中的文字:
CSS Shapes 非常酷,但在这项技术得到标准化之前,花太多时间和精力无疑是很有风险的。对于新旧浏览器,你几乎需要两套完整的设计,而且很多用户可能都不会注意到。
总结
在 2014 年,我们看到移动设备使用超过了桌面设备,但普通大众尚未普及。大多数组织对于他们的网站仍然奉行桌面设备第一,移动设备第二。
在 2015 年,该策略变得不切实际和不专业。随着移动设备成为浏览 Web 的主要设备,”移动优先“变得不再是一句流行语,更多的是需求。
扁平化设计无处不在,但透过 Ghost Button,你会发现真正的趋势是越简单的网站能更快受到用户喜欢。
简约不仅仅是一种时尚:而是未来。 期待它持续下去。
在博客文章中嵌入动画,以及手势动作将变得越来越普遍。
滚动第一、点击第二的设计将增多,像素布局、折叠式设计将减少。Web 组件可以更轻松地在我们的网站中提供类似原生应用的体验。
现在,你看到最好的移动 App 设计出现在了 Web 设计上。原生 App 和网站之间的差异完全消失,大概只是时间问题。
※ 原文链接:7-future-web-design-trends