网站美工设计基础第4章解析.ppt

网站美工设计基础 本章侧重介绍版式设计的基本要素、类型及形式法则；了解网页的界面空间；掌握网页的版式构成与设计；培养学习者对优秀网页版式分析和模仿能力。在完成基础知识教学的同时，着重提高学习者对网页版式设计的认识和理解，加强对学习者实际动手能力的培养，使之最终能设计出优秀网页。 掌握：网页版式的基本类型和网页内容的编辑。 理解：版式设计的形式法则。 了解：版式设计的基本要素、网页的界面空间。 文字、图形和色彩是版式设计中最基本的视觉要素。它们有着各自不同的功能和作用。文字是非常有效的传送信息的方式，具有很强的说服力，而图片和色彩可以使设计更加美观、更具吸引力，可以更直观、生动地将信息表达出来。 在设计的不同类型中，文字、图片和色彩这三大要素的表达方式各有不同，因此，设计者在处理版面时，必须掌握各要素的特征，以便于更有效、更合理地表现与传达主题思想和设计意图。 1. 文字 文字是版式设计中的重要构成部分。它不仅是语言信息的载体，也是具有视觉识别特征的符号系统，更是一种高尚的艺术表现形式。文字的作用已提升到启迪性和宣传性、引领人们的审美时尚的新视角。 文字是版面的核心，也是视觉传达最直接的方式，运用经过精心处理的文字材料，完全可以制作出效果很好的版面，而不需要任何图形。因此，文字设计是增强视觉传达效果，提高作品诉求力，赋予版式审美价值的一种重要构成技术。 （1）字体和字号 字体是文字最基本的元素，字体的设计、选用是版式构成的基础。在版式设计中，字体首先作为造型元素而出现，在运用中不同字体造型具有不同的独立品格，给予人不同的视觉感受和比较直接的视觉诉求力。中文常用的字体主要有宋体、仿宋体、黑体和楷书4种。 字号是区分文字规格大小的名称，字号大小可以用不同的方式来计算，例如点数也称磅（point）或像素（pixel）。现在电脑排版系统的字号多数以点数来计算的。1点为0.35mm，现代版式设计的正文用字一般在5～7点，书籍上正文用的比较多的是五号字，为10.5点，3.69mm。字号的大小直接影响到阅读效果和版面美观，因此要根据内容和阅读对象来确定字号的大小。 （2）字距与行距 字距与行距的变化也会对文本的可读性产生很大影响，是设计师设计品位的直接体现。一般情况下，接近字体尺寸的行距设置比较适合正文。行距的常规比例为10：12，即用字10点，则行距12点。适当的行距会形成一条明显的水平空白带，以引导浏览者的目光，而行距过宽会使一行文字失去较好的延续性。 除了对于可读性的影响，字距和行距本身也是具有很强表现力的设计语言，为了加强版式的装饰效果，可以有意识地加宽或缩窄字距和行距，体现独特的审美情趣。例如，加宽行距可以体现轻松、舒展的情绪，应用于娱乐性、抒情性的内容恰如其分。另外，通过精心安排，使宽、窄行距并存，可增强版面的空间层次与弹性，表现出独到的匠心。因此，字距和行距不是绝对的，应根据实际情况而定。 2. 图形 版式设计中图形元素同样有着十分重要的作用。一方面，图形的应用使版面更加美观、有趣；另一方面，图形本身也是传达信息的重要手段之一。与文字相比，它直观、生动，可以很容易地把那些文字无法表达的信息表达出来，易于浏览者理解和接受，具有视觉效果和导读效果。 图形元素的表现形式可分为两大类：一类是以摄影、写实手法为主，称为“图片”；另一类是以手绘、电脑绘制为主，称为“图形”。 图片可以使版面立体、真实。它能具体而直接地把设计中的意念表现出来，使本来平淡的事物变成强而有力的诉求性画面，极具感染力和说服力，容易引起读者共鸣。如图4-1和4-2所示。 图形以其独特的想象力、创造力及超现实的自由构造，在版式设计中展示着独特的视觉魅力。如图4-3所示。 3. 色彩 色彩为版式设计增添了许多魅力，色彩既有美化作用又具实用的功能，更能够随意变化。同时，彩色比单一色调更让人印象深刻且容易记忆。文字与色彩的整合更加深了视觉的传播效果，字型及字的格调气氛也可以透过色彩来改变。色彩能起到画龙点睛和锦上添花的作用，但运用不当也会破坏版面的整体效果。因此，如何运用好色彩也是版式设计要解决的主要问题。 在所有的视觉要素中，就艺术和设计而言，色彩最能影响情绪。在设计中，设计师不能单凭主观喜好，而一定要从主题内容出发并以读者为主体，例如心理、喜好、年龄、性别等等因素，这些都是作出准确定位的依据。图4-4示意不同色调可以体现不同的主题。 点、线、面是一切造型的基础，也是版式构成的主要语言。不管版面的内容与形式如何复杂，最终都可以简化到点、线、面上来。在平面设计师眼里，一切形象都可以归纳为点、线、面，一个字母、一个数字、一个页码数等都可以理解为一个点；一行