网页设计流程分析与实例概论.ppt

;前言;第一章 分析与策划;实例分析;我们的实例这次是针对中国著名风景区——九寨沟，来作一个风 景/旅游 类的网站，首先我们要分析行业特色： ;首先，对我们将要在首页展示的模块进行列举 ;由于是旅游类网站，所以我们加入在线咨询和订购电子周刊版块。 内容区域我们根据要求分为五部分 A：欢迎词 B：图片新闻 C：行业新闻 D：资格认证 E：特色景区直通车 ;然后，我们对LOGO以及资料图片进行分析，来确定整体风格，这包括 主体色调和版式。 ;很明显，这样一张貌不惊人的图片是不可能胜任表现网站主题和凸显宏 大又清新的九寨沟风光的，所以我们要处理一下。在处理之前我们要考虑它占用的幅面，由于要宏大，所以我决定以此来做背景。那么我们就需要将图片和后半部分的背景色和谐的衔接。;主页中将要扮演重要角色的大图片既然决定了，而且行业色我们 也知道了，那么就出个配色小样吧。;首先我们要考虑刚才已经分类完毕的首页模块。我们发现数量并不庞大，占用的空间不必太大。当然，此类非购物网站也不宜分屏太多。 然后我们分析就版式而言，哪些版式合适，哪些相对不合适。;网页设计中的版式;满版型 页面以图像充满整版。主要以图像为诉求点，也可将部分文字压置于图像之上。视觉传达效果直观而强烈。满版型给人以舒展、大方的感觉。随着宽带的普及，这种版式在网页设计中的运用越来越多。;分割型 把整个页面分成上下或左右两部分，分别安排图片和文案。两个部分形成对比：有图片的部分感性而具活力，文案部分则理性而平静。可以调整图片和文案所占的面积，来调节对比的强弱。;中轴型 沿浏览器窗口的中轴将图片或文字作水平或垂直方向的排列。水平排列的页面给人稳定、平静、含蓄的感觉。垂直排列的页面给人以舒畅的感觉。;曲线型 图片、文字在页面上作曲线的分割或编排构成，产生韵律与节奏;倾斜型 页面主题形象或多幅图片、文字作倾斜编排，形成不稳定感或强烈的动感，引人注目。;对称型 对称的页面给人稳定、严谨、庄重、理性的感受。 对称分为绝对对称和相对对称。一般??用相对对称的手法，以避免呆板。左右对称的页面版式比较常见。 四角型也是对称型的一种，是在页面四角安排相应的视觉元素。四个角是页面的边界点，重要性不可低估。在四个角安排的任何内容都能产生安定感。控制好页面的四个角，也就控制了页面的空间。越是凌乱的页面，越要注意对四个角的控制。;焦点型 焦点型的网页版式通过对视线的诱导，使页面具有强烈的视觉效果。焦点型分三种情况。 （1）中心。以对比强烈的图片或文字置于页面的视觉中心。 （2）向心。视觉元素引导浏览者视线向页面中心聚拢，就形成了一个向心的版式。向心版式是集中的、稳定的，是一种传统的手法。 （3）离心。视觉元素引导浏览者视线向外辐射，则形成一个离心的网页版式。离心版式是外向的、活泼的，更具现代感，运用时应注意避免凌乱。;三角型 网页各视觉元素呈三角形排列。正三角形（金字塔型）最具稳定性，倒三角形则产生动感。侧三角形构成一种均衡版式，既安定又有动感。;自由型 自由型的页面具有活泼、轻快的风格。;了解了所有的版式特性，我们也分析了他们的适用范围，那么，决定我 们的版式吧。;接下来，就开始画草图吧。;THE END