Photoshop CS3 (8).ppt

《Photoshop CS3 (8).ppt》由会员分享，可在线阅读，更多相关《Photoshop CS3 (8).ppt（11页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、第第9 9章综合实例章综合实例第第9 9章综合实例章综合实例学习目标 切片工具 存储为Web所用格式 网页制作基本知识 网页组成的要素 网页版面设计 创建 Web 照片画廊 第第9 9章综合实例章综合实例切片是图像的一块矩形区域，可用于在产生的 Web 页中创建链接、翻转和动画。通过将图像划分成切片，可以更好地对其功能进行控制，并改善图像文件大小的优化。1.切片类型 按照其内容类型或创建方式分类，主要有以下几种：用户切片使用切片工具创建的切片。基于图层的切片基于图层的内容创建的切片，基于图层的切片是用“图层”控制面板创建的。自动切片用户切片或基于图层的切片未定义的空间自动填充的切片。在创建新的

2、用户切片或基于图层的切片时，其余区域将会自动生成切片。每次添加或编辑用户切片或基于图层的切片时都重新生成自动切片。可以将自动切片转换为用户切片。切 片第第9 9章综合实例章综合实例选择菜单命令“文件存储为 Web 所用格式”，弹出“存储为 Web 所用格式”对话框，使用“存储为 Web 所用格式”对话框可选择优化选项并预览经过优化的图片。设置完成后单击“存储”按钮，弹出“将优化效果存储为”对话框，在对话框中的“保存类型”选项中，有以下三个选项：HTML和图像 生成一个 HTML 文件和对应于图片中每个切片的图像文件。HTML文件包括文档中任何链接、图像映射和其他效果的代码。所有切片的图像文件存

3、放在自动创建的images文件夹中。仅限图像 以指定的优化设置存储图片。如果图片包含多个切片，则每个切片将存储为一个单独的文件。仅限 HTML 生成 HTML 文件但不存储任何图像文件。存储为Web所用格式图像调整命令第第9 9章综合实例章综合实例1.首页首页首页是指一个网站的主索引页，是了解网站概貌并引导查阅重点内容的向导。一般默认文件名为：index.htm或index.html等。2.页面尺寸页面尺寸和显示器大小及分辨率有关系，页面标准为800*600分辨率，按778*434像素制作，页面标准1024*768分辨率，按1003x600 像素制作。页面长度原则上不超过3屏，宽度不超过1屏。

4、3.BannerBanner叫旗帜广告或横幅广告，还有多种称呼，如全幅广告、条幅广告等。通常采用图片、动画、Flash等方式来制作。一般放在网页的上方，以吸引访问者浏览和点击，也可以放置在网页上的不同位置，在用户浏览网页信息的同时，吸引用户对于广告信息的关注。4.网站的标准色彩网站的标准色彩标准色彩是指能体现网站形象和延伸内涵的色彩。一个网站的标准色彩一般不超过3种。标准色彩要用于网站的标志，标题，主菜单和主色块。给人以整体统一的感觉。网页制作基本知识 第第9 9章综合实例章综合实例1标题标题标题用来提示页面的主要内容，这一信息将出现在浏览器的标题栏中，它的作用就是引导访问者清楚地浏览网站的各

5、项内容。2标志（标志（Logo）网站的标志（Logo），就是站点的标志图案，一般会出现在站点的每一个页面上，是网站给人的第一印象。这如同一个产品的商标，集中体现了该网站的特色、内容及其内在的文化内涵和理念，标志的作用最重要的就是表达网站的理念、便于人们识别，广泛用于站点的连接、宣传等。目前网站的标志有三种规格：88*31、120*60、120*90。网站标志的设计(Logo)最简单的方式可以用网站的英文名称作标志，采用不同的字体或字母的变形和字母的组合制作标志。可以是网站有代表性的人物、动物、花草等，以此作为设计的蓝本，再进行卡通化或艺术；也可以是用有代表的物品作为标志。网页组成的要素 第第9

6、 9章综合实例章综合实例3页眉页眉页眉指的是页面上端的部分，大多数网站在页眉位置设置网站宗旨、宣传口号、广告语等。4页脚页脚页脚是页面底端部分，通常用来显示站点所属公司（社团）的名称、地址、版权信息、电子信箱的超连接等。5导航导航导航是网页设计中的重要部分。一般网站的导航位置在每个页面中出现的位置是固定的。导航一般有四种位置：左侧、右侧、顶部和底部。有的站点为了增加页面的可访问性，运用了多种导航。6主体内容主体内容主体内容是页面设计的主体元素。它一般是二级连接内容的标题，或者是内容提要，或者是内容的部分摘录。表现手法一般是文字和图像相结合。它的布局通常按内容的分类进行分栏安排。页面的注意力值一

7、般是按照从上到下、从左到右的顺序排列，所以重要的内容一般安排在页面的做上位置，次要的内容安排在右下方。网页组成的要素 第第9 9章综合实例章综合实例选择菜单“文件自动Web 照片画廊”命令，可以依据一组图像自动生成 Web 照片画廊。Web 照片画廊是一个 Web 站点，它包含一个缩览图图像的主页和若干包含源图像的画廊页。每页都包含链接，当访问者单击主页上的缩览图图像时，就会链接到对应的源图像的画廊页。创建 Web 照片画廊 第第9 9章综合实例章综合实例平面设计的元素1概念元素概念元素 概念元素是那些实际不存在的，不可见的，但人们的意识又能感觉到的东西。例如，我们看到尖角的图形，感到上面有点

8、，物体的轮廓上有边缘线。概念元素包括点、线、面。2视觉元素视觉元素 概念元素不在实际的设计中加以体现，它将是没有意义的。概念元素通常是通过视觉元素体现的，视觉元素包括图形的大小、形状、色彩等。3关系元素关系元素 视觉元素在画面上如何组织、排列，是由关系元素决定的，包括方向、位置、空间、重心等。4实用元素实用元素 实用元素指设计所表达的含义、内容、设计的目的及功能。第第9 9章综合实例章综合实例平面构成的形式1组形组形 基本形状之间的组合，可以有分离、接触、复叠、透叠、结合、减却、差叠和重合8种形式。2渐变渐变 渐变是一种视觉效果，如近大远小、近疏远密等。渐变有形状的渐变、方向的渐变、位置的渐变

9、、大小的渐变、色彩的渐变等。3重复重复 重复是指在同一设计中，相同的形象出现过两次以上，造成有规律的节奏感，使画面统一。重复的类型有形状重复、大小重复、色彩重复、肌理重复、方向重复等。4发射发射 发射是一种常见的自然现象，如太阳光芒。发射具有方向的规律性，发射中心为最重要的视觉焦点，所有的形象均向中心集中，或由中心散开，有强烈的视觉效果。发射的分类有中心点发射、螺旋式发射和同心式发射。第第9 9章综合实例章综合实例平面构成的形式5近似近似 近似指的是在形状、大小、色彩、肌理等方面有着共同特征，它表现了在统一中呈现生动变化的效果。近似的程度可大可小，如果近似的程度大就产生了重复感，近似程度小就会破坏统一。近似与渐变的区别：渐变的变化是规律性很强的，基本形排列非常严谨，而近似的变化规律性不强，基本和其他视觉要素的变化较大，也比较活泼。6对比对比 自然界充满了对比，如红花与绿叶。对比可产生明朗、肯定、强烈的视觉效果，给人深刻的印象。在构成对比的关系上，包括大小、明暗、锐钝、轻重等。对比有形状的对比、大小的对比、色彩的对比、肌理的对比、位置的对比、重心的对比、空间的对比和虚实的对比。平面构成的形式还有特异构成、空间构成、密集构成、肌理构成、分割构成等。