美学原理在网页设计中的应用



《美学原理在网页设计中的应用》由会员分享,可在线阅读,更多相关《美学原理在网页设计中的应用(23页珍藏版)》请在文档大全上搜索。
1、美学原理在网页设计中的应用美学原理在网页设计中的应用唐一鹏(福建信息职业技术学院,福州350003)摘要当代网页设计师除了掌握相关的Web技术外,还应具备一定的艺术修养。这样才能做出美观而又实用的网页。笔者从美学原理的角度出发,探讨网页布局、导航及LOGO 的设计。关键词色彩;布局;导航;LOGO色彩的魅力是无限的。引言信息时代的快速到来, 网网页设计是一门新络也开始变得多姿多彩。因此色彩在网站设计中兴的边缘性的行业, 在网占据相当重要的地位。 设络产生以后应运而生。 当计者不仅要掌握基本的点击到网站时, 首先映入网站制作技术, 还需要掌眼帘的是该网页的界面握网站的风格、 配色等设设计,如内容
2、介绍、 按钮计艺术。摆放、文字组合、色彩应1.1 基本概念用等等。这一切既是网页自然界中色彩虽无以设计的范畴,也是网页设计数,但最基本的有三种计师的工作。好的网页布(红、黄、蓝),其它的局应该是把美学原理合色彩都可以由这三种色理地融入到技术中去, 为彩调和而成。我们称这三此,谈谈个人在这方面的种色彩为 “三原色”。认识。任何一种彩色具备一、认识色彩三个特征: 色相、色度和色纯。色相,指的是色彩的名称。这是色彩最基本的特(#0066cc) 与橙色征,是一种色彩区别于另(#ff9933 )等。一种色彩的最主要的因色纯,指色彩的鲜艳素。比如说紫色、绿色、程度,纯度高的色彩纯、黄色等等都代表了不同的色
3、相。同一色相的色鲜亮。纯度底的色彩暗彩,调整一下亮度, 或者淡,含灰色。纯度很容易搭配,比如,相近色:色环中三原深绿、暗绿、草绿、亮绿。色左右构成的相邻颜色,色度,指的是色彩的如绿与黄、 绿与蓝。相近明暗程度。明度越大,色色的搭配给人的视觉效彩越亮,比如一些购物、果很舒适,很自然。儿童类网站,用的是一些互补色:色环中相对鲜亮的颜色,让人感觉绚的两种色彩,如红与绿、丽多姿,生机勃勃;明度蓝与橙、紫与黄等。对于越低,颜色越暗,主要用互补色,调整补色的亮于一些游戏、探险类网度,一方加强、一方减弱,站,充满神秘感。有明度这是一种很好的搭配。差的色彩更容易调和。 如暖色:暖色跟黑色搭紫色 (#99339
4、9)与黄色配可以达到活泼、 温馨的(#ffff00 ),暗红效果。暖色一般应用于购(#cc3300)与草绿物类网站,电子商务网(#99cc00),暗蓝站,儿童类网站等等。3冷色:冷色一般跟白色象征高科技,稳重, 理色搭配可以达到严肃、 稳智;橙色代表了欢快,甜重、神秘的效果。冷色一美,收获;绿色代表了充般应用于一些高科技, 游满青春的活力,舒适, 希戏类网站。绿色,蓝色,望等。当然不是说某种色蓝紫色等都属于冷色系彩一定代表了什么含义,列。在特定的场合下, 同种色色彩均衡:意为每种彩可以代表不同的涵义。色彩所占的比例、面积、对一些明度较高的位置要合理。网站要让人 网站,配以黑色, 可以适看上去舒
5、适, 协调,除了 当地降低其明度。 白色是文字,图片等内容的合理 网站用的最普遍的一种排版,色彩的均衡也是相 颜色。很多网站甚至留出当重要的一个部分。大块的白色空间, 作为网1.2色彩的作用站的一个组成部分。 这就色彩在生活中是有是留白艺术。恰当的留白丰富的感情和涵义的。 比对于协调页面的均衡起如:红色让人联想到玫到相当大的作用。 当觉得瑰,联想到喜庆, 联想到 两种色彩的搭配不协调,兴奋;白色联想到纯洁, 试试加入黑色,或者灰干净,简洁;紫色象征着 色,会有意想不到的效女性化,高雅,浪漫;蓝 果。41.3确定网站主题色标题正文型、左右框架一个网站必须有一型、上下框架型、封面型、种或两种主题色
6、, 多则让 Flash 型、综合框架型等,人感觉轻浮、花俏;少则 下面分别论述:单调。当主题色确定以1. “国”字型:也可后,考虑其它配色时,一以称为“同”字型,常用定要考虑其它配色与主于大型网站,即最上面是题色的关系,要体现什么 网站的标题以及横幅广样的效果。 另外,哪种 告条,接下来就是网站的因素占主要地位,是明主要内容,左右分列一些度、纯度还是色相。一般两小条内容,中间是主要一个页面尽量不要超过4部分,最下面是网站的一种色彩。些基本信息、联系方式、版权声明等。这种结构是二、网页的布局我们在网上见的最多的一种结构类型。网页是网站构成的2. 拐角型:这种结构基本要素。网页布局的好 与上一种只
7、是形式上的坏直接影响到视觉效果。 区别,其实是很相近,上2.1网页布局类型面是标题及广告横幅, 接网页布局大致可分下来的左侧是一窄列链为“国”字型、拐角型、接等,右列是很宽的正5文,下面也是一些网站的架。辅助信息。在这种类型6. 综合框架型:上面中,一种很常见的类型是两种结构的结合, 相对复最上面是标题及广告, 左杂的一种框架结构, 较为侧是导航链接。常见的是类似于“拐角3. 标题正文型:即最 型”,只是采用了框架结上面是标题或类似的一构。些东西,下面是正文,常7. 封面型:这种类型见于一些文章页面或注基本上是出现在一些网册页面。站的首页,大部分为一些4. 左右框架型:这是 精美的平面设计结合
8、一一种左右为分别两页的 些小的动画,放上几个简框架结构,一般左面是导 单的链接或者仅是一个航链接,有时最上面会有 “进入”的链接甚至直接一个小的标题或标志, 右 在首页的图片上做链接面是正文。这种结构较多 而没有任何提示。 这种类出现在论坛中, 也常用于 型大部分出现在企业网企业网站。这种类型结构 站和个人主页, 如果处理比较清晰。得好,会给人带来赏心悦5. 上下框架型:与上 目的感觉。面类似,区别仅仅在于是8.Flash型:这种类一种上下分为两页的框型采用了目前非常流行6的 Flash ,页面内容随时 交友站点常运用菱形作间变化,所表达的信息更 为页面整体造型。丰富,具有较强的现代感目前的网
9、页制作多和视觉冲击力, 如果处理 数是结合多个图形加以得当,绝不差于传统的多 设计,在这其中某种图形媒体。的构图比例可能占的多在以上布局中, 对于一些。不同的形状,代表着不同2.2网页构成的元素意义。1. 页面尺寸比如:矩形代表着正页面尺寸和显示器式、规则,很多 ICP 和政大小及分辨率有关系, 网府网页都是以矩形为整页的局限性就在于无法体造型;圆形代表着柔突破显示器的范围, 浏览和、团结、温暖、安全等,器的工具栏也是影响页许多时尚站点喜欢以圆面尺寸的原因。 一般分辨形为页面整体造型; 三角率在 800x600 的情况下,形代表着力量、权威、牢页面的显示尺寸为: 780 X固、侵略等,许多大型