网页版式设计2.pptVIP

版式设计1　版式设计概述　　版式设计是现代设计艺术的重要组成部分，是视觉传达的重要手段，表面上看，它是一种关于编排的学问；实际上，它不仅是一种技能，更是技术与艺术的高度统一。版式设计是现代设计家必须具备艺术修养和技术知识。 1.1　版式设计的定义　　 版式[format] －指书刊等的版面格式　　 版面－（报刊、书籍的一）整页　　 所谓版式设计，就是在版面上，将有限的视觉元素进行有机的排列组合。　　 将理性思维，个性化地表现出来；一种具有个人风格和艺术特色的视觉传送方式。 传达信息，同时，也产生感官上的美感。　　 版式设计的范围，涉及到报纸、刊物、书籍（画册）、产品样本、挂历、招贴画、唱片封套和网页页面等平面设计各个领域。　　 1.2　版式设计的原则　　让观看者在享受美感的同时，接受作者想要传达的信息。　　1、主题鲜明突出　　版式设计的最终目的是使版面产生清晰的条理性，用悦目的组织来更好地突出主题，达到最佳诉求效果。　　按照主从关系的顺序，使放大的主体形象视觉中心，以此表达主题思想。　　将文案中的多种信息作整体编排设计，有助于主体形象的建立。　　在主体形象四周增加空白量，使被强调的主体形象更加鲜明突出。　　2、形式与内容统一　　版式设计的前提－版式所追求的完美形式必须符合主题的思想内容。　　通过完美、新颖的形式，来表达主题。　　没有文字的版面，最难设计。　　 2　版式的基本类型　　 骨格型、满版型、上下分割型、左右分割型、中轴型、曲线型、倾斜型、对称型、重心型、三角型、并置型、自由型和四角型等13种。 2.1　骨格型　　 规范的、理性的分割方法。　　 常见的骨格有－竖向通栏、双栏、三栏和四栏等。一般以竖向分栏为多。　　 图片和文字的编排上，严格按照骨格比例进行编排配置，给人以严谨、和谐、理性的美。　　 骨格经过相互混合后的版式，既理性有条理，又活泼而具有弹性。 2.2　满版型　　 版面以图像充满整版，主要以图像为诉示，视觉传达直观而强烈。文字配置压置在上下、左右或中部（边部和中心）的图像上。　　 满版型，给人大方、舒展的感觉。是商品广告常用的形式。 优秀网页设计的共同特点近期惹人喜欢的网站都有下面的特征： ? ·布局简单 ·中心定位 ·3D效果 ·柔和,自然的背景色 ·颜色鲜亮（要谨慎使用） ·可爱的图标（也要谨慎使用） ·有许多留白 ·大字体 …………………………………………….. 细体字高雅细致， 有女性特点，更适合服装、 化妆品、食品等行业的内容 行距的变化也会对文本的可读性产生很大影响。一般情况下，接近字体尺寸的行距设置比较适合正文。行距的常规比例为10:12，即用字10点，则行距12点。这主要是出于以下考虑:适当的行距会形成一条明显的水平空白带，以引导浏览者的目光，而行距过宽会使一行文字失去较好的延续性。 怎么样做好网页版式设计？ 1.骨骼型 网页版式的骨骼型是一种规范的、理性的分割方法，类似于报刊的版式。常见的骨骼有竖向通栏、双栏、三栏、四栏和横向的通栏、双栏、三栏和四栏等。一般以竖向分栏为多。这种版式给人以和谐、理性的美。几种分栏方式结合使用，既理性、条理，又活泼而富有弹性。 此类网站均属门户、新闻媒体类网站所采用。如TNT.com。 4.中轴型 沿浏览器窗口的中轴将图片或文字作水平或垂直方向的排列。水平排列的页面给人稳定、平静、含蓄的感觉。垂直排列的页面给人以舒畅的感觉。 此类网站版式为各类网站所采用。如ALFA ROMEO。 5.曲线型 图片、文字在页面上作曲线的分割或编排构成，产生韵律与节奏。 此类网站版式为各类网站所采用。如POISE。 6.倾斜型 页面主题形象或多幅图片、文字作倾斜编排，形成不稳定感或强烈的动感，引人注目。 此类网站版式为各类网站所采用。如BIOTHERM。 7.对称型 对称的页面给人稳定、严谨、庄重、理性的感受。对称分为绝对对称和相对对称。一般采用相对对称的手法，以避免呆板。左右对称的页面版式比较常见。四角型也是对称型的一种，是在页面四角安排相应的视觉元素。四个角是页面的边界点，重要性不可低估。在四个角安排的任何内容都能产生安定感。控制好页面的四个角，也就控制了页面的空间。越是凌乱的页面，越要注意对四个角的控制。 此类网站版式为各类网站所采用。如PEDRPPER。 8.焦点型 焦点型的网页版式通过对视线的诱导，使页面具有强烈的视觉效果。焦点型分三种情况。（1）中心　以对比强烈的图片或文字置于页面的视觉中心。（2）向心　视觉元素引导浏览者视线向页面中心聚拢，就形成了一个向心的版式。向心版式是集中的、稳定的，是一种传统的手法。（3）离心　视觉元素引导浏览者视线向外辐射，则形成一个离心的网页版式。离心版式是外向的、活泼的，更具现代感，运