第12章 web设计原则.ppt

框架布局技术 框架由于不能进行精确的元素定位，因此不能独立完成页面的布局，它常常和表格配合使用，先用框架将页面划分为几个区域，然后再用表格实现各区域的精确局部，其常常用在网站系统的后台页面设计中。 12.4内容设计 对于网页来说，最重要的就是信息内容。信息的品质与数量决定了人们对这个网页的评价高低。一般而言，内容通常有两种表现类型：文本和多媒体。 12.4.1文本 文字的格式化 文字的格式化包括字号、字体、字间距、行距等。 字号的大小可以用不同的方式表达，例如磅(Point)或像素(Pixel)。 字体可以被网页设计者用来更充分地体现设计中要表达的情感。 行距就是在两行文字之间间隔距离的大小，是从一行文字基线到另一行文字基线之间的距离。行距本身也是具有强表现力的设计语言。 12.4.1文本 文字的强调 文字的强调一般是对网站内容信息的一个加强手法。通常有以下几种 行首的强调 引文的强调 个别文字的强调 文字的颜色 文字的颜色 在网页设计中，颜色的运用可以强调文字中特别的部分，还可以对整个文字内容的情感表达产生影响。 12.4.2多媒体 图片格式 GIF格式 JPG格式 PNG格式 图片使用原则 要尽可能保证下载速度 在网页中所采用的每一张图片最好加入Width、Height这两个属性，这样会网页数据下载过程更顺畅。 尽量将网站内容进行分类管理，尽量细化管理 将这些大的图片分割一下 网页底图要简单明快 12.4.3内容排版 排版并仅仅做到整齐就足够，还要有明确的分类，以及主题的适当规划。排版包括表格、框架的应用、文字缩排、段落等等。 两端均齐 居中排列 左对齐或右对齐 绕图排列 12.4.3内容排版 在对内容进行排版上，需要注意以下几个问题： 把关联项在视觉上进行分组 创建视觉层次 容易查找和阅读的布局 利用三分法，确定表现重点位置。 12.5色彩设计 色彩是网站最重要的一个部分，色彩能够呈现设计意图、表达个性、对内容进行区分、布局和强调，一个网站设计成功与否，在某种程度上取决于设计者对色彩的运用和搭配。 12.5.1色彩基础 色彩 在电脑显示屏的颜色显示中，RGB是表示红色绿色蓝色又称为三原色光，英文为R(Red)、G(Green)、B(Blue)。这三种颜色的数值都是255。在RGB模式下，每种RGB成分都可使用从0（黑色）到255（白色）的值。例如，亮红色使用数值(R:255, G:0, B:0)，其十六进制表示是(FF0000)。 在色彩中，任何一个色彩都有它特定的色相、明度、纯度，他们被称为色彩的三要素。 色彩的心理感觉 从人对色彩的感觉来分，色彩可以分为冷色、暖色两大类。 冷色系给人以寒冷的感觉，如蓝色。 暖色系给人以温暖的感觉。如橙色。 12.5.1色彩基础 色彩的搭配 近似色的配置 同种色的配置 差异色的配置 对比色的配置 分离配色的配置 色彩面积分布的配置。 12.5.2网页中的色彩设计 网页中的色彩包括网页的底色、文字字型、图片的色系、颜色等。不同的色系体现不同的风格，比如政府网站，其首页的风格应当是沉稳、简明、大方，因此宜于一两种基色的搭配为主色来显示内容信息。同时为了防止由于主色构成相对单一而造成的色彩过淡，还可通过对比鲜明的色彩来强化人们的视觉。 利用色彩确定网站基调 利用色彩划分版面布局 利用色彩进行强调和引导 人有了知识，就会具备各种分析能力， 明辨是非的能力。 所以我们要勤恳读书，广泛阅读， 古人说“书中自有黄金屋。 ”通过阅读科技书籍，我们能丰富知识， 培养逻辑思维能力； 通过阅读文学作品，我们能提高文学鉴赏水平， 培养文学情趣； 通过阅读报刊，我们能增长见识，扩大自己的知识面。 有许多书籍还能培养我们的道德情操， 给我们巨大的精神力量， 鼓舞我们前进。 * Company name 网页设计与开发 第12章 Web 设计基础 清华大学出版社 主要内容 Web设计原则 网站结构规划 网页布局 内容设计 色彩设计 12.1 Web设计原则 Web设计师需要研究如何布局、处理字体和颜色以及空白的应用。 Web站点所要实现的目标是设计的最终方向，而页面的制作仅仅是设计的具体实现。 Web站点的设计并不是通常认为的网页制作，而是一个融合了多种设计原则和设计过程的系统工程。 12.1.1明确站点类型 新闻资讯类站点，如新浪，搜狐等大型门户网站 12.1.1明确站点类型 一些资讯和形象相结合的网站，如政府网等 12.1.1明确站点类型 形象类网站，比如商业企业的对外宣传网站 12.1.1明确站点类型 除了上述网站类型外，还有一些网站具有更多的专业化设计。例如，瑞丽女性网