首页>>建站知识>>网站设计

2024网站设计10大趋势预测

点击次数:50   发布时间:2023-11-24 09:59:32

一、移动网站设计浪潮来临

也许你会有疑问。移动网站(以响应式网站为主)在过去几年一直很火热。 但这里将告诉你,现在开始 - 玩真的~ 在过去几年当中,移动设备网站设计主要以设计师及工程师为主。

由于移动设备越来越普及,移动设备上网占有比率越来越高,并且预计在2015年,移动设备的搜索量将会超过桌面计算机的使用量,让一些科技大咖也越来越重视这块领域。 针对搜索引擎方面,Google搜索质量团队(Google Search Quality Team) 已经率先增加了搜索友善标签,当你使用移动设备搜索页时,有善标签将会提示用户该网站的友善程度,并且,提供相关的移动网站检测平台,以迎接有善移动网站的新浪潮(详见:移动趋势时代来临,立刻检测你的移动网站友善度!)。

也就是说,搜索引擎将会率先警示使用者,哪些网站是属于不友善于移动设备,或者还在用Flash.. 此外,由于社交媒体的使用者越来越多,为了能提升使用者搜索体验,Google 的搜索引擎也已经整合了Google+社交媒体网站,微软也将Facebook整合到Bing搜索引擎中,预计在未来五年,让搜索引擎越来越紧密地和社交媒体网站结合。

因此预计未来,移动网站设计将会大举扩张版图。

二、Google Material Design

今年6月份,Google I/O 2014最亮眼的主题就是"Google Material Design"。在这当中,Google将优秀的设计经典原则定义出来,目的是希望这些经典能以更精准的方式呈现。当中,强调以符合纸张质感及舒适性的材质为设计主轴,要让设计能符合自然物理特性。

值得关注的是,针对这些准则的相关技术及讨论越来越热烈。这股新兴趋势,在未来将会有很大的影响力。

三、多元版型服务

从Google +、Pinterest、Inbox等主流平深圳都可以发现他们提供了版面菜单,让使用者能自由决定版型,包含:纯文本排列、图文排列、卡片式排列设计、杂志风格排列..。

并且主要以无限下拉设计(Infinite Scroll)的方式来加载内容(例如:Facebook的信息墙)。 在这些版型当中,以卡片式设计最为亮眼。

尤其式当卡片设计结合液态特效时,能让画面变得更活泼生动。关于卡片式设计具有以下优点:

- 卡片设计架构简单,容易理解

- 卡片设计可灵活移动排版,符合移动设备需求

- 卡片本身空间有限,能有效于避免塞入太多信息,让编辑者必须思考如何简短说明,让使用者更加容易理解标题

- 卡片设计在移动设备上容易点击,因此使用者能轻松的分享其内容

虽然这些版型在过去已经存在,但是将这些功能汇集之后,在近几年将越来越重要,其实也代表着,多元版型服务(由其是卡片服务)将会成为主要趋势,提供使用者自行选择版面的服务将会越来越流行。

四、扁平化设计的进击

扁平化设计去除了非必要的华丽,倾向于内容的呈现,让用户在任何设备都能更深入的体验。

但是在几年之间,我们开始意识到,这股趋势开始出现一些困境。其中包括,网络上提供了大量的扁平设计的免费样板或低价样板,让一些为了能快速赶上趋势,直接参考的现有模板的网站出现,造成许多网站越来越像的情况。

幸运的是,设计理念不断的演进,其中,因为Material Design的出现,带来了许多关于材质触感效果、及不同的视觉层面的思考准则。因此,相信在未来,扁平化设计将有更进一步崭新的突破。

五、Web Fonts

过去,网站字形往往使用工整的编排方式,并且大量使用默认字体为主。

当Google Font等相关具有设计感的网站字型出现之后,设计师们便开始跳脱平淡的做法,尝试将字形做不同的编排及风格呈现,可惜多是以英文字形为主,亚洲字形资源仍然缺乏。在2014年,Google与Adobe合作推出一款"思源黑体"之后,让亚洲的设计师能运用这个字型,让网站设计能更具有现代感、容易阅读。

未来,字形的变化将会越来越多元,其中包含结合响应式、视差滚动以及搭配阴影、深度的方式,甚至以文字来绘图的方式呈现,让字体更加动感多元。

这股趋势必然会持续延烧,越来越多网站会将字形设计列为重点要素,会有越来越多的创新字体出现,并且期待崭新的技术能与网站字体结合,打造更具有美感的网站。

六、始终经典的大背景图

在2014年之前,已经有越来越多主流网站已大面积的背景图为架构,并且在设计轮播图时,也是以大背景图轮播方式已取代Coverflow,并且会结合动态视频、垂直视差滚动等方式来呈现。

相信在未来,会持续保持这样的趋势。 关于背景图的风格,近年流行使用类似 Instagram 编修过色调、风格的图片。

在2014年则开始改以强调清晰的细节、且具生动、大胆、喜悦的图片,让背景图能更真实的传达产品的涵义(而非纯艺术)。并且,鼓励使用大胆的呈现方式,以3D的方式让图片更具有层次。

或是以故事的方式,让图片具有情绪、启发性。在2015年,保留图片的真实性,避免过度修饰,让图片容易理解的方式将会变成主要趋势,让使用者能获得更好的体验。

七、真实触感的按钮

未来,按钮将会朝向友善移动设备的方向来设计,主要以Material Design描述的浮动、突起、扁平三种风格为主,并且着重符合触碰的尺寸、类似真实按钮的触感。此外,幽灵按钮(Ghost Button)的设计风格也将会是重点之一。

所谓的幽灵按钮是指透明的,仅具有基本的框线组成的按钮图标。当然,目前来说,现在很流行幽灵按钮,但是要注意使用过程可能会让按钮消失在焦点中,因此必须思考如何让它脱颖而出。

此外,鼠标移动到按纽上所出现的工作提示框,尽可能添加符合物理动作的弹出方式,呈现的方式也将会是未来的重点。

八、符合应用程序概念的转场

当设计元素及效果越来越多元,加载数据量也跟着越来越多,造成网站资源加载完成之前,出现凌乱不堪的画面。

这个问题,在过去,已经开始使用加载初始网站或进度条的方式来解决,确认所有元素都妥善就位后,再移除初始画面。 未来,为了因应移动设备上网的趋势,在网站完整加载前的初始画面将会越来越重要。

网站转场除了会设计丰富的载入动画页,针对切换网站时的转场,将会以类似舞台剧的方式来编排进场元素及退场元素的动作,让元素能有顺序且连贯的移动,使画面更生动,具有意义,以增加使用者的体验。

以Google为哈比人五军之战做出的战场地图,为例: 在各个场景切换过程,都会针对出场及退场设计转场动画,让网站能更符合应用程序的概念来呈现。

九、丰富的菜单变化

为了符合移动设备体验,具有响应式的目录将会成为主流。在桌机环境中,可以用目录搭配菜单按钮的方式来呈现,当切换到移动设备时,则会将目录隐藏,以菜单按钮的方式来呈现。关于点击菜单按钮后的呈现方式,最常见的属于长条状的目录菜单。未来,针对菜单的呈现方式将会越来越多元,其中包含目录选项环绕主要按钮、自然的重新编排元素等。

十、与用户互动的提示信息

提示功能在未来将会是大数据的利器,若能妥善的安排,除了能够让使用者觉得贴心,更重要的是可以有效的提升转换率。

其中主要的关键在于如何搭配情境来设计提示信息。提示信息出现的地点可以遍及各个角落,出现的时机则包含固定及非固定的情况。固定的情况,例如:使用者首次登入页面的操作指示、提示进行某项工作、以及确保窗体操作过程正确。

非固定情况则包含实时新闻、收到信息、或者由大数据演算过后给予的建议信息。这些对话框的设计必须要能让使用者容易察觉,并且要能清楚表达、避免过于突兀或造成干扰。

相关文章:

联系我们

联系人: 荣先生

建站QQ: 97532866

手机: 15919993369

联系我们
  • 联系人: 荣先生
  • 建站QQ: 97532866
  • 手机: 15919993369
Copyright © 2016-2024 东莞网站建设 All Rights Reserved.
扫描二维码! 关闭
二维码