首页 > 文章中心 > 网页设计艺术

网页设计艺术

开篇:润墨网以专业的文秘视角,为您筛选了八篇网页设计艺术范文,如需获取更多写作素材,在线客服老师一对一协助。欢迎您的阅读与分享!

网页设计艺术范文第1篇

【关键词】 网页与平面设计 色彩 心理学

        1 网页的平面设计

        每个网站都是由诸多网页构成,故网页是构成互联网的基本元素。我国这两年的网络发展非常快,网站数量也以倍率增长,然而网页的设计却不容乐观。除了一些大的专业网站在版面的编排上比较讲究之外,其他很少见到界面设计考究、美术创意优秀的中文网站,这是因为没有和平面设计紧密结合。网页本身就是无数个“页面”的平面,平面设计规则也适用网页设计,网页设计的审美需求是对平面视觉传达设计美学的一种继承和延伸。两者的表现形式和目的都有一定的相似性,把传统平面设计中美的形式规律同现代的网页设计的具体问题相结合起来,才能设计出符合审美规则的网页。故设计者应该巧妙利用平面设计的设计规则,结合网络媒体的特点,认识网络,了解平面的特征,才能使网页更加适合于网络上的传播。

        平面设计中如变化和统一、条理与反复、对比和调和、均齐与平衡等,对网页中文字、图形、色彩的设计都是十分有效的视觉规律。首先,网页的内容与形式的表现必须统一和具有秩序,形式表现必须服从内容要求,网页上的各种构成要素之间的视觉流程,能自然而有序地达到信息诉求的重点位置。在我们把大量的信息塞到网页上去的时候,考虑怎样把它们以合理的统一的方式来排布,使整体感强的同时又要有变化,怎样使它们脉络清楚又富有清晰的视觉效果等等。例如哈尔滨商业大学设计艺术学院网页设计之欢迎界面,在黄色的背景衬托下,各种线条贯穿其中,运用平面设计中的图形设计加以修饰,增加网页设计的美感和大众的视觉审美需求。符合设计学院的设计的理念,又有学术机构的沉稳。内容与形式的表现达到了高度的统一。其次,突出主题要素,必须在众多构成要素中突出一个清楚的主体,它应尽可能地成为阅读时视线流动的起点。哈尔滨商业大学设计艺术学院网页设计之主页设计作为设计的主体,如果没有这个主体要素,浏览者的视线将会无所适从,或者导致视线流动偏离设计的初衷。主页设计中各构成要素在组合时,要注意其结构的轻重大小、虚实、多少等对比因素,加强视觉力度,以强化页面的整体吸引力。再次,网页版式的新意,网页的版式设计同报刊杂志等平面媒体的版式设计有很多共同之处,它在网页的艺术设计中占据着重要的地位。所谓网页的版式设计,是在有限的屏幕空间上将视听多媒体元素进行有机的排列组合,将理性思维个性化地表现出来,是一种具有个人风格和艺术特色的视听传达方式,它在传达信息的同时,也产生感官上的美感和精神上的享受。哈尔滨商业大学设计艺术学院网页设计的版式设计赋予了很多心意,版面运用欢快轻盈的风格进行设计,打破常理设计规范,有鲜明的节奏感,给人以生机盎然的感受,版面中的文字和图片利用线条隔开,主题突出,追求某种富于活力的图文编排与设计。

        2 网页视觉设计中色彩的设计

        网页的色彩,是最先也是最持久地给浏览者以网站形象的因素,浏览者在浏览网页时,留下的第一印象就是页面的色彩设计。色彩本身是无任何含义的,有的只是人赋予它的。但色彩确实可以在不知不觉间影响人的心理,左右人的情绪,所以就有人给各种色彩都加上特定的含义:红色:强有力、喜庆的色彩,很容易使人有兴奋感觉,是一种雄壮的精神体现;黄色:亮度最高的色,给人感觉就是很有温暖感;绿色:美丽、优雅,给人感觉大度、宽容;蓝色:永恒、博大,给人感觉平静、理智;紫色:神秘、女性、温柔、冒险;黑色:有时给人沉默、虚空的感觉,但有时也给人一种庄严肃穆的感觉;白色:有时给人无尽的希望感觉,但有时也给人一种恐惧和悲哀的感受;灰色:具有中庸、平凡、温和、谦让、中立和高雅的感觉。网页的色彩使用得当可以产生强烈的视觉效果,使页面更加生动。巧妙使用色彩可以直接影响阅读者的观赏兴趣,因此,色彩设计在网页设计中居于十分重要的地位。网页的色彩设计应把握以下几个方面:

        2.1 确定主体色。确定一个主色调,可以有利于体现网站主题,遵循主从关系,这是最稳定的处理色彩原则,在网页设计页面上,除白色为背景外大量使用的颜色,就是这个网页的主体颜色。如果在同一个页面内运用了多种颜色,把握不好的话,就无法确定哪个是主体色。因为其他的颜色面积不能过大,要遵循主从关系。我们现在看到的网页,一般以浅颜色为背景的居多,如浅灰色、浅黄色、浅蓝色、浅绿色。以浅颜色为底,哈尔滨商业大学设计艺术学院网页的主体色就是以浅黄色、浅蓝色为主色调,整体感觉柔和、素淡,配上深颜色的字,如黑色,读来自然、流畅,也有利于突出页面的重点,有利于整个页面的配色,更容易为大多数人认可和掌握。 

其他一些次要内容,如背景图片、线条适宜采用不抢眼的颜色,以免喧宾夺主。只有少量精心选择的元素,为了突出强调主页的视觉效果,题头部分采用明亮的色彩,这些彩色亮点就会产生强烈的视觉冲击,并有设计艺术学院的特色。

       2.2 背景色处理。在背景的色调搭配上一定要注意不能有强烈的对比,特别是同时使用色彩对立的颜色。大面积颜色适宜采用低比度,因为过于丰富的背景色彩会影响前景图片和文字的取色,严重时会使文字溶于背景中,不易辨识。所以,背景一般应以单纯为宜。如果需要一定的变化以增加背景的厚度,也应是在尽量统一的前提下的一种变化。例如在制用标题时,为追求醒目的视觉效果,可用比较深的颜色,配上对比鲜明的字体。实际上背景的作用主要在于统一整个网页的风格和情调,对视觉的主体起到一定的衬托和协调作用,一方面吸引网民的注意力,另一方面有助于体现网站的主题。对一些明度较高的网站,配以黑色,可以适当地降低其明度。白色是网站用的最普遍的一种颜色。很多网站甚至留出大块的白色空间,作为网站的一个组成部分,这就是留白艺术。哈尔滨商业大学设计艺术学院网页设计的二级界面就较多运用留白艺术。留白,给人一个遐想的空间,让人感觉心情舒适,畅快,恰当的留白对于协调页面的均衡起到相当大的作用。

        2.3 页面的色彩分配。网页标题是网站的指路灯,浏览者要在网页间跳转,要了解网站的结构,哈尔滨商业大学设计艺术学院网页设计的导航设计利用页面中的一些小标题,使用稍微具有跳跃性的色彩,吸引浏览者的视线,让他们感觉网站清晰明了,层次分明。网页标志是宣传网站最重要的部分之一,所以这两个部分一定要在页面上突迎而出。怎样做到这一点呢?logo和banner设计来源是哈尔滨商业大学设计艺术学院标志,鲜亮、对比强烈的标志设计寓意哈尔滨商业大学设计学院的设计精神和学术精神,logo和banner的色彩跟网页的主题色分离开来,突出主题。网页文字是网页传递信息的主体,如果一个网站用了背景颜色,必须要考虑到背景颜色的用色,与前景文字的搭配等问题。一般的网站侧重的是文字,所以背景可以选择纯度或者明度较低的色彩,文字用较为突出的亮色。让人一目了然。设计艺术学院网页页面当中的文字设计并没有使用大众的黑色,在白色背景的衬托下,深灰色的文字既有利于读者的阅读,又赋予了活跃的气氛。导航菜单所在区域是网民利用率比较高的,把菜单背景颜色设置暗一些,然后依靠较高的颜色对比度、比较强烈的图形元素或独特的字体将网页内容和菜单的不同目的准确地区分开。页脚,这一项最不重要,不应该喧宾夺主。可以考虑和侧栏相同的颜色,设计学院的页脚稍微压了一下深一些的颜色,也可以在配色上使用一些比较跳跃的颜色,用来引导视线。

        3 心理学与网页设计

        人类在互通信息的同时也在交换彼此的情绪,如果没有好的沟通情绪,所谓话不投机半句多,双方可能说没有两句话就结束谈话了。因此若要利用网络的方式做有效的沟通,则必须让沟通双方有临场感,并引起彼此“良好沟通情绪”。由于网页在计算机屏幕上呈现给别人视觉画面,因此一方面观者要学习从计算机画面上看见信息;另一方面网页设计者要了解观者的“看见”的能力,从而设计能使人易懂的画面,协助观者能看见信息。由此就涉及到一个认知的过程。认知心理学可以定义为:为了解人类行为,而对人类心智历程及结构所作的科学分析。认知心理学的主要理论架构是“信息处理模式”。这个模式视人类为主动的信息处理者,探讨人类凭感官接受信息、贮存信息以及提取、运用信息等不同阶段所发生的事,所以认知心理学也常被称做“信息处理心理学”。而对于信息,感官记忆可贮存大量的信息,只是若不予以注意,信息很快就会失去。所以要进一步“注意”,作“图样辨识”,选择需要的感官信号做进一步的处理。一般说来,感觉刺激很少的信息很难被记忆,而那些能引起人们很强感觉刺激的信息很容易被人记忆。而现今社会是一个信息爆炸的时代,人们获取信息的方式主要是从网络获得,这就必定要求在网页的设计上要遵循认知心理学的要求,才可以被人们容易感知。网页设计就要善于通过信息处理心理学,唤起欣赏者身心结构上的类似反应,利用心理学在设计网页时,会缩短与网民的距离。设计学院网页设计运用了信息心理学和审美心理学进行设计,浏览者也会在高速的信息传递中快速掌握信息,让网民对页面有深刻的认识和感知,增强版面的表现力和可读性。

        网页设计是一种综合性的设计,它所涉及的范围非常的广泛,包括消费者心理学、视觉设计美学、字体设计、标志设计、人机工程、哲学、等诸多方面,当然也离不开一定的科学技术发展。技术与艺术、色彩与版式、图片与文字、构成了网页设计,哈尔滨商业大学设计艺术学院网页设计只是网页设计中遵循原则的一个成功案例,在网络高速发展下,网页设计更似工作站,发挥更大的机能。

参考文献

1 徐珂等.网页视觉与设计[m].北京:人民邮电出版社,2003

网页设计艺术范文第2篇

近几年,网页设计已成为视觉传达设计艺术的重要组成部分。而从设计方面上来说,人们往往忽视了对其美感创新及信息传达速度,过分依赖于设计软件,使得网页设计存活于混沌之中。网页网格设计提供了一种结构建立起来的叙事关系,将页面内元素以一种合理的逻辑布局去引导浏览者的视线。但由于网页后台技术的限定,使得网页的设计更加难以发展,文章中提到运用网格系统的秩序性去美化网页的设计,使网页设计在理性的制约下更加生动。

关键词:

网页设计;网格设计;秩序;灵动

近几年来,随着科技的进步,互联网的发展使得信息的传播突破了传统的政治、经济、地域及文化的阻隔,而网页借由网络的运行,将所信息用最快、最方便的形式向网页的浏览者传达。因而网页设计作逐渐被人们所认可并认识,但是现在由于设计软件增多并过分依赖于它,致使网页设计重视技术操作,使得网页设计存活于混沌之中。而雅各布•尼尔森说:“网络是最终授权于消费者的环境,他(她)点击鼠标就能决定所有事。到达任何地方都如此简单,世界上所有的竞争者都只是一次鼠标点击的差距。”故网页设计的目标是实现内容的整合,兼顾信息量大且易于阅读,能够吸引浏览者停留在某个页面上。而网格设计的本质上来说是一件设计作品的骨骼,不仅仅能够赋予设计以秩序感,帮助形成清楚且连贯的信息关系,还能给设计的表述和创造提供丰富的机会。这也能够逐步使浏览者对网页设计的视觉美感得到认同。

一、网页设计的溯源

上世纪60年代,借由战争的推动而形成最初的计算机网络。而互联网的前身起源于1969年,美国国防部的指示下由四台计算机组成,名为阿帕网(ARPNET)。而在1974年提出的通讯协议和TCP/IP协议的应用,才使同时互联网成为一个开放系统。并在上世纪九十年代电脑技术的飞速发展,图像、声音、多媒体元素等新的数字媒介进入到互联网之中,进而网页的设计也由于一些新的技术的加入,网页中有越来越多的因素能够被规划并进行设计,这着实让网页设计成为一种全新的艺术设计形式。而网页设计是基于互联网为载体,以数字网络技术为基础,并依照、遵循设计的表现形式及其规律,以此来达到设计的目的与功能,并且网页设计强调艺术与科学要建立一个密切的联系与结合,形成一种新形式的视觉传达活动,使平面设计在现代社会中得到发展与延伸。未来的网页设计不但在依照设计的目的及要求的同时,更以所处的时代背景下获取最好的技术,加以艺术的表达形式为基础,有意识地对其进行艺术的创造性规划活动。不仅能带给网页浏览者美丽的视觉体验,同时更好的发挥了其信息传达的作用。

二、网页设计中秩序与灵动的起点

在网页设计飞速发展的时代,人们在追求着网页的强大信息量且易读的同时,寻求网页设计中的秩序与灵动的设计方法,这就可以满足网页的美感与实用性。通过多年来实践,设计师发现这些都需要有网页版式设计才能够达到,它不但使了网页富有自己独特的艺术风格及特征,还可以以此吸引浏览者的注意力,增强网页内容的秩序传达性,这种秩序不是强加于浏览者的,而是为浏览者创造独特的体验。因此,在网页设计中网页版式设计具有起点的作用,并且网页版式设计是由网格系统组成,没有网格系统的辅助,难以达到页面清晰美观,内容组织合理,无法在网页设计寻求到秩序与灵动。

(一)秩序的基本原则

自然秩序产生的前提是物理法则要能够在没有相互干扰的孤立的系统中起作用,而所有事物都是相互作用的,正是这种混乱与秩序之间的对照唤醒了我们的知觉。而秩序感通过各种工艺证明了人类喜欢节奏、秩序和事物的复杂性,设计师通过对对称与均衡、单纯与齐一、协调与对比、节奏与韵律、多样与统一灵活的运用,体现出一种带有秩序感的灵动。而将元素的秩序化组构,依照人所产生的视觉规律,主要体现在其排列的条理性,比例的合适性、节奏的合理性、以及渐变的严格性上,遵循着化繁为简、化杂乱为条理、化模糊为鲜明的原则的秩序法则,从而协调重复、均衡、对称等性质,将画面的展示增添秩序性、连续性和和谐性。

(二)网页设计中的网格系统设计

网页网格系统可以被定义为:通过对比例、秩序、连续感和现代感,将网页里的元素进行重新整合,将网页中版面布局以规范的网格排版来指导信息的分布,实现保持平衡亦或者去打破平衡。从网页设计上说起,网页网格设计的应用,不但能够整合网页的信息,方便阅读,更可以增加网页的美感,还可以有助于阅读,更具有可用性。而且,对于前端开发来说,网页将更加的有秩序和有灵活性。自网格系统应用以来,经过许多代设计师的努力,使其发展的更加精确与完善。现在的网页设计中的网格不但继承了传统印刷网格,并以此为基础,却又不同于以往的传统印刷网格,能以其的多选择性突破传统印刷媒体的限制,更具有自己特殊的特点和要求。不过传统印刷媒介中所需要设计的界面是固定的,而网页设计中有很多因素是超出设计师控制的,浏览者可以按照自己对网页视觉效果的要求来进行调整,至使显示屏所呈现的画面与最初的设计背道而驰,但是显示器屏幕每英寸由72像素构成,实际上是由数字创造的网格,这是一种区别于其他的传统媒体形式,网页设计者虽然对版面视觉效果丧失了一定控制力,但这也正是网页设计的美丽所在,而我们需要做的是让设计去适应变化多端的网格系统。

(三)网页设计中的误区

当新媒体设计与信息构筑的时代来临时,网页媒体以全新且令人激动的方式展示信息,将其诸多特点展现出来,使其能从众多的传统媒体中突显出来。与此同时,网页制作技术也得到了前所未有的革新,涌现出一些列功能愈加强大的网页制作软件,网页制作也由此变得轻松而容易起来,这种偏向性致使滋生出大量偏向重视技术操作而忽视网页设计的视觉创意美感的网页制作者,造成信息无法正确传达出来。在这种现象的促使下,如何平衡在信息高度密集的网页,不仅仅需要设计师具备审美的品质,更需要为信息的展示增添秩序性,而无论在何种网页上,网格可以向浏览者预示出信息所在,这也算是看不见的秩序,也可以在保持展示内容总体一致的前提下,为网页添加灵动性,这也是在设计中所强调的视觉有序系统。

(四)网页设计中存在的问题分析

现在有一大部分网站,不知道信息的所在,没有规则可言。如果不能在混乱之中建立秩序,使浏览者对网页设计者的意图一无所知,更使信息易读性和传达性变成一个令人困惑的难题。并且网页存在信息能容过满的问题,就将各种信息诸如文字、图片、动画等不加思考的硬塞到页面上,没有任何规范、条理可言,也更谈不上艺术处理了。此类问题导致浏览者在读取信息时会遇到诸多不便,不助于信息的交流,使网页上的设计做不到互相协作,反而相互消减。再加上页面上五花八门、不分主次的内容,网页背景做的很花哨,过度的装饰的页面,混乱了浏览者的视线,严重干扰从网页中信息的获取,更无法提及其的秩序美感。相比之下,还有一类网页我们打开,发现好像这个网页与那个网页都是一样的。无论是标题、文字及图片的位置相同,更甚到动画的效果都是如此。而这两个网站对于页面的用色秉承着随心所欲原则,其目的只是为了区分开文本和背景,与此同时失去网页的特色,使我们看网页好像每一个都是相同的,缺乏灵动性。虽然不能片面地追求视觉美感冲击力,但也不能不顾浏览者的使用性。

三.网页设计中秩序与灵动的设计应用

网页设计是视觉传达设计艺术的重要组成部分和重要分支,其未来趋势将逐步走向简单化、立体化和智能化。如何平衡网页的秩序与灵动,使其展现形式会变得简单,条理变得清晰,并做到用有秩序的形式显示最全面的内容,恰到好处地进行调整、解构,让网页设计更加有灵动性。

(一)网页设计的秩序感

俗话说:没有规矩,不成方圆。而设计也需要有一定的规矩,也可以说是一定的规则。而这种规则可以给设计带来秩序感和结构感,这种设计终将成为一件有血有肉的作品。而网页设计也是如此,通过形式美的法则,将页面中的各种视觉元素进行有组织有规律的调整,大胆的取舍,使页面获得完整、有序的视觉效果,通过这种具有单纯的秩序性,对各种凌乱的资料运用理性和逻辑思维,产生具有强烈的视觉冲击力,促进浏览者加深印象,创造清晰有序的形式感。如网站设计者常运用反复视觉流程,使网页产生的视觉效果更富有韵律美和秩序美。同时可以发现整个网页设计运用了清晰的网格可以清楚地表现网页的细节和引导浏览者进行浏览。并通过改变图像与文字的大小比例,从不同的视角展现主题,不同的比例和尺寸建立起一种叙事关系,通过用对称式形成了一种平衡、协调的感觉,带给浏览者一种条理清晰的印象。另外网页设计时,通过对页面适当的留白,能够制造处生动的进入方式,并且对页面或界面的各个元素与部分分割、区分和重组,并且留白区域可以用它来实现强调、比例、平衡和韵律。留白不会给人感觉页面“空”,反而会形成一种视觉的空间感。

(二)网页设计的灵动性

网页的整体设计,通过以周密的组织和精确的定位来获得页面的秩序感。通过散点视觉流程,将网页中的各个视觉元素进行有节奏的组构,或上、或下、或左、或右的自由移动,给人一种轻松随意带有韵律的视觉享受。并且通过对视线的引导,不但保持着网页的整体流畅、和谐的浏览观感,使浏览者更加轻松的找到所需要的内容。

(三)秩序与灵动并存的网页设计

网页设计以一种稳定、神秘的方式呈现出一下中相对灵活的创意活动。这种在有秩序的页面下追求一定的自由度,使网页设计能通过深思熟虑之后决定或特意的追求的“散”的解构,在理性授意下其内存在着一种带有灵动的秩序。而优秀的网页设计就是应该在多样中求统一,在节奏中求韵律。如网站设计者运用形式美法则,通过有序、具有美感、整体协调的手段,使浏览者能够感受到愉悦感。同时,带有韵律的平衡,可以突出网页所强调的重点。

四、结语

网页设计艺术范文第3篇

网页设计中的文字设计,首先要了解网页上文字字体的显示原理。在浏览者电脑上看到字体的过程实际上是这样的,当网页浏览器加载网页的CSS代码后,解析到有关字体的样式,便会在浏览者电脑字库中查找该字体,只有找到了相应的字体文件,才会对网页中的文字进行渲染,显示出你想要的效果。如果你的操作系统中,并没有安装网页CSS代码中定义的那种字体,就无法渲染出那种字体的效果,而通常使用当前系统的默认字体来代替。网页设计是面对所有浏览者的,所以这个问题,才是选择字体的最大难点。解决这个问题只有从两个方面进行出发:(一)使用宋体等常用的字体。所有浏览器默认的标准字体是中文宋体和英文timesnewRoma字体。如果没有进行任何字体设置,在任何操作系统和浏览器里网页将以这两种标准字体显示保持正确。现在大多数电脑操作系统为微软的windows系统,其安装时就自带的4种中文字体和40多种英文字体,四种中文字体分别为宋体、黑体、楷体(GB2312)、仿宋(GB2312)。凡是在windows操作系统的浏览器使用系统自带的字体都可以正确显示这些字体。(二)图片的方式置入网页。根据网页中的设计思想而选择相应的字体,设计师往往需要用一种特殊的字体来体现自己的风格,那么特殊字体或艺术字体因为字体的原因只能在本机电脑上显示成功。为避免这种情况的出现,设计师可以把文字进行栅格化,把文字变为图片的形式,最好以图片的方式置入网页,以保证所有人看到的网页效果相同。

二、文字的大小设置

由于网页设计是基于电脑虚拟平台,其展示方式区别于之前的传统媒介的实物展示,它需要在显示终端中展现。而现在显示终端百花齐放,网页设计师需要考虑不同客户端的浏览体验,而文字大小直接决定了网页的视觉效果,是用户体验中的一个重要部分。不同的显示器尺寸,不同的分辨率设置,不同的DPI参数,乃至不同的浏览器预设,都会对最终展现的文字大小带来影响。虽然现在很多浏览器已经可以方便地缩放页面,但用户每次都要重新缩放,而且许多用户不习惯缩放页面达到最佳视觉效果。这就要求网页设计师最好还是根据绝大多数用户的使用习惯,设置一个比较体贴的默认字号。

三、文字的颜色选择

网页设计艺术范文第4篇

(一)使用宋体等常用的字体

所有浏览器默认的标准字体是中文宋体和英文timesnewRoma字体。如果没有进行任何字体设置,在任何操作系统和浏览器里网页将以这两种标准字体显示保持正确。现在大多数电脑操作系统为微软的windows系统,其安装时就自带的4种中文字体和40多种英文字体,四种中文字体分别为宋体、黑体、楷体(GB2312)、仿宋(GB2312)。凡是在windows操作系统的浏览器使用系统自带的字体都可以正确显示这些字体。

(二)图片的方式置入网页

根据网页中的设计思想而选择相应的字体,设计师往往需要用一种特殊的字体来体现自己的风格,那么特殊字体或艺术字体因为字体的原因只能在本机电脑上显示成功。为避免这种情况的出现,设计师可以把文字进行栅格化,把文字变为图片的形式,最好以图片的方式置入网页,以保证所有人看到的网页效果相同。

二、文字的大小设置

由于网页设计是基于电脑虚拟平台,其展示方式区别于之前的传统媒介的实物展示,它需要在显示终端中展现。而现在显示终端百花齐放,网页设计师需要考虑不同客户端的浏览体验,而文字大小直接决定了网页的视觉效果,是用户体验中的一个重要部分。不同的显示器尺寸,不同的分辨率设置,不同的DPI参数,乃至不同的浏览器预设,都会对最终展现的文字大小带来影响。虽然现在很多浏览器已经可以方便地缩放页面,但用户每次都要重新缩放,而且许多用户不习惯缩放页面达到最佳视觉效果。这就要求网页设计师最好还是根据绝大多数用户的使用习惯,设置一个比较体贴的默认字号。

三、文字的颜色选择

网页设计艺术范文第5篇

关键词: 网页设计 色彩 配色

计算机技术的发展使信息事业产生了飞跃,互联网在信息传播中扮演了无比重要的角色。从最初简单的纯文本界面到如今五光十色的多媒体界面,网页设计经过短短十多年的发展,已在世界各地产生了广泛的影响。作为一门与视觉传达设计密切相关,并具有功能性的设计艺术,网页设计始终必须遵循形式与功能的统一性和协调性,艺术与技术的高度统一。

网页设计者在掌握了网站、网页的构建技术之后,所面临的关键性的问题之一就是网页的色彩搭配。在五彩缤纷的世界中,色彩是吸引视觉的重要因素。就感觉而言,色彩与形状相比能够产生更直接、更强烈的影响。

一、色彩在网页设计中的地位

现代社会,人们每时每刻都要与色彩打交道,追求时尚、体验消费已经成为一种文化,体现出人们对高品质生活的追求愈加强烈。当我们步入商场、超市的时候,各类琳琅满目的商品,以优美的造型、鲜艳的色彩展现在我们面前,我们在仔细享受那些独特造型和美妙色彩的商品时,更容易被那些具有强烈色彩的物品所吸引,这便是色彩的作用,因为颜色在现代设计中具有强烈的视觉感召力和表现力。

对于网页设计来讲,其信息内容的有效传达是通过各种构成要素的设计来实现的。网页的构成要素包括文字、图形、图像、标志、色彩等。其中,色彩的设计尤为重要。从一定意义上说,网页也是一种艺术品,因为它既要求文字的优美流畅,又要求页面的新颖、整洁,使色彩可以产生强烈的视觉效果,使页面更加生动。而且浏览者在浏览网页时,留下的第一印象就是页面的色彩设计,它的效果直接影响到阅读者的浏览兴趣。因此,色彩设计在网页中居于十分重要的位置。

二、网页色彩搭配的原理

1.色彩的鲜明性。网页的色彩要鲜明突出,容易引人注目。

2.色彩的独特性。要有与众不同的色彩,使得学习者对网页具有深刻的印象。

3.色彩的合适性。色彩和你表达的内容相适合。如用粉色体现女性主题网页的柔性。

4.色彩的联想性。不同色彩会产生不同的联想,蓝色想到天空,黑色想到黑夜,红色想到喜事等,选择色彩要和网页的内涵相关联。

当一个网页作品色调决定了之后,就应该考虑它的主次关系和色彩搭配,而不能平均的使用色彩。色彩面积大小是直接影响色调的重要因素,色彩搭配首先要考虑大面积色彩的安排。决定了画面中的主色,往往就决定了它的调子和方向,接下来就是要考虑用什么颜色来调配它们之间的比重,并确定调和到什么程度,才能符合自己策划的画面的氛围。得体的色彩表现和艺术处理,能在浏览者的视觉中产生夺目的效果。同时,色彩的运用要考虑内容的需要,用不同色彩对比的效果来表达不同内容和思想。

运用相同色系色彩。这种搭配易于使网页色彩趋于一致,使网页色彩达到网页和谐统一的效果,因而是一种风险极小的搭配方法,缺点是容易造成页面的单调,因此往往利用局部加入对比色来增加变化,如局部使用对比色彩的图片等。

运用对比或互补色。这种方式可以使色彩关系丰富多样,谐调、悦目,容易达到活泼、运动的网页效果,特别适合体现轻松素材的网站,在设计时需要注意主体色彩的运用,以一种或两种色彩占主导地位,再用相异的色彩作为陪衬、点缀和调节。

使用黑、白、灰的特殊作用。黑、白、灰的对比作用既强烈有效,又微妙而耐人寻味,不能因为它“无彩”而有所忽略,它们在画面中充当过渡色,能够以色彩的中性使画面调和,以自身的单调使画面丰富,使色彩搭配技术更上一层楼。

三、网页设计色彩运用的注意事项

1.网页设计要与网站的色彩相统一

网页设计要与网站的色彩相统一,是指在整个网站中,色彩的含义始终保持一致,不过多改变,在整个网页布局中,各区域的背景色,各种按钮的颜色应基本不变,在同一区域中,颜色的运用更应该保持一致。

2.色彩的运用要与内容主题相统一

网站色彩的运用要与内容主题相统一,是指在设计网页时,一定要根据内容确定一个色彩基调,如内容活泼的常用鲜艳、亮丽的色调。政治类的常用暖色调,它对于烘托主题思想,表现环境气氛,构成一定的情境有重要作用。

3.色彩的运用要注重突出内容主体

要通过色彩的对比,使网页内容主次分明、层次清晰,比如所以浅色背景用深色字,深色背景用浅色字,用鲜艳色彩作为活动中的前景,以冷色,暗色、浅色作为背景等。

四、网页设计中用色的小技巧

1.对多数网页特别是有大面积文字的网页来说,应采用白色或浅色的背景,如浅灰色、淡黄色、浅蓝色或浅绿色,文字采用黑色或深颜色;

2.避免在浅色背景使用明亮颜色的文字,因为这样文字会很难辨认;

3.深颜色背景上使用浅色的文字是一种很好的组合,但是如果不是特别需要,应留作那些需要引起浏览者特别注意的小块区域和场合,比如标题图形等;

4.使用黑色背景许多时候显得太沉重,可以考虑使用深灰色、深蓝、栗色等;

5.白色、浅灰色、浅蓝色、浅绿色、浅褐色很适合作为深色背景上的文字颜色;

6.大的、粗体的文字比常规尺寸的文字更适合使用;较强的颜色,可考虑鲜红色,橙色,明亮的蓝色,但注意不要滥用。

五、结语

网页色彩设计已经不只是一般的美工,而是综合了许多其他学科的实践应用领域,它涉及美学、光学、心理学、教育学和民俗学等多门学科。因此,网页的色彩设计需要有更高的要求。准确的、有创意的色彩设计,对网站的宣传推广有事半功倍的作用。

参考文献:

[1]索昕煜.网络界面色彩设计研究[D].昆明理工大学学报,2005.

网页设计艺术范文第6篇

【关键词】广播 互联网 网页界面 艺术设计

网页艺术设计是伴随着计算机互联网络的产生而形成的艺术设计新课题,是网页设计者以所处时代所能获取的技术和艺术经验为基础,依照设计目的和要求自觉地对网页的构成元素进行艺术规划的创造性思维活动,必然要成为艺术设计的重要组成部分,并随着网络技术的发展而发展。如今,网页艺术设计不仅仅是关于网页版式编排的技巧与方法,而是艺术与技术的高度统一。

作为安徽人民广播电台的官方网站安徽广播网,它的艺术设计则包括了风格定位、版面编排、色彩处理、浏览方式、链接功能等诸多方面,其中色彩处理有着举足轻重的作用。

一、网页艺术设计的内容

设计活动中包含主观和客观两方面的因素,在确立了网页主题之后,首先要明确和熟悉设计的对象和构成的要素。网页艺术设计涉及的具体内容很多,可以概括为视听元素和版式设计两个方面。

这里所说的视听元素,主要包括:文本、背景、按钮、图标、图像、表格、颜色、导航工具、背景音乐、动态影像等。无论是文字、图形、动画,还是音频、视频,网页设计者所要考虑的是如何以感人的形式把它们放进页面这个“大画布”里。多媒体技术的运用大大丰富了网页艺术设计的表现力。

网页的版式设计同报刊杂志等平面媒体的版式设计有很多共同之处,它在网页的艺术设计中占据着重要的地位。所谓网页的版式设计,是在有限的屏幕空间上将视听多媒体元素进行有机的排列组合,将理性思维个性化的表现出来,是一种具有个人风格和艺术特色的视听传达方式。它在传达信息的同时,也产生感官上的美感和精神上的享受。

二、网页色彩设计的运用

1、网页色彩的作用

色彩是艺术表现的要素之一。在网页设计中,根据和谐、均衡和重点突出的原则,将不同的色彩进行组合、搭配,来构成美丽的页面。根据色彩对人们心理的影响,合理地加以运用。按照色彩的记忆性原则,一般暖色较冷色的记忆性强;色彩还具有联想与象征的特质,如红色象征血、太阳;蓝色象征大海、天空和水面等。网页的颜色应用并没有数量的限制,但不能毫无节制地运用多种颜色,一般情况下,先根据总体风格的要求定出一至二种主色调,有CIS(企业形象识别系统)的更应该按照其中的VI进行色彩运用。色彩总的应用原则应该是“总体协调,局部对比”,也就是主页的整体色彩效果应该是和谐的,只有局部的、小范围的地方可以有一些强烈色彩的对比。

2、网页色彩的设计原则

网页色彩搭配既是一项技术性工作,也是一项艺术性很强的工作。因此,设计者在设计网页时除了考虑网站本身的特点外,还要遵循一定的艺术规律,从而设计出色彩鲜明、性格独特的网站。一个网站的用色必须要有自己独特的风格,这样才能显得个性鲜明,给浏览者留下深刻的印象。

网页设计虽然属于平面设计的范畴,但它又与其它平面设计不同,它在遵从艺术规律的同时,还考虑人的生理特点,色彩搭配一定要合理,给人一种和谐、愉快的感觉,避免采用纯度很高的单一色彩,这样容易造成视觉疲劳。

网站设计也是一种艺术活动,因此它必须遵循艺术规律,在考虑到网站本身特点的同时,按照内容决定形式的原则,大胆进行艺术创新,设计出既符合网站要求,又有一定艺术特色的网站。

3、网页色彩的设计方法

网页色彩设计得好,可以为网站锦上添花,达到事半功倍的传播效果。在网页色彩设计中,要充分利用色彩的色相、明度、纯度、远近、冷暖、轻重等对比关系,强化网页的视觉效果。

确定网站的主色调及辅助色。网页中可以采用多种色彩,但一个网页中只能有一个主色调。主色调就好比乐曲中的主旋律,对网页起着主导作用。选择主色调时,应首先确定网站的主题、服务对象和所要表达的气氛,以及利用色彩所希望达到的目的,如树立形象、推广产品、娱乐大众、传播信息等。不同的网站定位会延伸出不同的色彩取向,该色彩取向决定了这个网站的风格,或严肃、或活泼、或前卫等。 主色调主导着整个网页的风格和意境,而辅助色的面积虽小,却起着缓冲和强调的作用。辅助色能让页面有生气、有趣味,使主色调流畅。辅助色与主色调搭配合理,可使整个页面特色鲜明,引人注目。网页的辅助色可用主色调的邻近色,也可用对比色。

确定文字、配图的色彩效果。作品内容的表现是通过造型、色彩、构图、文字等多种形式共同完成的,内容与形式的统一是色彩协调成功的条件。不同的内容需要不同的色彩来表现。网页以文字信息为主,网页文字要有良好的可读性与清晰度,除了考虑文字的字体、大小、字距、行距等以外,还必须重视文字色彩与背景色彩的配合。对于图形感较强烈的页面,首先要将底色与图形色的反差拉开。如使用一些在色相、明度、饱和度上具有强对比关系的色彩,这样既能起到烘托主题图形的作用,也可使得页面色彩主次分明。其次,要结合图形的面积情况处理底色和图形色:如果图形大,则图形色可以使用主色调;如果图形小,则图形色可配置鲜艳的色彩。

4、正确使用图像及其色彩

图像在网页中起着画龙点睛的作用,不但能装饰页面,还能表达风格与情感。但网页如果图片过多或色彩使用不当,会导致浏览、下载的速度变慢,从而使网页的点击率下降,所以要正确使用图像及其色彩。

色彩作为网页设计中一个重要而独特的设计元素,应该受到网页设计师的足够重视。色彩设计是网页设计的灵魂,网页设计师要以科学的色彩理论为指导,把美学规律同现代网页设计技术结合起来,以敏锐的色彩感觉去发现,以高超的配色技巧去完成,在创造出更时尚、更鲜活、更具吸引力的网页色彩作品的同时,也不断引导和提高大众的色彩审美情趣和能力。

三、网页艺术设计的处理

1、网页艺术设计的原则

网页作为传播信息的一种载体,同其他出版物如报纸、杂志等在设计上有许多共同之处,也要遵循一些设计的基本原则。但是,由于表现形式、运行方式和社会功能的不同,网页设计又有其自身的特殊规律。网页的艺术设计,是技术与艺术的结合,内容与形式的统一。它要求设计者必须掌握以下三个主要原则:

第一点,主题鲜明。视觉设计表达有明确的主题,并按照视觉心理规律和形式将主题主动地传达给观赏者。诉求的目的,是使主题在适当的环境里被人们及时地理解和接受,以满足人们的实用和需求,这就要求视觉设计不但要单纯、简练、清晰和精确,而且在强调艺术性的同时,更应该注重通过独特的风格和强烈的视觉冲击力,来鲜明地突出设计主题。

第二点,形式与内容统一。任何设计都有一定的内容和形式。内容是构成设计的一切内在要素的总和,是设计存在的基础,被称为“设计的灵魂”;形式是构成内容诸要素的内部结构或内容的外部表现方式。设计的内容就是指它的主题、形象、题材等要素的总和,形式就是它的结构、风格或设计语言等表现方式。内容决定形式,形式反作用于内容。一个优秀的设计必定是形式对内容的完美表现。正如黑格尔所说:“工艺的美就不在于要求实用品的外部造型、色彩、纹样去摹拟事物,再现现实,而在于使其外部形式传达和表现出一定的情绪、气氛、格调、风尚、趣味,使物质经由象征变成相似于精神生活的有关环境。”

第三点,强调整体。网页的整体性包括内容和形式上的整体性,这里主要讨论设计形式上的整体性。网页是传播信息的载体,它要表达的是一定的内容、主题和意念,在适当的时间和空间环境里为人们所理解和接受,它以满足人们的实用和需求为目标。设计时强调其整体性,可以使浏览者更快捷、更准确、更全面地认识它、掌握它,并给人一种内部有机联系、外部和谐完整的美感。整体性也是体现一个站点独特风格的重要手段之一。

2、网页艺术设计的特点

交互性与持续性。网页不同于传统媒体之处,就在于信息的动态更新和即时交互性。即时的交互性是Web成为热点的主要原因,也是网页设计时必须考虑的问题。

多维性。多维性源于超级链接,主要体现在网页设计中对导航的设计上。由于超级链接的出现,网页的组织结构更加丰富,浏览者可以在各种主题之间自由跳转,从而打破了以前人们接收信息的线性方式。

多种媒体的综合性。目前网页中使用的多媒体视听元素主要有文字、图像、声音、视频等,随着网络带宽的增加、芯片处理速度的提高以及跨平台的多媒体文件格式的推广,必将促使设计者综合运用多种媒体元素来设计网页,以满足和丰富浏览者对网络信息传输质量提出的更高要求。多种媒体的综合运用是网页艺术设计的特点之一,是未来的发展方向。

技术与艺术结合的紧密性。网络技术与艺术创意的紧密结合,使网页的艺术设计由平面设计扩展到立体设计,由纯粹的视觉艺术扩展到空间听觉艺术,网页效果不再近似于书籍或报刊杂志等印刷媒体,而更接近于电影或电视的观赏效果。技术发展促进了技术与艺术的紧密结合,把浏览者带入一个真正现实中的虚拟世界。技术与艺术的紧密结合在网页艺术设计中体显得尤为突出。■

参考文献

①顾群业等编著:《网页艺术设计》,山东美术出版社,2002

②张帆等:《网页界面设计艺术教程》,人民邮电出版社,2002

③邓文达、龚勇 编著:《美工神话》新版,人民邮电出版社,2006

网页设计艺术范文第7篇

随着4G网络的成熟和智能手机的普及,网页设计师不仅能制作普通网页界面,更多是能设计艺术界面和交互界面的网页,能适应多平台等特点。根据我学院每年对企业调研,目前企业对网页设计师的要求:(1)根据企业需求和定位能够设计符合当下交互技术的流行网页界面;(2)能够制作静态网页和网页前端javascript特效,较好配合后台程序员进行网站开发;(3)有较强的自学能力,是艺术与技术相结合的高素质技术技能型人才。

2高职网页设计课程的教学现状

我院对福建省同类高职院校的网页设计人才培养进行广泛调研,很少院校能够培养符合企业需求的网页设计师,致使我省应届毕业生难于满足社会对网页设计人才需求。高职网页设计课程的教学现状是:

2.1开设课程不满足社会对网页设计师的要求网页设计课程是一门综合性的课程,是它包括构图、排版、特效制作等多种知识,决定了这门课程具有很强的综合性、实践性、融艺术性与技术性为一体的特点。而高职院校教学虽然在开设网页设计课程体系上采取一定改革措施,但针对性不强,如针对企业需要艺术与技术相结合的网页设计人才,专门开设了《网站色彩与构成》、《网页设计》、《网页设计实训》、《程序设计基础(java方向)》相关专业技术课程,也专门开设了《设计素描》、《设计色彩》、《构成设计》等美术课程,但没有真正以企业工作过程为导向,开设艺术与技术相结合的网页综合项目课程,学生很难融会贯通运用综合知识进行网页设计,另一方面由于网页设计技术的飞速发展,从最早的表格布局到现在DIV+CSS布局,网页语言从最早的HTML1.0到现在的HTML5,网页的设计风格也随着时代的变化而不断改变,社会对网页设计师的要求不断提高,而高职院校相关专业课程没有适时更新,学生也缺乏提升自我的学习能力,因此高职毕业生很难适应网页设计这一行业的人才需求。

2.2教师专业水平有限,团队意识不强有的高职院校虽然按照企业工作过程开设网页设计相关课程,但由于各个任课教师专业水平不同,团队意识不强,较难形成一个企业整体项目意识,通常每个教师根据自己方向选择各自企业项目进行网页设计相关课程的教学,有的教师自身受限专业水平与实践技能,无法与专业组教师达成共识,造成学生在学习网页设计专业课程体系无法形成专业整个知识技能体系,网页设计综合技能很难得到提高,只能满足于淘宝美工却无法胜任电商网页设计师。

2.3教学方法单一,仍以传统教学为主长期以来在教学中仍以教师为主体,而忽略学生的主体地位。h教师在授课中,往往先讲解网页各独立元素的设计制作,与整体案例的设计制作相分离,导致学生在实践过程中,学生只掌握每个工具单独使用,不能将网页各独立元素的制作与整体项目相结合,当需要综合运用各种软件工具知识去制作完整项目时,却显得力不从心,即整体性不强。这种传统教学方法优势是整个教学过程比较系统完整,授课内容还是以理论知识为先导,教学手段单一,老师虽是孜孜不倦的教,而学生兴趣缺乏,参与性不强,不能培养学生的自主学习能力和团队协作能力,往往老师累得满头大汗,学生却收获甚微。

2.4生源质量参差不齐随着高职招生人数不断上升,生源质量参差不齐,生源质量也在下降。教师引入企业项目进行网页设计教学,学生完成的程度和质量不一,有些同学无法跟上进度,就出现厌学、迟到及旷课等现象。

3网络环境下“网页设计”混合式教学构建模式及优势

3.1网络环境下“网页设计”混合式教学构建模式网页设计集艺术与技术为一体综合性课程,既需要个人创意设计能力,又需要全面应用高新技术能力,具有很强的实践性和综合性。在网页设计授课过程中,教师要从易到难引入企业项目,引导启发学生,并在课堂上统一进行项目分析,在讲解过程中,将网页设计的艺术美学及专业技术知识融入到所要完成项目中,调动学生的学习积极性、自主的对网页综合知识进行建构,同时通过现代网络视频教学,演示网页设计从选定项目、制定计划、活动探究、制作作品、成果展示、综合评价等环节,激发学生对网页设计项目整体认识,对网页设计的兴趣,让学生自己产生要制作属于自己的项目作品,学生从传统教学“要我学”变为混合教学“我要学”的教学模式。通过混合式教学模式,把传统学习方式的优势和网络学习方式的优势结合起来,教学以学生为主体,充分挖掘学生学习过程过程积极性、主动性和创造性,培养艺术与技术相结合的网页设计技术技能型人才。搭建好的网页设计的网络教学平台、教育教学资源库,运用在线教学与课堂教学优势互补的混合式教学模式,教师通过基于网络的课堂进行教,学生除了课堂学习外,课后自主在线学习、在线做作业、讨论协作、在线答疑等学习活动。将教师的网页设计教学由课堂上扩展到了课堂外,才能真正培养出综合能力强、创造性思维突出的网页设计人才。

3.2网络环境下“网页设计”混合式教学的优势(1)提高教师“双师”素质:网页设计课程是基于企业项目教学,项目设计是项目教学的成败的关键,要求教师不仅要具备深厚的理论知识,还应具有一定职业技能与实践经验,即教师具备“双师”素质,通过网络教学平台建设,优秀专业教师与企业技术人员带领专业较弱教师,共同完成项目网页设计整体设计。通过开展混合式教学,进一步提高教师的教学设计水平和实践技能,更新教师的教育观念,提高教师自身的业务水平,促进教师向双师型转变。(2)教学资源丰富:教师与企业技术人员在网络教学平台提供各种媒体素材,包括视频、动画、课件、网页设计优秀作品等教学内容,远远超过教师课堂讲授与教材内容。网络教学平台进一步为学生提供课后学习实践企业项目,引入企业项目任务,能从高职学生特点出发,项目从易到难,循序渐进,让学生学习实践觉得能“跳着够得着”,既有挑战性,又能完成企业项目并使学生获得成就感,提高学生综合实践技能。通过网络在线教学优势,为学生提供了自由选择的学习空间,有更丰富网络学习资源,激发学生学习兴趣,调动学生的主动性与积极性,有效提高了学生的创新思维能力,对于培养学生的创造精神和树立终身学习的观念有重要的意义。(3)学习自主性:传统的课堂教学受限上课时间,教学内容也受限,存在形式与内容单一。特别对于学生难于理解的重点与难点,老师可能认为在课堂已讲解很清楚,但学生还是没有理解等诸多弊端,而通过混合式教学,利用网络在线教学等辅助手段在很大程度上弥补了这种不足,让学生能在课后按需学习,让差生或请假学生补缺补漏,赶上全班统一进度。通过网络教学平台和教育教学资源库,可以24小时开放教学,大大打破上课的时间限制,学生可以把课堂当中没有消化的内容利用网络的在线自主学习,进一步的加深理解,使课堂教学加以延伸。利用在线学习,基础好的同学也可以通过网络教学平台和教育教学资源库进行自学,提升自己的学习能力。(4)网络在线答疑:利用在线系统为教师和学生提供一个良好的交流平台,师生通过平台将获得更多的沟通机会,师生之间在平台上在线讨论交流答疑,学生之间也可以在平台上在线讨论交流答疑,及时解决学习过程中遇到问题,调动了学生的积极性,进一步提高教学水平。

4混合式教学模式实例分析

在网络环境下,构建与传统教学相互融合网络教学平台,实现交互式教学平台,学生自主学习的空间。下面以学院《Dreamweaver网页设计》为例说明,实现传统教学与网络教学的混合教学模式。

1.设计制作企业项目。课前教师与企业人员共同设计制作《**企业网页设计》项目,共构建八个学习情景:《学习情境1企业网页图文混排》;《学习情境2企业网页表格数据制作》;《学习情境3企业网页表格布局》:《学习情境4企业网页超链接设置》:《学习情境5企业网表单网页制作》;《学习情境6企业网页制作-css样式表应用》:《学习情境7企业网页布局-div+css布局》;《学习情境8企业网页JavaScript特效应用》。

2.课堂教学内容以网页设计的工作过程为依据,划分上述八个学习情境,采用混合式教学模式,按任务展开教学。每个学习情境都包含:①任务导入:首先提供学生与所讲知识相关的网页案例,吸引学生注意,然后导入学习情境任务;②分析总结:教师引导学生发现问题,并提出问题,激发学生学习兴趣,经过共同分析与讨论,总结出具体的制作方法;③实训(仿真实践,在线测试):学生根据学习情境,在教师的示范讲解下,独立完成操作,在线测试。④讲评总结:学生在制作过程中会出现各种各样的问题。教师所做的是将问题汇总。总结出相关的注意事项,点评作业时,侧重学生的思维引导,及时给予学生鼓励。⑤能力扩展:提供给学生实践性较强的案例,要实现效果,需要结合以前的知识和运用一定的技巧。这样既扩大了知识面。又体现了知识的综合性。在课堂讲解环节,可以适时插入教学视频、技术操作视频、实例展示等内容,解决传统教学方法无法讲清楚的知识点和实际操作演示,使教学效果更生动具体。通过学习情境,学生目的明确,整体性学习Dreamweaver软件各个工具,运用到每个学习情境任务中,学习网页各独立元素与整体学习情境相结合。

3.在网络学习平台上,教师上传课前准备《Dreamweaver网页设计》学习指南、课堂讲解八个学习情境模拟、仿真实践、在线测试、网络资源、网络答疑等环节。(1)学习指南:包括课程介绍、课程标准、学习建议、链接优秀网站的网址等,让学生了解本门课程的教学目的、要求和学时分配,当学生遇到网页设计问题时,就可以在学习指南资源库中找到满意的答案。(2)学习情境模拟:教师授课、实践操作视频。(3)情境模拟部分:有10个训练素材,学生可以选择训练企业项目进行自我训练,学生之间还可以通过网络互相交流;(4)仿真实践环节:在一定程度需要借助仿真实训软件,应用于学生日常实训和各阶段试。(5)网络答疑:网络给师生提供了一个交流的平台,师生可以通过QQ、邮箱、论坛等形式进行交流,教师可以及时了解学生的学习情况。(6)网络资源:网络资源包括相关网站、相关视频、课程课件、讲义、行业信息、参考书籍、学生实训实录等补充资源,供学生课外学习。这样便于因材施教,使好生更优,差生进步更快。

5小结

网页设计艺术范文第8篇

关键词:通感;网页设计

中图分类号:TP37文献标识码:A文章编号:1009-3044(2015)29-0138-02

作者简介:周金霞(1977—),女,山东济宁人,硕士,助教,研究方向为数字媒体艺术

1通感概念及应用状况

通感意即感官间的迁移。在心理学领域被解释为针对一种感官的刺激能同时引发另一种感官的反应。艺术研究领域中,通感也有着丰富的研究成果,陈育德先生在其《灵心妙悟-艺术通感论》中曾提出,在各类艺术作品中通感有着不同类型的表现,它能够使得创作者、欣赏者突破单一的感觉局限,丰富人们的审美体验。通感的本质是一种艺术心理机制,是营造意象、形象、意境的艺术表现方式。1目前,在文学、产品设计、视觉传达设计、平面设计等诸多领域,通感现象的应用都受到重视。设计过程中,通过对设计(或创作)对象的表象与意象充分的分析,适当地运用通感方式引导创作,使作品呈现出格外的魅力。

2网页设计与“体验”需求

生活在数字化时代,人们可以越来越便利、高效的获取信息。随之而来,人似乎只剩下面对冰冷的屏幕、键盘敲击、注视这样的简单行为。近些年,设计行业开始逐渐注重在设计活动中强调叙事和体验。满足用户不断提高的体验需要,重视人的情感需求已经成为当下设计活动中的重要趋势。“网页设计是近二十年以来意义深远的新兴设计领域形式”。2区别于传统的平面设计等门类,一般而言,在网页当中可以承载的媒体形式集“音”、“文字”、“图像”、“视频”于一身。可见就其本身的特殊形式而言,在设计创意过程中,合理使用视觉、听觉等素材,以通感思维的角度大胆创意,是具有天然优势的。通过合理创作可以调动浏览者的感官,使浏览者沉浸于网页的意境,网页设计的诉求能够被感知,进而满足数字化生活中人们对“体验”的需求。

3通感对创作主体的影响

在设计中,创造性思维的锻炼必不可少,在创意思维的锻炼中丰富的联想与想象又是不可或缺的。网页设计教学之初,面对有基本设计表现能力的教学对象,将通感作为一种创意思维方式,启迪学生的创意设计,往往能够事半功倍的激发创作主体的创作兴趣。例如在网页设计课堂教学活动中,为某传统品牌重新设计网站界面,引导学生不仅仅从视觉角度切入,而是先尝试对品牌有所认知,之后自主选择感兴趣的品牌,尝试进行再创意设计。学生在创意陈述时,一般都能择取与成长、记忆有所关联的品牌。

4通感与网页创意设计

激发创作兴趣仅仅是网页设计教学中的第一步,在教学环节中,结合网页设计的多媒体特性,教学对象需要掌握通感中各个要素的特点,尤其是能够运用“视觉”、“听觉”,结合网页设计的多媒体特性和互动特征,步步为营,精心设计,打造一部能够“唤醒”人的感受的多媒体网页作品。

4.1视觉与触觉

触觉从心理学角度而言,是一种主观类型,主要依赖于个体的生活体验、阅历等。在设计中如果能做到以视觉感知、调动触觉活动,进而使得人们产生一触即发、一探究竟的愿望,这将是视觉与触觉通感带来的最佳效果。在网页界面之中,图形图像需要完成的任务不仅仅是展现“美”,还必须兼具引导用户使用的实用功能。因而尝试利用视触通感是视觉创意中优选的策略。4.1.1材质肌理在一般的视觉设计中,视触通感最常见的表现形式是肌理特性的视觉呈现引发出关于触觉的联想。手工爱好者网站MADEINMAD3,在界面中呈现出生动的工具,诸如“纽扣”“卷尺”“剪刀”等数字形象,仿佛触手可及。典型的视觉典型迅速构建了一个手工爱好者的精神家园。毫无疑问,这样的界面会帮助到访的目标用户第一时间建立起友好、熟悉的感受。网站上方的主导航利用了纽扣的圆形结合布料质感给出自然而然的主导航提示,用户自然而然的产生试图抚触以获得更多信息的行文,网站用户可以轻松自如的依据导航找到自己所需要的相关信息。

4.1.2行为认知的交互表现

在视觉范畴下的视触通感不仅仅涵盖肌理、触摸特征的视觉表现,还体现在行为认知的交互行为中。一般认为,行为习惯是人们长期习得的行为方式。对于用户而言,将日常生活的点点滴滴逐渐转移到各种设备的屏幕上已成为常态。移动互联网拟物化的界面设计,针对到有着较多移动设备使用经验的用户来说为避免累赘,有可能在视觉表现上另辟蹊径。大受好评的日程管理应用ANY.DO4图形界面极为简洁。在界面中不难发现它实质上是采用了用户日常行为习惯的模仿设计,当我们把写在本子上的行程完成时,我们一般会划去,而在此设计中,正是采用了此种方式。用户在使用数字产品时迅速关联到现实生活的使用记忆,即可心领神会,迅速实现了情感上的互通。

4.2听觉与视觉

网站设计中,可以有效地借助声音配合画面进行设计,进而传递品牌形象、营造与表现主体一致的故事氛围。

4.2.1声效设计

在喜力啤酒5配合世界杯设计的产品网站中,当鼠标移到已满18岁可以进入页面按钮,按钮触发音效为体育场上的口号声和呼喊声,积极地调动了受众的视觉、听觉。同样,当进入不同类型产品展示页面中,点击不同类型的啤酒时,网页通过一只手在冰桶中拿酒的形象来进行展示,同时伴以啤酒瓶与冰块撞击摩擦的强劲音效。顷刻之间,喜力啤酒的冰爽、清凉,通过视觉与听觉的合力,迅速引发了浏览者的味觉甚至触觉的联想。使浏览者感受到喜力啤酒这健康向上、积极热情的品牌形象。这里,听觉要素的运用无疑为品牌塑造贡献了重要的一笔。网站借助与主体一致的音效设计,使得网页所展示的信息量增大,不仅仅使浏览者看到视觉形态,还能够营造立体氛围,增强了品牌传递过程的感染力。

4.2.2背景声音

背景声音是迅速的构造故事化情境的有效方式。声音促发人的想象力,激发人的联想,鉴赏者在感知的基础上,通过联想或想象,如临其境被作品吸引,从而形成正面积极的体验。例如同里的南园茶社网站6。南园茶社坐落于同里的“南市晓烟”景致之中。该茶社始建于清末,素有“江南第一茶楼”的美誉。在此网站的设计中将中国南方古镇建筑及装饰的种种细节融汇在网站设计中,将手工编织的吊篮、古旧的留声机、油灯、木茶壶和酒葫芦等视觉符号,同抑扬顿挫,轻清柔缓的苏州评弹结合起来,营造出浓浓的江南水乡气息。

4.3动态交互与通感

相对于平面设计、产品设计而言,动画元素是网页设计可用的特殊的表达方式。使用得当的话,往往可以增强用户对界面反馈的认知,在轻松愉悦的过程中完成交互。

4.3.1交互动态效果

天猫网站7关于购物车的动效设计中,模拟了人们在超市购物时取放物品至购物车的行为。点击加入购物车图标后,商品图标以抛物线形态飞出,落在界面中的瞬间,购物车所在的提示页面友好呈现。该动效能够在触发视觉注意的同时引起使用者的心觉联想,把现实生活经验与网络购物行为迅速关联,产生情感上的互通,以达到通感效果。促进了信息的高效传递。

4.3.2交互环节动画设置

网络多媒体环境中对交互流程进行充分的预见,以有趣的界面引导用户克服操作过程中的障碍。对有可能出现的页面加载延迟、网速卡顿等不利情况,使用合适的趣味化设计,取得用户的理解。例如,在用户的网速影响界面的使用速度时,卡通形象的等待画面会呈现出来,伴随之一句调侃般的“网速不给力啊”,会让使用者感受到这个产品的人情味。在学生创作项目中,要求创作者充分预见网络交互流程中的各个环节,根据项目特色,设计动态界面。使浏览者即使在网络不佳的等待中也设计作品的个性感染,如图学生作品为采用html5视差滚动技术制作的科普类型网站《航天梦想》,创作者以年轻的学生群体作为目标受众,意图通过交互网站普及航天知识。网站通过轻松趣味的扁平化图形界面,多层空间动画形式,以界面中小火箭在太空穿行的方式,讲述了航天史上的重大事件。设计图形活泼有趣,兼顾网络带宽限制,在网速出现卡顿时,加载动画页面出现,微微扭动的秒针图形,具象化的告知网站后台的努力动作,使浏览者即使在这样的网络延迟的等待中为创作者的幽默感染,有效地实现了情感沟通。综上所述,正在被数字化包围的现代生活中,人们需要有情感的设计。网络正在成为日常生活的组成部分,如何使学习中的设计者关注网页设计的特性,设计出优秀的符合人群需求的网络作品,是网络设计教学中关注的要点。以“通感”作为切入点,可以使创作者感知项目的人情味,激发创作欲望;在创作流程中,必须依据网页设计的特性,熟练的运用设计语言,激活浏览者的“通感”,以实现对用户情感的关照同时在交互界面中顺利引导用户使用网页所提供的功能。

参考文献:

[1]陈育德.灵心妙悟——艺术通感论[M].安徽教育出版,2005.

[2]麦克唐纳.什么是网页设计[M].译者:戴刚,译.中国青年出版社,2006:6.

[3].

[4]web.any.do/.

[5]喜力啤酒网站:.tw/welcome.aspx?send=http%3a%2f%.tw%2f.

[6]南苑茶社网站:/china/nanyuanchashe/.

[7].

[8]李砚祖.设计理论的文史哲[J].设计艺术.