第2章 网页图像处理
第2章使用Photoshop编辑网页图像课件
37
（7）查看婚纱抠图效果
（8）载入人物选区
2.1.8 为图像添加文本和形状
38
在不锈钢炒锅素材中添加文字和形状，使商品图片展现的更加直观，其具体操作如下。
（1）输入并设置文字
（2）输入并设置文本
2.1.8 为图像添加文本和形状
39
（3）绘制直线
（4）输入并设置文本
（5）选择形状
（6）绘制 直线并输入
（1）打开素材图片
（2）设置属性并框选树叶
2.1.3 修复商品图片
（3） 擦除树叶
14
（4） 查看效果
2.1.3 修复商品图片
15
3．使用内容感知工具复制图像
打开“酒瓶.jpg”图像文件，使用内容感知移动工具将右侧酒瓶复制到左侧的空白区域，其具 体操作如下。
（1）打开素材图片
（2）设置属性并框选酒瓶
2.1.4 使用液化滤镜处理图片
19
使用液化滤镜对人物进行处理，使人物更加婀娜多姿，其具体操作如下。
（1）选择“液化”命令
（2）设置“液化”对话框
2.1.4 使用液化滤镜处理图片
20
（3）修饰脸型
（4）查看效果
2.1.5．调整图片颜色
21
处理户外旅行包产品图片，在处理时先对旅行包的亮度、对比度和色彩进行调整，使其显 示效果更佳，然后为其添加背景，达到吸引消费者点击的目的，其具体操作如下。
内容导航
2.1 课堂案例：处理商品展示效果 2.2 课堂案例：制作banner区海报 2.3 项目实训 2.4 课后练习
1
课堂案例：处理商品图片展示效果
2
米拉想为电商网站设计效果图，老洪告诉米拉，最好先将网页中需要用到的商品展示图片设 计好，这样有利于提升网页的美观度，并提高界面效果图的制作效率。完成后的部分效果如图所 示
网页设计中计算机图像处理技术的应用
网页设计中计算机图像处理技术的应用1. 引言1.1 概述计算机图像处理技术在网页设计中的应用越来越广泛，为网页设计师带来了更多的创作可能性和用户体验。
随着互联网的发展，图像已成为网页设计中不可或缺的元素，而图像处理技术作为其重要的支撑之一，更是被广泛应用。
通过图像处理技术，可以对图像进行处理、优化和美化，使其更符合网页设计的需求，提升网页的视觉效果和用户体验。
图像处理技术还可以通过压缩、缩放和格式转换等方式，优化图像在网页加载和显示过程中的性能，提高网页的加载速度和响应能力。
在当今互联网时代，图像处理技术已成为网页设计中不可或缺的一部分，对于提升网页的吸引力、传达信息、增强用户体验等方面发挥着重要作用。
研究和探讨图像处理技术在网页设计中的应用已成为一个备受关注的热点话题。
本文将探讨图像处理技术在网页设计中的应用，分析其对网页性能的影响，探讨其在用户体验中的作用，介绍常用的图像处理技术，并展望图像处理技术在网页设计领域的发展趋势。
1.2 研究意义在当今互联网时代，网页设计已经成为了人们获取信息、沟通交流以及进行商业活动的重要途径。
而计算机图像处理技术作为网页设计的重要组成部分，具有着巨大的研究意义和实际应用价值。
图像处理技术在网页设计中的应用，可以大大提升网页的视觉效果和用户体验，使得用户可以更直观地获取信息并产生更好的感知体验。
图像处理技术也对网页性能有着重要的影响，通过优化图像大小、质量和加载速度，可以提高网页响应速度和用户体验，减少用户流失率。
随着移动互联网的快速发展，图像处理技术在网页设计中的作用更为凸显，能够适应不同设备的屏幕大小和分辨率，实现网页的响应式设计。
深入研究和探讨图像处理技术在网页设计中的应用具有重要的现实意义，有助于进一步拓展网页设计领域的研究和应用前景，提升网页设计的效果和效率，推动互联网产业的发展。
2. 正文2.1 图像处理技术在网页设计中的应用图像处理技术在网页设计中的应用非常广泛且重要。
Photoshop网页设计图片处理技巧介绍
Photoshop网页设计图片处理技巧介绍在当今数字化时代，网页设计已成为企业宣传、产品推广的重要组成部分。
而设计中的图片处理技巧更是决定网页美观与否的关键。
Photoshop作为最受欢迎的图像处理软件之一，提供了众多强大的功能和工具，使得设计师能够轻松地处理和优化图片。
本文将介绍一些在Photoshop中常用的网页设计图片处理技巧，以帮助设计师创造出更具吸引力和专业感的网页设计。
一、图像调整技巧1. 颜色校正在网页设计中，颜色的准确呈现对于营造品牌形象和用户体验至关重要。
Photoshop中的“图像调整”功能可以帮助设计师通过调整色相、饱和度和亮度等参数来校正图像的色彩。
此外，还可以利用“曲线”工具调整图像的亮暗对比度，以获得更好的视觉效果。
2. 图像裁剪和调整尺寸网页设计常需要对图片进行裁剪和调整尺寸，以适应不同区域的显示需求。
在Photoshop中，通过“裁剪工具”可以轻松选择和裁剪图像的目标区域，而“图像大小”功能则提供了灵活的调整尺寸选项，使得设计师能够任意变换图像的大小。
二、图像优化技巧1. 图像压缩为了提高网页加载速度，设计师需要对网页图像进行压缩，以减小文件大小。
在Photoshop中，可以使用“保存为Web所用格式”命令将图像保存为JPEG或PNG等格式，并通过调整压缩质量或位深度来平衡图像质量和文件大小。
2. 图像格式转换对于不同类型的图像，网页设计往往要求使用特定的图像格式。
比如，需要透明背景的图像通常使用PNG格式，而对于颜色丰富的图片则推荐使用JPEG格式。
Photoshop提供了一键式的图像格式转换功能，设计师只需简单地选择目标格式即可。
三、图像处理技巧1. 图层和蒙版技巧图层和蒙版是Photoshop中强大的功能，可以帮助设计师创建图像的多个版本，并进行非破坏性的编辑。
通过使用图层和蒙版，设计师可以实现各种复杂的图片处理效果，如渐变、特效、阴影等，以增强网页的视觉吸引力。
网店美工图像处理基本操作
2.5.3 转换“ 背景” 图层与普通 图层
1． 将“ 背景” 图层转换为普通图层
2． 将普通图层转换为“ 背景” 图层
2.5.4 复制图层
在“ 图层” 面板中可以根据需要复制图层。 将需要复制的图层 拖至“ 创建新图层” 按钮 上，如图 2-42 所示。 松开鼠标即可 复制该图层， 如图2-43所示。
2.1.4 关闭商品图像文
单击图像窗口标题栏上的“ 关闭” 按钮 或单击“ 文件” |“ 关闭” 命令， 均可关闭图像文件，如图2-11所示。
2.2 调整商品图像尺寸
调整图像大小包括修改图像的大小和调整画布大小， 主要是通过“ 图像” 菜单中的命令完成的。 下面 将学习如何使用“ 图像大小” 命令调整图像大小， 以及如何使用“ 画布大小” 命令调整画布大小。
与其他软件一样， 在 Photoshop CS6 中新建、 打开、 保存和关闭图像文件是最基本的操作，下面将学习这 些基本操作的方法。
2.1.1 新建空白图像文件
单击“ 文件” |“ 新建” 命令， 弹出“ 新建” 对话框， 如图2-1所示。 在该对话框中输入新图像 的名称， 并设置图像的大小、 分辨率、 颜色模式 和背景内容， 然后单击“ 确定” 按钮， 即可新建 一个图像文件。
2.4.2 使用“ 历史记录” 面板恢 复图像操作
单击“ 窗口” |“ 历史记录” 命令， 即可打开“ 历史记录” 面板， 如图 2-30 所示。除此之外， 还可单击“ 编辑” |“ 首 选项” 命令或按【Ctrl+K】组合键， 弹出“ 首选项” 对话框， 在“ 性能” 选项中更改存储历史记录的步数， 如图2-31所示。
2.4.1 使用菜单命令还原图像操作
单击“ 编辑” |“ 还原” 命令， 可以撤销最近一次对图像所 做的操作。 撤销之后， 单击“ 编辑” |“ 重做” 命令， 可 以重做刚刚还原的操作。 需要注意的是， 由于操作的不同， 菜 单栏中“ 还原” 和“ 重做” 命令的显示略有不同， 如图2-29 所示。
Web页中图像处理的几种方法
Web页中图像处理的几种方法随着Internet的不断发展壮大，Internet 上的网页制作成了一门新兴科学。
网页中不可避免地包含着一定数量的图形，因为较多的图像在增加吸引力的同时能给访问者提供更多更直接的信息，同时图像也较少受计算机平台、地域和语种的限制，能使网页更多地显示出制作者的创造力。
虽然图像具有上述优势，但是由于图像是在Internet网络上传送，而Internet线路目前的传输速率还不理想，特别是国内大多数用户是通过慢速拨号连入本地的ISP,因此图像的大小在很大程度上影响着网页的下载时间，制作不好的图像文件下载时更会浪费Internet的带宽。
由此可见我们在制作网页时优化图像的大小是非常关键的，优化后的图像也许仅仅减少了几千个字节，但当页面中不只是一幅图像，或不止一个用户且不止一次地访问该页面时，节省的下载时间和通道带宽将是巨大的。
下面我们就浅谈一下制作网页时几种用来优化图形的常用格式。
GIF格式GIF(Graphic Interchange Format图形互换格式)是为跨平台消费市场开发的，当时消费者还没有机会使用"高档"的图形卡，大多数计算机的图形颜色比256色还少，所以256色被作为可显示的最高数目。
GIF也是Internet上使用最早、应用最广泛的图像格式。
GIF格式储存8位／点至l位／点的图像。
其原理是减少每点的存储位数以减小图像文件的大小，这就是我们通常所说的减色抖动dithering。
准确地说，GIF减少了图像调色板中的色彩数量，从而在存储时达到减小图像文件大小的目的。
该调色板通常并非Windows本身提供的标准凋色板，而是图像优化处理后的调色板。
现在假定我们制作一幅全色图像（用photoshop的术语就是"RGB模式"），原图为120k 的"PSD格式"，准备作成一份GIF的文件之前，必须将它用一个相关的颜色图转换成为一个受限制的8位图像（用photoshop的术语说就是工作于"索引颜色模式"）由表1可看出，保持图像尺寸不变的情况下减少图像中每点的色彩数可以减少图像文件的大小。
网页设计中计算机的图像处理
网页设计中计算机的图像处理【摘要】网页设计中的图像处理是至关重要的，它不仅可以提升网页的视觉吸引力，还可以改善用户体验。
本文将深入探讨图像处理技术在网页设计中的基本原理，介绍常用的图像处理软件和工具，以及具体的应用案例。
我们还将讨论图像处理在响应式网页设计中的作用，以及对网页加载速度的影响。
在我们将总结图像处理对网页设计的重要性，展望未来图像处理在网页设计中的发展方向，强调其在提升用户体验中的不可替代性。
通过本文的介绍，读者将更深入了解图像处理在网页设计中的重要性，并为未来的网页设计提供新的思路和方向。
【关键词】网页设计，计算机，图像处理，重要性，应用场景，用户体验，基本原理，软件工具，应用案例，响应式网页设计，加载速度，发展方向，用户体验，不可替代性1. 引言1.1 介绍网页设计中计算机的图像处理的重要性在网页设计中，计算机的图像处理起着至关重要的作用。
随着互联网的发展，用户对网页设计的要求也越来越高，对于图像的清晰度、色彩和美观度等方面都提出了更高的要求。
而图像处理正是可以帮助网页设计师实现这些要求的关键技术之一。
通过图像处理技术，设计师可以对图像进行裁剪、调整大小、修改色彩、添加滤镜等操作，从而使得图像更加符合网页设计的需求。
而这些处理过的图像不仅可以提升网页的视觉效果，还可以提升用户体验，吸引用户留在页面上的时间。
图像处理还可以帮助网页设计师实现响应式设计，让网页在不同设备上都能够呈现出最佳的效果。
而且经过优化处理的图片可以减小文件大小，从而提高网页加载速度，让用户能够更快速地访问网页内容。
网页设计中的图像处理对于提升用户体验、优化页面加载速度、实现响应式设计等方面都具有不可替代的重要性。
只有将图像处理技术应用到网页设计中，设计师才能够创造出更具吸引力和功能性的网页，满足用户的需求并赢得用户的青睐。
1.2 探讨图像处理在网页设计中的应用场景在网页设计中，图像处理是至关重要的一环。
通过图像处理技术，设计者可以将原始图片进行修饰、优化和调整，以实现更好的视觉效果，提升用户体验。
网页设计中计算机图像处理技术的应用
网页设计中计算机图像处理技术的应用随着互联网技术的不断发展和普及，越来越多的企业和个人开始拥有了自己的网站。
而随着互联网内容的丰富和各类信息的爆炸式增长，许多网站开始通过图像、音频等多媒体手段来吸引用户，提升用户体验。
在这种情况下，计算机图像处理技术的应用逐渐成为了网页设计的一个重要组成部分。
一、图像压缩图像是网页设计中不可或缺的元素之一，但是因为图像文件的大小普遍较大，如果直接将高清晰度图片上传到网页中，则会造成较慢的加载速度和用户的不良体验。
因此需要对图像进行压缩，使其体积缩小。
图像压缩的原理是利用数学几何变换、信号处理理论和信息论的基本原理把图像信息压缩成尽可能少的“数字字节数”，从而减少图像数据的存储空间和传输流量，使其更适合在互联网上使用。
二、图像优化在进行图像压缩之前，需要对图像进行优化处理。
由于网络带宽的限制和移动设备的限制，需要优化图像以加快网站的载入速度，并提高用户体验。
通过优化，可以缩小图像文件的大小，加快下载速度，同时保证图像质量不受影响。
优化包括对图像格式、图像质量、图像分辨率的调整等。
三、图像处理在网站设计中，需要经常处理一些图像，如图像切片、水印、裁剪、缩放、锐化等，以使其更适合网站的需要和使用，在此期间，计算机图像处理技术显得尤为重要。
比如，图像切片是指将一张大的图片裁剪成多个小的图片，然后在网站上显示，以提高网站的载入速度。
此时，计算机图像处理技术可以帮助我们将一张图片分割成需要的几部分，达到优化网页图片的目的。
四、动态效果动态效果是现代网页设计中的一个重要组成部分，比如轮播图、动画、交互效果等。
计算机图像处理技术可以帮助我们实现这一目标。
对于轮播图，我们可以使用flash或者javascript技术，将多个图片旋转播放，吸引用户的眼球。
对于动画效果，使用gif或者flash技术，模拟动态效果，使网站更加生动有趣。
对于交互效果，我们可以使用javascript和ajax技术来实现，让用户更加方便地浏览和使用网站。
网页图像处理
设置网页背景
①设置网页背景颜色 在页面属性对话框里设置 ②设置背景图像 设置网页背景色，只能得到单一颜色的背景。 设置网页背景色 ， 只能得到单一颜色的背景 。 如 何能使背景发生更多的变化， 何能使背景发生更多的变化，这就需要设置网页的背景图 像。 ③背景音乐 注意连接相对路径 对于其他格式可以进行转换后插入，或用代码实现： 对于其他格式可以进行转换后插入，或用代码实现： 如mp3 <head>前 在<head>前 <bgsound src="音乐路径" loop="-1"> src="音乐路径 loop="音乐路径" <base target="_self">
<EMBED style="FILTER: alpha(opacity=50)" src="这是视频的地址 “ width="100%" height=45 type=audio/mpeg AUTOSTART="false" LOOP="true"></EMBED>
五
在网页中使用超链接
1．创建文本超链接 操作步骤如下： 操作步骤如下：
四
1
网页图像处理
网页中颜色的选择
在网页中是以RGB方式由红 蓝这三种基色调混和而成的， 在网页中是以 RGB方式由红、 绿 、 蓝这三种基色调混和而成的 ， RGB 方式由红、 RGB(Red、Green、Blue)。 RGB(Red、Green、Blue)。 在网页中运用色彩一般应遵循下列几个原则。 在网页中运用色彩一般应遵循下列几个原则。 一个页面中切忌采用过多的颜色，选用颜色一般不要超过三四种。 （1）一个页面中切忌采用过多的颜色，选用颜色一般不要超过三四种。 背景的颜色不要太深，显得过于厚重。但也有例外， （ 2）背景的颜色不要太深，显得过于厚重。但也有例外，黑色的背景衬 托出亮丽的文本和图像，会给人一种另类的感觉。 托出亮丽的文本和图像，会给人一种另类的感觉。 要保持整个网页的色调统一。 （3）要保持整个网页的色调统一。 要围绕网页的主题选择颜色，色彩要能烘托出主题。 （4）要围绕网页的主题选择颜色，色彩要能烘托出主题。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
编辑文本
在Photoshop中可以制作出多种特殊效果的 文字，常出现在各种广告、招牌中。在设计网 页过程中，文字工具可以创作出网页标题、导 航文本、网站LOGO等项目。
《多媒体网页设计教程》 多媒体网页设计教程》
文本工具的使用
单击工具箱中的按钮，系统弹出文字工 具选项栏，如下图所示。用户可以在其 中设置出各式各样的字体和字形。用鼠 标左键在工作区中的任意位置单击，可 出现输入文字的闪烁光标提示，即可开 始输入所需文字。
《多媒体网页设计教程》 多媒体网页设计教程》
图像格式（2）
3．GIF（.GIF）格式 它在压缩过程中，图像的像素资料不会被丢失， 然而丢失的却是图像的色彩。GIF格式最多只能储存 256色，所以通常用来显示简单图形及文字。 4．PND（.PNG）格式 PNG图像格式文件(或者称为数据流)由一个8字 节的PNG文件署名(PNG file signature)域和按照特 定结构组织的3个以上的数据块(chunk)组成。PNG用 来存储灰度图像时，灰度图像的深度可多到16位，存 储彩色图像时，彩色图像的深度可多到48位，并且还 可存储多到16位的α通道数据。另外PNG也被称为专 业网页图像格式，其最大的优点就是能储存透明背景 的图像。
《多媒体网页设计教程》 多媒体网页设计教程》
Photoshop颜色模式（1）
常见的颜色模式有：RGB、CMYK、Lab、 HSB以及灰度模式等。 1．RGB模式 RGB模式是在Photoshop中处理图像时 接触最多的颜色模式，RGB颜色是由红、绿、 蓝三原色构成。 2．CMYK模式 CMYK颜色模式是一种专门用来印刷的颜 色，CMYK颜色是由青色、品红、黄色、黑色 四种印刷颜色组成。
《多媒体网页设计教程》 多媒体网页设计教程》
合成图像--调整图像大小
改变当前编辑的图像大小，其常用方法是“图 像”→“图像大小”命令，打开如下图所示的对话框。 用户在像素大小或文档大小中调整“宽度”和“高度” 值。若勾选对话框底部的“约束比例”复选框，会在 宽度和高度间建立等比例效果。单击“好”按钮后， 图像将按新的宽度和高度对整个图像进行缩放，从而 改变图像的尺寸大小。
《多媒体网页设计教程》 多媒体网页设计教程》
三、Photoshop合成图像
选择工具组面板
框选工具组
套索工具组
《多媒体网页设计教程》 多媒体网页设计教程》
三、Photoshop合成图像
选区的操作 （1）增加选区(按住键盘上Shift键 ) （2）减少选区(按住键盘上Alt键 ) （3）填充选区(前景颜色填充（Alt+Delete） 或背景颜色填充（Ctrl+Delete） ) （4）描边选区 （5）移动选区 （6）平滑选区 （7）羽化选区 （8）反向选择
《多媒体网页设计教程》 多媒体网页设计教程》
图层操作
1.新建图层 新建图层 2.复制图层 复制图层 3.颜色标识 颜色标识 4.删格化图层 删格化图层 5.合并图层 合并图层 6.盖印图层 盖印图层 7.图层叠加模式 图层叠加模式
《多媒体网页设计教程》 多媒体网页设计教程》
图层管理
1.选择图层 选择图层 2.隐藏、显示图层内容 隐藏、 隐藏 3.更改图层顺序 更改图层顺序 4.链接图层 链接图层 5.调整图层内容（对齐、分布） 调整图层内容（ 调整图层内容 对齐、分布） 6.锁定图层 锁定图层 7.从图层取样 从图层取样
《多媒体网页设计教程》 多媒体网页设计教程》
Photoshop颜色模式（2）
3．灰度模式 灰度模式采用了256级不同强度的灰度来 描述图像。其值为0%时，表示为黑色，值为 100%时，表示为白色。 4．Lab模式 Lab模式是国际照明委员会（CIE）于 1976年公布的一种色彩模式。L表示亮度，范 围在0~100之间。a和b则表示颜色过渡的变 化值。
一、网页图像处理概述
网页的设计少不了对图形图像的制作和处理。 图形图像设计与处理软件层出不穷，如Adobe 公司推出的Photoshop、Firework软件、 Corel公司推出的CorelDRAW等。本教程介绍 的是目前使用最广泛的图形图像设计与制作软 件Photoshop。
《多媒体网页设计教程》 多媒体网页设计教程》
感受中国”页面图像， 制作 “感受中国”页面图像，效果如下图所 示
具体要求： 1、加强图像绿色调； 2、调整图像“宽度”值为“698像素”、“高度”值为“179像 素” 。
《多媒体网页设计教程》 多媒体网页设计教程》
色彩调整实例步骤
“感受中国”页面图像制作步骤如下： 感受中国”页面图像制作步骤如下：
《多媒体网页设计教程》 多媒体网页设计教程》
图像分辨率
分辨率是指单位长度上像素的多少，单位长度 上像素越多，图像就越清晰。例如，72dpi表 示图像中每英寸包含72个像素或点。
位 图
矢量图 《多媒体网页设计教程》 多媒体网页设计教程》
Photoshop CS工作界面
《多媒体网页设计教程》 多媒体网页设计教程》
《多媒体网页设计教程》 多媒体网页设计教程》
调整文本格式
选择需要调整格式的文本，单击文字工 具选项栏右端按钮，系统弹出字符调整面板， 如下图所示，用户可根据要求自行设置。
《多媒体网页设计教程》 多媒体网页设计教程》
Photoshop工具箱
工具箱上的工具大致分为 以下四大类： （1）选项区工具。包括选区 工具组、套索工具组、魔 术棒工具。 （2）绘制工具。包括画笔工 具组、历史画笔工具组、 橡皮擦工具组、渐变工具 组、吸管工具。 （3）编辑工具。包括印章工 具组、亮化工具组、模糊 工具组、钢笔工具组。 （4）辅助工具。包括移动工 具、裁剪工具、手形工具、 缩放工具、注释工具组等。
《多媒体网页设计教程》 多媒体网页设计教程》
Photoshop颜色模式（3）
5．HSB模式 HSB模式是一种可以调整图像颜色效果的色彩值， Photoshop图像不能直接保存为HSB模式，执行“图 像”→“调整”→“色相/饱和度”命令后，才能对图 像进行HSB模式调整。 6．Bitmap模式 Bitmap模式又称为位图模式，它是使用黑、白两 种颜色来描述图像的一种方式，因为位置模式的图像 也称作黑白图像。 7．索引颜色模式 索引颜色模式也称作映射颜色。在这种模式下， 只能存储一个8bit色彩深度的文件，即最多256种颜 色，而且颜色都是预先定义好的。
第2章 网页图像处理 章
杭州师范大学 多媒体网页设计课程组
《多媒体网页设计教程》 多媒体网页设计教程》
内容概要（1）
1 2 3 4 5 6 网页图像处理概述 Photoshop基础知识 Photoshop合成图像 编辑文本、图层样式 使用路径、滤镜效果 ImageReady CS的应用
《多媒体网页设计教程》 多媒体网页设计教程》
《多媒体网页设计教程》 多媒体网页设计教程》
合成图像--调整图像色调
调整图像色调，其最直观方法是“图像”→ “调 整”→“色彩平衡”命令，打开下图所示对话框。用 户可根据图像最终效果进行调整和设置。单击“好” 按钮后，图像将按新的色调整生成效果图。
《多媒体网页设计教程》 多媒体网页设计教程》
色彩调整实例
Photoshop CS工作界面
Photoshop CS的窗口是由标题栏、菜单栏、 工具选项栏、工具箱、工作区和控制面板6大 部分组成。
（1）标题栏（2）菜单栏 （3）工具选项栏
《多媒体网页设计教程》 多媒体网页设计教程》
Photoshop CS工作界面
（4）工具箱：Photoshop软件的所有工具（绘 图、选择工具、调整工具等）都置于工具箱中， 用户需要使用什么工具，只要在工具箱中选择 即可。 （5）控制面板：控制面板是Photoshop软件中 非常重要的辅助作图工具，其总是浮动在活动 窗口中最前面，供用户随时访问。 （6）工作区：工作区是图像编辑区，显示了当 前正在编辑的图像内容。
《多媒体网页设计教程》 多媒体网页设计教程》
《多媒体网页设计教程》 多媒体网页设计教程》
合成图像实例
合成照片， 合成照片，效果如下图所示
素 材 一
素 材 二 最终效果图
《多媒体网页设计教程》 多媒体网页设计教程》
图像格式（1）
Photoshop保存文件过程中，有多种图像格式可供 用户选择，不同的格式图像的色彩品质、容量大小都 有一程度的差异。不同的文件格式可以用扩展名来区 分，如PSD、JPG、GIF、PNG等。 1．PSD（.PSD）格式 PSD图像文件是Photoshop软件自身格式，也 称为原文件格式，是惟一能支持全部图像色彩模式的 格式。以PSD格式保存的图像可以包含图层、通道及 色彩模式。 2．JPEG(.JPG；.JPE)格式 JPEG图像文件格式主要用于图像浏览及超文本 文档，如HTML文档等。支持多种色彩模式。使用 JPEG格式保存的图像经过高倍率的压缩，可使图像文 件容量变得较小，但在压缩过程中会丢失部分数据。
《多媒体网页设计教程》 多媒体网页设计教程》
图像格式（3）
5．BMP（.BMP）格式 BMP图像文件格式是一种标准的点阵式 图像格式，支持RGB、灰度和位图色彩模式， 但不支持Alpha通道。 6．TIFF（.TIF）格式 TIFF图像文件格式可以在许K、位图、灰度等色彩 模式。而且在RGB、CMYK，以及灰度等模式 支持Alpha通道的使用。
《多媒体网页设计教程》 多媒体网页设计教程》
使用选择工具
中文版Photoshop CS提供的选取工具分为 两大类，一类是规则选取工具也称为框选工具， 另一类是建立不规则选区的工具也称为套索类 工具。 1．规则的框选工具在使用时，只需在图 像中拖动鼠标指针或单击鼠标左键，即可出一 个选择区域。。 2．套索选择工具可用于徒手画的方式描 绘出不规则形状的选取区域。被选定的图像区 域边界上会显示出一条流动的虚线，对虚线以 内的选定区域可以进行任意操作。