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

从上世纪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

如有侵犯您的合法权益请发邮件951076433@qq.com联系删除

(0)
Inspirr的头像Inspirr订阅用户
上一篇 2022年6月23日 16:31
下一篇 2022年6月23日 16:31

相关推荐

  • 好的酒店网页设计需要注意哪些要点?用案例突出酒店网页的设计特点

    随着互联网的迅速普及,酒店电子商务也应运而生。然而,相比起其他行业的网站,酒店官网不仅是其在互联网上展示品牌形象的地方,更是为客户提供酒店相关服务的站点,因此酒店网页设计自然是不能马虎的。那麽,好的…

    2022年6月20日 建站资讯
    0228
  • 公司网页设计如何使用动效?

      説明使用者从错误或者意外的操作当中恢复 对於使用者来说,错误与意外的页面操作其实是经常发生的。当错误发生的时候,不仅会影响到用户体验,还会直接影响到用户的实际操作。因为无论这些错漏或者意外是怎…

    2022年6月25日
    0128
  • 为何点击就会加入购物车?

    电商类型网站最为常见的一种现象,就像是本能一样,点击了某样商品就会加入购物车。除此之外,还会在旁边出现某些商品的推荐,以此增加商品的销量。 为何要单独的挑出这点来说?其实这点很容易被忽略的一个细节——影…

    2022年6月12日
    0150
  • 10条优秀的网站设计经验,网页设计要点汇总。

    一个设计良好的网页应该能够被宽带网上的多媒体高档电脑或者依然使用慢速MODEM连接的低档电脑上安装的浏览器阅读。然而,很多新的网站设计者均不是非常的了解如何尽量的让这些HTML文件保持很好的兼容性。 当然,这…

    2022年7月4日 建站资讯
    0157
  • 我来分享网页设计也叫网站艺术设计。

    众所周知,网页设计是企业向用户和网民提供信息(包括产品和服务)的一种方式,是企业开展电子商务的基本设施和信息平台。电子商务不可能和网站分开来谈(或者只是用第三方网站)。企业的网站被称为“网络商标”,也是企…

    2023年6月17日
    02
  • 什麽是方块堆叠式页面布局?

    页面设计到了布局的流程,要有新创意,不妨考虑下如今正在疯狂流行的方块堆叠式布局! 首先,要了解这种布局方式最适合使用在图片和视频页面当中,无论是APP的页面设计,还是桌面端的页面设计,这种排版方式越来越…

    2022年6月12日
    0219
  • 今日分享html之前的版本号。

    HTML5是超文本标记语言(HyperText Markup Language)的第五个主要版本,它于2014年被万维网联盟(W3C)正式批准发布,在此之前的HTML版本主要有四个主要的迭代版本: 1. HTML 1.0 (1991年) 在1991年,Tim Berners-…

    2024年7月4日
    00
  • 分享如何理解网页设计的用户体验。

    各行各业都有自己的用户体验的体系,用户体验其实就是用户使用你的产品或者服务的体验,从产品角度上讲就是产品的设计的人性化,从服务角度讲就是服务人性化;产品人性化做的比较好比如电子产品中的苹果、小米等,服…

    2023年6月15日
    01

联系我们

QQ:951076433

在线咨询:点击这里给我发消息邮件:951076433@qq.com工作时间:周一至周五,9:30-18:30,节假日休息