网页设计与制作·第2版
上QQ阅读APP看书,第一时间看更新

1.6 风格设计

1.6.1 网页设计构成要素

网页设计的风格、图形和内容形式千变万化,构成图形图像的最基本的造型元素是点、线、面。点、线、面的变化组合构成网页实际的多样化,是与别具一格的独特性相联系的。点、线、面的变化是网页设计活力的体现,也是创造形式美的基本要求,使网页设计具有不同审美倾向的特征。如果以不同图形或者单位来划分点、线、面,又是相对的。例如,一个圆形就是一个点,一排圆形就是一条线,几排、几十排甚至几百排的圆形就组成了一个面。

1. 点的构成

在网页设计中,运用点的属性可以创造出千变万化的点造型。点是造型的最基本要素,也是构成中最简洁的形态。点在线、面里相对来说是最小的单位,依托无数的点可以形成线和面。

在视觉形态中,点具有形状、方向和大小等属性。点的概念是相对的,是与周围的视觉元素相比较而言的。点一般表示为圆形,但也可以是三角形、方形或无规则图形。作为视觉上的点,随着面积的扩大,趋于面的感觉就越强。点具有视觉集中的属性,具有强烈的视觉吸引力。当这些点大小不同时,人们在视觉上首先注意大的点,然后逐渐向较小的点移动。随着点的增加,人们的注意力也会逐渐分散。点的数量多会有生动感,如果大小不同,就丰富了视觉节奏韵律,增加了美感。点的连续会产生节奏、韵律和方向,疏密的点阵会产生空间感。点的形状、方向、大小、位置、聚集、发散、层叠或交错,能够给人带来不同的心理感受。

单纯由点构成的网页较少见到,一般总是和其他元素配合使用。这种版面往往轻松随意、生动活泼,给人印象深刻,休闲、娱乐类网站使用较多。

2. 线的构成

线是由点的移动或连续排列构成的,或者说由两点连接而成,是不占面积的。用线能表现作品的感情和抽象意义,页面的工整感和速度感也是靠线性来表现的。线在空间中具有方向性和运动感。

线分为直线和曲线两种。直线分为垂直线、斜线和水平线;曲线分为几何曲线和自由曲线。线的粗细、长短、形状的变化,在不同的环境中有各自的意义。直线有坚硬、力量、速度的感觉;曲线常常体现柔软、流畅、温和的女性特征。以两种或两种以上不同大小、颜色、形状及方向的线作为设计元素,可使页面富有很强的表现力。可以运用反复、近似、渐变、对比、聚集或扩散等手法,将不同的线运用到页面设计中,以获得不同的效果。但要注意对比、协调的关系。

线是分割页面的主要元素之一,是决定页面风格的基本要素。根据各自线性的特征,可设计出风格不同的网页。

3. 面的构成

点的密集、线的运动排列产生了面。与点和线相比,面具有更强的视觉效果和表现力。面可分为几何形和自由形两类。方形、圆形和三角形都是几何形,多边形的面也常在网页中出现。几何形给人以简洁明快、有序理性的特征。

在视觉形态上,面通过大小、位置、形状和角度的变化,形成自己鲜明的个性和情感特征。设计时要注意把握不同形状的面之间的相互关系与整体和谐。

面的组合是灵活多样的,一个页面可能有叠加、重合、穿插的效果,根据视觉效果而定。可以用独立的面构成设计,也可以将各种类型的面结合起来,多做些新的尝试。

4. 混合的构成

点、线、面是视觉构成的基本元素,具有不同的情感特征,是最重要的表现手段。单纯地运用某个点、线、面,页面有可能单调、乏味,它们在图形图像中往往是共同作用的,这样才使页面更具有强烈的表现力。合理地平衡安排好点、线、面之间的关系,将点、线、面加以综合、灵活运用,一定能设计出丰富、充实、具有最佳视觉效果的页面。

1.6.2 网页设计的风格类型

网页设计作品实际上没有好坏之分,只有风格类型上的区别。

网页设计的目标就是为了突出站点的自身特点,以信息内容得到理想传达为前提。根据网站的主题内容,主页的设计首先要考虑风格形式的定位。目前,网页的应用范围日益扩大,几乎囊括了所有行业。归纳起来大体有几大类:新闻机构、政府机关、企业门户、科教文化、娱乐艺术、电子商务和网络中心等。不同性质的行业应体现出不同的主页风格类型。

网页设计的整体风格要靠图形图像、文字、色彩、版式和动画来表现。在不同的领域中,艺术创作的角度及方式是有区别的。从网页设计特殊属性的角度分析主页风格,大体可以分为平面风格、矢量风格、像素风格和三维风格。

在网页设计基础上,网页设计师的风格就是运用自己的手段,包括审美素质、应用软件的能力及感受生活的敏锐观察力,建立具有独特设计风格及艺术表现力的页面。

1. 平面风格

平面设计是二维的设计,平面风格始终是基于一个二维视图来工作的,侧重于构图、色彩及表达的思维主旨,往往给人以空灵、透气、爽快的感觉,这种构图形式可以在有限的页面中表现出无限的空间感。此种风格在网页设计里最常见且最实用,如门户与新闻类网站、商业与企业类网站、娱乐与游戏类网站、运动与休闲类网站、文化与教育类网站、生活与时尚类网站、兴趣爱好和个人网站等,平面风格已经渗透到以上各个类型的网站。

2. 矢量风格

矢量图使用直线和曲线来表述图形,这些图形的元素大多是一些点、线、矩形、多边形、圆和弧线等基础元素。它们都是通过数学公式计算获得的,所以文件体积一般较小。矢量图形最大的优点是无论放大、缩小或旋转都不会失真;最大的缺点是难以表现色彩层次丰富的逼真图像效果。

矢量图形插画是运用图案表现的形象,本着审美与实用相统一的原则,尽量使线条、形态清晰明快,块面感强,制作方便。矢量图形插画是世界上通用的设计语言,其设计在商业应用上通常分为人物、动物和商品形象等,也被越来越多地应用到广告设计中。由于具有夸张诙谐、极具个性魅力的装饰表现手法,目前在国内互联网上被运用得越来越多。

3. 像素风格

点阵图像是一种图标风格的图像,更强调清晰的轮廓及明快的色彩。几乎不用混叠方法来绘制光滑的线条,由许多不同颜色的点一个个巧妙地组合与排列在一起,构成一幅完整的图像,这些点称为像素(Pixel),图像称为Icon(图标)。像素风格型网站为互联网增添了独特、亮丽的风景线。

4. 三维风格

三维用于在顶视图、正视图、侧视图及透视图中创作并编辑物体,以一个具有长、宽、高3种度量的立体物质形态出现,这种形态可以表现在商品的外形上,也可以表现在商品的容器或其他地方。在网页设计中,三维风格的表现简单得多。三维空间的设计可借助于三维的造型手段,通过折叠、凹凸处理,使画面产生浮雕、立体等三维效果。三维构成以丰富厚重的内涵和深度,以及多层级、全方位的展现,给人以深厚、强烈的视觉印象。