网页制作与设计教程第二章.ppt
第2章 网页文件的规划与创意,本章探讨在制作网页之前,我们如何进行网页文件的规划与创意。为了提高网页的视觉吸引力,有效地传达信息,给人以审美感受,网页文件的创意非常重要。只有做好网页文件的规划与创意,才能很好地组织起丰富的网页素材以实现网页设计的目标。,教学重点与难点,网页文件的规划网页的创意设计网页的制作技巧,2.1 网页文件的规划,一、网页文件的种类(1)公司、单位信息发布(2)出版物,即电子报刊(3)个人主页(4)在线购物站点(5)专题介绍(6)实用信息服务,二、网页文件的规划 网页文件的规划也就是网页文件的内容组织和结构设计。合理的结构设计对于网页文件的规划是至关重要的。(1)分级结构(2)线性结构(3)Web结构,三、网页文件的设计原则1 总体设计2主题鲜明、结构合理3组织网页4设计首页的考虑 首页(Homepage)作为网页文件的第一页,在整个网页文件中具有举足轻重的作用。5网页设计的标准,2.2 网页的创意设计,网页的创意设计一般应遵循以下两个原则:(1)依据信息内容的意义和结构进行情节化、理性化的统调布局和必要的图像符号化处理。(2)网页的创意设计还必须重视“形象思维”的情感象征意义的传达,以有别于知识性思考形式审美结构的营造。,一、网页创意设计的意义、功能和目的 网页创意设计是否成功,除了其内容因素外,首先要看其在视觉上能否引人注目。网页的创意设计包括文字排列方向、字群聚散组合,字体大小风格的选择,图片的分布及色彩与空白的经营,不仅追求网页形式的变化,更重视各视觉元素的不同形式和构成能给人在感情上造成不同的心理感受,并体现不同的主题。,二、网页创意设计的构成要素及其作用1标题 标题是表达信息主题的短句,标题有主标题与子标题之分。2标语 标语是具有韵味的意义完整的句子。3正文4网页名称5标志,6插图 将所传达的信息内容赋以视觉化的造型称为插图。7图标8背景9动画 动画不仅能增添网页的视觉趣味效果,同时,也可以用来进一步突出网页和信息内容的主题和风格。,三、网页创意设计的原理和准则 进行网页的创意设计时,应遵循以下几条构成原则:(1)内容与形式表现必须统一和有序,形式表现必须服从内容要求,在造型上各构成要素规格化的设计样式要统一。(2)必须考虑网页上各构成要素之间的视觉流程,能自然而有序地达到信息诉求重点的位置,突出主题。,(3)注意保护网页在视觉上的相对均衡感,不论是正常的均衡或是异常的均衡,均应有相应的均衡和律动感,使其在网页上得到正确的配置,否则会失去必要的安定感。(4)突出主题要素。(5)注意网页设计中的空白处理。(6)注重整体的对比因素。(7)在视觉上着力强调网页的诉求重点。,(8)注意提高网页信息内容的视读性。(9)创造一定的韵律感。它反映在网页设计中利用有力的线条、形体及色彩形成一种有节奏性的律动感,能引导人的视觉以一种流畅而有停顿的方式运动。既有视觉的连续性又有间歇性,使人能够抑扬起落地浏览整个网页,阅读时感到轻松而又富于韵味。,四、网页创意设计的形式法则和表现手法1视觉流程2点、线、面3形状间的组合和构成关系4形状与空间关系5构架与空间6节奏与韵律7对比,调和与统一8装饰与趣味9特异,2.3 网页的创作步骤,一、网页的准备1确定主题与设计风格 每一类网页都有其特定的目的和独特的风格。2资料的收集与整理 网页中最常见的问题是不能有足够的素材来体现制作者的理念。,二、网页的制作 网页的制作分为六个部分:1标题2文字3图片4背景5特殊效果6网页排版,2.4 网页制作基础,一、设计前的考虑因素1总体规划2网站主题3用户优先 最高的行动准则就是“用户优先”。没有用户去光顾,任何主页都没有意义。4响应时间5内容第一,二、设计过程的考虑因素1主页的特征2主页设计元素3代表性的页面4分类 5交互性6链接7长文件处理8避免滥用技术9及时地维护与更新,2.5 网页制作常用工具简介,1.FrontPage 20002.Dreamweaver3.Flash4.其他工具和设计技术 包括:Fireworks、Photoshop等处理图象的软件,以及HTML、JavaScript、VBScript、ASP、CSS、PHP和XML等语言环境和设计技术,