第一章 网页艺术设计概论

一、网页设计的发展趋势

网络已经不断演进并成为现代社会不可缺少的一部分,尽管网页设计会以人们意想不到的方式发生变化,可是我们有理由相信,人们对网页的视觉追求永无止境,这正是推动网页设计向前发展的主要因素。从发展趋势来看,网页设计会更加注重网页的创意和个性化。

1、网页创意

网页设计中的创意主要体现在设计观念、设计方法、设计元素等方面。创意是通过形象转换、元素转换、空间转换等方法构造新的视觉形式,并由此产生不同的意境。

2、网页的图形

网页中的图形创意分抽象类和具象类两种。

抽象类图形是通过点、线、面等视觉元素在一定的版面空间范围内有间隔地反复组合形成图形。它以连续、渐变、大小、长短、明暗、高低等变化手法来构成。

同一视觉元素的反复出现,可构成视觉认知中虚实、强弱的对比,形成轻、重、缓、急的趋势,从而使人感觉到节奏的存在。

3、个性化网页

网页设计特别需要具有个性,不能忍受雷同。设计风格的形成不是偶然的,它是知识和智慧的必然结晶,也是设计本身的需要。设计风格的形成离不开设计元素、设计方法、设计个性。每一次设计的新“变化”都源于设计师对设计元素与设计方法的新发现或新理解。

网页个性化已成为当今网页设计的新标准。在网页设计中倡导网页设计风格,有利于网页的差异识别。

 

优秀主页具备的六个条件

满足6个条件就会给人留下好印象让人赏心悦目的优秀主页要具备6个条件。满足这些条件并不困难,任何人都能做到。具备了这些条件,就能做出令人满意的优秀主页。其中,4个是必要条什,2个是附加条件。

4个必要条件使人产生信赖感

以下4个条件是最基本的必要条件。虽然我们认为每一个条件都必不可少,但在实际应用中,所有条件都完备的主页是很少见的。然而在这4个条件中,缺少任何一个都会使访问者对网页的印象一落千丈,使得初次访问者不愿再次光临。

条件1明示标题

对于初次访问网站的读者来说,首要目的就是确认标题。那些晦涩难懂的标题会使难得光临的访问者感到不知所措。虽然我们以美观和与众不同为设计日标,但如果吸引不了访问者,这个网页的设计和建设也是没有意义的。过于个性化的表现,会使网站内容的公开性受到质疑。

条件2明示信息

让访问者第一眼就明了表达的内容的网页才是最优秀的。如果访问者对信息的种类、是趣味性的网页还是商业性的,以及行业类型等问题能够一目了然的话,他才能安心地继续访问,对网页的好感也会逐步增强。所以我们运用排版样式、图像、文字的造型以及配色类型等元素来准确传递信息。

条件4整理目录信息

对于网页来说,最重要的就是信息内容。信息的品质与数量决定了人们对这个网页的评价高低。但首先要做到的是,怎样将读者顺利地引向信息内容。明确划分信息群,不让读者产生迷惑,使之迅速找到所需要的信息,是目录设计最重要的任务。目录的整理决定了网页的可读性。

条件5传达信任感

4个必要条件之中,最难掌握的就是条件⑤。但如果我们站在访问者的立场上,就很容易理解它了。举个例子:如果配色强烈的航空公司主页上排列着许多模糊不清的百货公司的照片,它自然不会拥有许多观众。因为画面的造型性太低会使整个主页失去信任感。

2个附加条件增强效果

4个必要条件之外,还有2个附加条件。③表现欢迎态度:传达欢迎的心情,给人感觉良好。

⑥加强说服力:给访问者留下深刻、强烈的印象。加上这两个条件,就能设计出更有竞争力的网页,但请注意,这两个条件不是绝对的。

必要条件占优先地位

有时过于强调附加条件,反而使必要条件失去作用。例如,为了强化说服力而使用强烈的配色,虽然加深了印象,却削弱了标题和信息性,对条件①和条件②产生了负面作用。

 

第一部分 首页的三个构成空间

画面空间                空间的作用

1、标题空间              明示标题

(标题如同商店引人注目的招牌,要清楚,明确的表示出来,让访问者毫不犹豫、放心大胆的进入)

2、欢迎空间              明示信息、表现欢迎态度

(是被标题吸引进来的人在进入目录信息之前歇歇脚、休息一下的地方,相当于网页的玄关。在确认主页内容的同时,希望能够传达欢迎态度。)

3、目录信息空间          整理目录信息

(访问者希望能够总揽主页的全部信息,所以对大量信息的整理归纳、发掘共同点等为使网页更加引人入胜而下的工夫都是十分必要的。当然,最重要的是要让访问者感觉到这是你为他着想而做的整理。)

4、画面整体              传达信任感、加强说服力

检索型首页

这是典型的关于国际新闻的新闻检索型页面。刚劲有力的标题传达出强烈的可信度。

舒服的对称式

这是与上图相对的印象主体型主页。对目录信息进行控制的同时扩大欢迎空间,传递出欢乐和亲切的感觉。

 

I、标题空间(必要条件1明示标题)

标题就是商店的招牌和住宅的门牌。如同门牌的位置要固定一样,标题也有一定的位置。为了使初次访问者不会产生迷惑,它通常位于页面的上端或中央。写在哪、怎么写以及对题目本身的探讨暂且不论,为了使访问者安心,标题一定要清楚明确地表示出来。

1、标题应有的强度

与其他文字相比,标题的字号大一些、粗一点为宜。再加上鲜艳的色彩,标题就具有了适当的强度,画面整体的安定感也随之产生,访问者也能够放心查看了。

2、与网页风格相和谐的标题

优秀的设计使人第一眼就关注到标题。但是如果过度放大标题也是一种失败,应该选择与主页风格相和谐的字号、粗细及配色。

A、大小、粗细要与标题相称

1、              越大、越粗、越有力量

若要明确的表示标题,就要将标题文字放大、加粗,使其更醒目。在大小相同的情况下,加粗文字也能产生强化效果。作出几种大小、粗细不同的样例,看看哪一种文字最有吸引力,以找到完美的型号。

2、              检查一下标题字号是否太小

小巧的字体显得格凋高雅,所以在以创建高品位网站为目标的主页设计过程中,标题常常有缩小的倾向。字体缩小的程度是否合适,还需重新验证标题大小是否与最初的想法一致,再次确认不会使初次访问者产生困惑。

3、              大小合适是最重要的

标题对页面整体的平衡效果非常重要。无视周围内容而将标题一味放大,就会显得庸俗;页面周围空间全部用白色填充的话,就会给人一种信息量少的印象;在希望突出格调的页面上,字型过大,就会显得过于活跃而内敛不足。所以应该选择与页面风格最相匹配的字号。即使是同样大小的字,粗细的变化也会在很大程度上改变印象。

B、通过高色价明示标题

1、  鲜艳的色彩能够强化标题

需要强化标题的时候,鲜艳的色彩不可或缺。同样大小、粗细的文字,若换成鲜艳的颜色,强度马上就会增加。当基于特定风格的要求而不得不将文字缩小时,鲜艳的彩色能够有效的保持文字的强度,使标题得到强化,效果清晰,引人注目。

2、  强调主体性

将标题加上鲜艳的颜色,视线就会集中在那里。正如舞台上突出主角能够使观众感到安心一样,将标题作为主体进行适当的强化,能够保持页面的稳定感;反之,如果辅助部分,如按钮或下划线的颜色过于鲜艳,以至强过标题部分,就会使整体画面显的松散混乱。

3、  所谓高色阶,是指鲜艳和耀眼的颜色

色彩越鲜艳、纯度越高,色阶就越高。相对的,与白色及黑色越接近.纯度越低.色阶也越低。另一方面,如果几种低纯度颜色之间的对比较强烈,色阶也会提高。例如黑和白的组合,虽然两方纯度都为0,但由于明度差最大,色阶也高。

C、通过宽阔的领地衬托标题

1、  宽阔的领地起到强化标题的作用

标题周围如果有大面积空白,标题的印象就会显得更加强烈。将文字和图像等视觉要素从标题周围移开,代之以空白,这块地方就叫做标题的领地。在标题的大小和配色都不变的情况下,仅仅通过扩展领地,也能达到强化标题印象的作用。

2、  通过扩展领地来强化弱效的标题

标题的领地是指将标题周围的图像和文字移远而得到的空白部分。空白的部分为标题的支配空间,也就是我们所说的领地。领地越广阔,标题越醒目,主体性也就越强。

表现都市、女性形象时,不便于使用效果强烈和色彩鲜艳的文字,这个时候就要开拓足够的领地,使小而弱的标题文字也能具有强烈且醒目的效果。用广阔的领地传递优雅风格的同时,小字也与标题相搭配。

II、欢迎空间

必要条件2明示信息

标题与目录信息之间的部分是欢迎空间。这个空间是访问者被标题吸引进来后,看到目录信息前喘口气的休息场所。以餐厅为例,这里就是客人开门进来之后、被带到餐桌之前等候的地方。

欢迎空间的两个作用:

1、标明信息

进入欢迎空间的人,会查明这里是否有与标题相同的信息。访问者会在欢迎空间再次确认自己先前从标题中得到的主页的大体印象。如果与预想的相反,访问者就会变得不安而急于返回了。欢迎空间是再次确认信息和获得安心感的地方。

2、表达欢迎的态度

欢迎空间是在信息再确认的同时,进入目录信息前,能够得到放松的地方。这里应该是欢迎访问者,使他们感觉良好、心情愉快的地方。表达欢迎的方法多种多样,选择一个与主页特性相符的类型是最重要的。另一方面,在以检索为主体的页面中,有限度的表现欢迎是较为合适的。

A、利用排版样式传递信息

1、              排版样式是不说话的口信

即使图像与信息内容完全相同,排版样式的改变也会创造出两个完全不同的主页。如下图,版式采取对称型或是检索型所传递出来的信息是完全不同的:采用对称样式进行排版,页面格调高雅;采用检索型的左右对齐样式则给人带来信息丰富、热门的印象。版式对主页的影响不同于图片或标语,它的效果是平静的,安稳的,但不知不觉中准确的传递了信息。

2、              慎重选择排版样式

如果选择了与主页形象大相径庭的版式,那么有可能在一瞬间失去访问者。例如,本页中的三组图样是两两内容相同的主页,但是产生的印象却是截然不同的。这个差别就是排版样式的作用。当希望得到更多信息的人看到左图时,恐怕要失望而回了;而想见到轻松画面的人看到右图,也会希望落空。无论多么优秀的内容,若选错了版式,都会使整体努力落空。

B、利用图片传递信息

1、              图片具有强烈的信息性

能在一瞬间让人了解访问的主页是否与印象相同的就是图片。而其中又以能直接表现标题或主页信息的插图和照片最有说服力,它能够使访问者直接确认信息。传递信息的视觉要素包括文字、色彩、形状和版式等等。其中图像的作用是决定性的。在打开主页一瞬间,图像几乎与标题文字同时映入眼帘,观众对主页的印象也就被确定下来。

2、看图的一瞬间,信息就被确定下来

寻找最合适的主题:下面介绍的cat world的照片,单看起来猫的照片效果很一般,但是当它被放在画面中心的时候,就不可思议的变得栩栩如生,光彩照人,这就是标题与内容的互动造成的效果。如果选择了与标题相配的主题,整个主页就生动起来。