从网页设计的简史,见证当今网页设计技术的主流趋势

从上世纪90年代至今,网页设计技术不断进步。过去网页的本质仅用於存放资讯,而现代网站早已不满足单纯在网页上放置资讯,而是着重於品牌形象的加深,从网站的UX/UI设计,拉近品牌与顾客的距离。

上期小编和大家一起探讨《2010~2021年网页设计流行风格分析》,今期将从网页设计的简史,延伸到如今的主流趋势,和大家一起见证网页设计技术的演变过程:

【网页设计简史】

1989 — 网页设计的兴起

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

网页设计技术刚兴起时,整体介面就像打开Windows命令提示字元的介面,只有单色像素风格的纯文字图像。

1995 — 表格式网页设计

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

那年网页设计技术迈出关键的一大步:图像显示。

这个时期设计师普遍使用HTML表格方式设置网页布局,同时网页架设人员将设计稿切片辅助表格设计,逐步完成页面的每个部分。

同年 — JavaScript技术出现

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

JavaScript技术的出现,打破了HTML表格的局限,同时让背景图像、GIF动画等成为网页设计的主流,让网页可以根据使用者的动作,作出不同反应,譬如弹出视窗就是从此时期常被用於网页设计中。

1996 — Flash技术的诞生

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

Flash是一种支援多媒体创作和播放的技术,虽然早於2020年时已经确认停止更新,但在当时确实是很前卫的网页设计技术,并且设计师亦重度依赖Flash制作网页、广告、软体、游戏等产品。

1998 — CSS技术逐渐普及

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

虽然CSS是和JavaScript技术一同出现,但因为浏览器兼容性问题,一直过了好几年才逐渐普及。CSS是一种用来表现HTML或XML等文件样式的计算机语言,不仅可静态修饰网页,还可配合各种脚本语言动态地对网页个元素进行格式化。

2007 — 网格系统

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

这年不仅是第一代iPhone发布的年代,也是各大厂商相机推出低价智慧型手机常见市场的时期。五花八门的荧屏尺寸,让网页浏览舒适度大大减低,因此改进切片设计的使用成为首要任务,使得各类网格系统如雨後春笋般相继出现。经过市场机制的淘汰过後,最後留下960网格系统。

2010 — 响应式网页

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

此前网页设计风格多从极简主义延伸,2010年後使用智慧型手机的用户愈来愈多,网页设计的开发重点也从技术转逐步转移到设计、创意、视觉、互动等方面。

【分析近十年的网页设计趋势】

响应式网页开始广泛应用後,各类网页风格层出不穷,下面我们一起看看近十年的网页设计趋势都有哪些变化?

变化一:极简主义

在网页设计应用层面上,极简主义通常会在网站基本结构上,剔除多余元素,并放大必要视觉元素,使网页设计的视觉效果更加吸引,从而给使用者留下深刻的印象:

① 文字放大

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

网站的Slogan设计以大文字为主凸显想传递的资讯,让使用在进入网站的第一瞬间便了解品牌所提供的产品及服务,并冲中感受品牌的独特性。

② 元素放大

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

突出首页的产品情景细节图,让人一眼便看懂网页设计贩售的产品,而精致的图片、细节的展现往往能激发使用者的购物慾。

③ 极端主义

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

与极简网页风格不同,极端主义透过颜色的交替设计,试图挑战使用者的感知,夸张的设计让画面更富有张力。

变化二:不对称布局

所谓不对称,是指设计师利用不对称的“元素缺乏相等及均分”特性,创造出视觉的和谐与平衡。

① 消除行距的限制

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

透出消除网格边界与间距的限制,将介面中的不平衡化变为不同的平衡美感,让画面产生延伸感,令使用者不自觉地滚动网站直到页面底部。

② 单色块阵列

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

利用大小不同且色彩鲜艳的色块吸引使用者的注意力,让使用者能透过文字与图像了解品牌所传递的资讯。值得注意的是,色块如果没有大小或色彩对比之分,便不能发挥其效果;同时文字亦要经过顺序设计,而不是随便将内容置入其中。

③ 强调视觉动线

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

为介面增加强调视觉的动线设计,让画面形成张力,产生动感与活力,让使用者主动将网址分享给他人,达成另类的宣传和推广效果。

④ 多重曝光

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

多重曝光是指融合两张不同照片形成视觉上的冲击。如今这种设计时常被运用到网页设计上,为网站带来更强烈的对比,吸引使用者的眼球。

⑤ 留白设计

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

有时大量文字的填充,未必能将所有信息都呈现出来;相反,适当的留白更能突显想表达的内容,并有效提升网页设计的质感,而这样的质感亦会反映在品牌调性,使品牌形象获得更好的提升。

变化三:插画艺术

在网页设计上,与其使用一段长篇大论的文字来说明,不如使用一张插画要来得更清晰易懂,也赋予使用者温暖且证明的能量。

① 扁平色块

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

用纯色块表现画面的轮廓,能弱化视觉透视的同时,也减低光影与材质纹理对设计的影响,给使用者带来乾净利落的感受。

② 等距视角

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

等距视角的插画效果能使2D绘图增加立体感,让画面变得更活泼,也更有动态感。这类网页设计的通常会使用较为强烈且饱和的色彩方案,丰富的色彩调性能更好地拉近品牌与使用者之间的距离。

③ 色彩轮廓

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

不同於扁平色块风格,这类插画的色调较为单一,同时也不会展现出过於活泼的特性,但能提升插画的层次感。此风格非常适合较为沉稳的品牌使用,搭配文字以漫画或动画形式展示品牌资讯。

变化四:滚动视觉差

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

滚动时差设计能让网页元素在滚动中差生位置变化,形成层次错落的视觉效果,带来非常不错的视觉体验。而自2011年滚动视觉差出现後,加上网页设计技术不断强大,这种技术的表现方式也变得愈来愈丰富。

变化五:深色模式

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

2019年IOS和Android系统都推出深色模式的更新後,市面上众多APP设计也纷纷推出深色模式的主题配色。事实上,深色模式之所以风靡的原因,除了它能大大提升内容可读性外,部分系统还要求对不支持深色模式的APP采取强制下架的措施。

同时,深色模式的出现,确保了网站的吸引力能足够让使用者停下来探索,也赋予使用者部分的控制权,好让网站可以产生独特性,逐步开放网页或APP的“个性化设置”自由度。

变化六:融入新的科技技术

从网页设计的简史,见证当今网页设计技术的主流趋势

网页设计趋势

随着AI技术的成熟,很多企业都采用多通路行销方式,整合线上线下资源,帮助使用者进一步了解产品与服务,提升销售的营业额。

虽然目前全通路体验对大部分企业来说成本十分庞大,但在资源有限的情况下,我们可以将新科技技术,如AI、AR、机器人学习等技术逐步融入到网页设计中,通过追踪使用者的搜索习惯,找出创造最大效益的路径,并一部份一部份进行整合,逐渐打造全通路体验。

总的来说,以上所提出的内容,都应该围绕品牌调性、品牌定位以及使用者体验来设计,并且经过重重测试,不断优化改善,直到网站的操作变得更加简单方便,想表达的讯息也可以一目了然,这样才能让网页在网络庞大的资讯中脱颖而出。

本文来自投稿,不代表重蔚自留地立场,如若转载,请注明出处:https://www.cwhello.com/41985.html

(0)
上一篇 1天前
下一篇 1天前

相关推荐

  • 网页设计公司哪家好?选择正确的公司

    网页设计的主要目的在於让很多的消费者们的注意这里面,然後进入里面,更加方便的去使用网页,这就是他的额核心所在,但是不同的制作人员制作出来的是有很大的差别的,毕竟他们对於网页的理解是不一样的,所以需要制...

    2022年6月14日
    0260
  • 从全球百大品牌网站参考范例 学习响应式网页设计的实用技巧

    最近很多客户都向我们咨询有关“响应式网页设计(Responsive Web Desig)”的问题。下面,就让Inspirr为大家简单介绍一下。 网页设计案例 什麽是响应式网页设计? 根据WeAreSocial和Hootsuite释出的最新统计,截至2021年1...

    1天前
    090
  • 现今流行的极简网站案例之一

    黑白灰:禁欲主义 不可否认,合理的黑白灰使用是大气而难忘的,很轻易就呈现出质感。也就是很多页面设计师信手拈来的配色方案。但是就如今的扁平化火热程度,再盲目的使用黑白灰反而缺失了亮点。再者,不合理的运用...

    2022年6月9日
    0310
  • 移动端UI设计原则:遵循哪些移动端UI设计配色原则

    移动端UI设计通常比较小,因此很多PC端网页设计的功能都很难在移动端UI内实现,导致用户可能需要在多个界面中频繁跳转。恰当的色彩设计就像一道神奇的「魔法」,它能减轻用户因频繁跳转界面时的烦躁,同时又能唤起用...

    8小时前
    070
  • 网页设计趋势:2021年UI设计色彩流行趋势总结

    每年设计圈中流行的色彩都会有微妙的差别,前几年因为扁平化设计风格的关系,大多设计作品的用色都略偏柔和。但看多了难免会有些单调乏味,於是从今年开始,渐变色彩逐渐大行其道,使整个作品有种眼前一亮的感觉。相...

    8小时前
    050
  • 表单页面设计的教训

    表单页面设计好,到底有什麽好处?典型例子可以参考旅游网站Expedia曾经贴出的分享:在他们网站订单页面当中,部分的用户填写了旅游地点、旅馆、付款资讯,并按下“立即购买”後,却没有成功完成交易!经过他们的细致...

    2022年6月10日
    0300
  • 网站建设需要注意哪些原则问题?

    网站建设如果没有合理的方案,或者设计的功能性不能达到用户使用标准,肯定会直接影响到网站的推广和优化,也会直接影响到企业品牌的辨识度,在网站建设时要注意下面这些严格标准,不仅让网站知名度得到全面提升,还...

    2019年9月18日
    0620
  • 公司网站设计之后如何提高用户访问量?

    现如今,公司网站设计的目的,无非就是为了能够拓展网络业务,更好的文宣和发展公司。但大部分的公司其实对网站还是不具备一定的了解的,只认为网站建成之后就可以带来一定的效益了。那这样的想法也就大错特错了,网...

    2019年10月23日
    0540