法學(xué)網(wǎng)頁(yè)圖像處理優(yōu)質(zhì)精選課件

一、網(wǎng)頁(yè)圖像處理概述網(wǎng)頁(yè)的設(shè)計(jì)少不了對(duì)圖形圖像的制作和處理。圖形圖像設(shè)計(jì)與處理軟件層出不窮，如Adobe公司推出的Photoshop、Firework軟件、Corel公司推出的CorelDRAW等。本教程介紹的是目前使用最廣泛的圖形圖像設(shè)計(jì)與制作軟件Photoshop。一、網(wǎng)頁(yè)圖像處理概述網(wǎng)頁(yè)的設(shè)計(jì)少不了對(duì)圖形圖像的制作和處理。1位圖與矢量圖

1．位圖位圖也稱(chēng)為點(diǎn)陣圖或像素圖，計(jì)算機(jī)屏幕上的圖像是由屏幕上的發(fā)光點(diǎn)構(gòu)成的，每個(gè)點(diǎn)用二進(jìn)制數(shù)據(jù)來(lái)描述其顏色與亮度等信息，這些點(diǎn)是離散的，類(lèi)似于矩陣。多個(gè)像素的色彩組合就形成了圖像，稱(chēng)之為位圖。2．矢量圖矢量圖也稱(chēng)為向量圖，是用一系列計(jì)算機(jī)指令來(lái)描述和記錄的一幅圖，一幅圖可分解為一系列由點(diǎn)、線、面等組成的子圖，矢量圖記錄的是對(duì)象的幾何形狀、線條粗細(xì)和色彩等，因此生成的文件存儲(chǔ)容量很小。

位圖與矢量圖2圖像分辨率分辨率是指單位長(zhǎng)度上像素的多少，單位長(zhǎng)度上像素越多，圖像就越清晰。例如，72dpi表示圖像中每英寸包含72個(gè)像素或點(diǎn)。位圖矢量圖圖像分辨率分辨率是指單位長(zhǎng)度上像素的多少，單位長(zhǎng)度上像3PhotoshopCS工作界面PhotoshopCS工作界面4PhotoshopCS工作界面PhotoshopCS的窗口是由標(biāo)題欄、菜單欄、工具選項(xiàng)欄、工具箱、工作區(qū)和控制面板6大部分組成。（1）標(biāo)題欄（2）菜單欄（3）工具選項(xiàng)欄PhotoshopCS工作界面PhotoshopCS5PhotoshopCS工作界面（4）工具箱：Photoshop軟件的所有工具（繪圖、選擇工具、調(diào)整工具等）都置于工具箱中，用戶(hù)需要使用什么工具，只要在工具箱中選擇即可。（5）控制面板：控制面板是Photoshop軟件中非常重要的輔助作圖工具，其總是浮動(dòng)在活動(dòng)窗口中最前面，供用戶(hù)隨時(shí)訪問(wèn)。（6）工作區(qū)：工作區(qū)是圖像編輯區(qū)，顯示了當(dāng)前正在編輯的圖像內(nèi)容。PhotoshopCS工作界面（4）工具箱：Photosh6Photoshop工具箱工具箱上的工具大致分為以下四大類(lèi)：（1）選項(xiàng)區(qū)工具。包括選區(qū)工具組、套索工具組、魔術(shù)棒工具。（2）繪制工具。包括畫(huà)筆工具組、歷史畫(huà)筆工具組、橡皮擦工具組、漸變工具組、吸管工具。（3）編輯工具。包括印章工具組、亮化工具組、模糊工具組、鋼筆工具組。（4）輔助工具。包括移動(dòng)工具、裁剪工具、手形工具、縮放工具、注釋工具組等。Photoshop工具箱工具箱上的工具大致分為以下四大類(lèi)：7圖層控制面板圖層控制面板如下圖所示，主要用來(lái)對(duì)圖層進(jìn)行管理和操作，包括添加圖層、刪除圖層、合并圖層等。圖層控制面板圖層控制面板如下圖所示，主要用來(lái)對(duì)圖層進(jìn)行管理和8圖層基本概念圖層概念：我們可以把圖層想像成是一張一張疊起來(lái)的透明膠片，每張透明膠片上都有不同的畫(huà)面，改變圖層的順序和屬性可以改變圖像的最后效果。通過(guò)對(duì)圖層的操作，使用它的特殊功能可以創(chuàng)建很多復(fù)雜的圖像效果。圖層面板：圖層面板上顯示了圖像中的所有圖層、圖層組和圖層效果，我們可以使用圖層面板上的各種功能來(lái)完成一些圖像編輯任務(wù)，例如創(chuàng)建、隱藏、復(fù)制和刪除圖層等。

圖層類(lèi)型：1.背景圖層2.一般圖層3.圖層組圖層基本概念圖層概念：我們可以把圖層想像成是一張一張疊起9圖層操作1.新建圖層2.復(fù)制圖層3.顏色標(biāo)識(shí)4.刪格化圖層5.合并圖層6.蓋印圖層7.圖層疊加模式圖層操作1.新建圖層10圖層管理

1.選擇圖層

2.隱藏、顯示圖層內(nèi)容

3.更改圖層順序

4.鏈接圖層

5.調(diào)整圖層內(nèi)容（對(duì)齊、分布）

6.鎖定圖層

7.從圖層取樣圖層管理1.選擇圖層11Photoshop顏色模式（1）常見(jiàn)的顏色模式有：RGB、CMYK、Lab、HSB以及灰度模式等。1．RGB模式RGB模式是在Photoshop中處理圖像時(shí)接觸最多的顏色模式，RGB顏色是由紅、綠、藍(lán)三原色構(gòu)成。2．CMYK模式CMYK顏色模式是一種專(zhuān)門(mén)用來(lái)印刷的顏色，CMYK顏色是由青色、品紅、黃色、黑色四種印刷顏色組成。

Photoshop顏色模式（1）常見(jiàn)的顏色模式有：RGB、C12Photoshop顏色模式（2）3．灰度模式灰度模式采用了256級(jí)不同強(qiáng)度的灰度來(lái)描述圖像。其值為0%時(shí)，表示為黑色，值為100%時(shí)，表示為白色。

4．Lab模式Lab模式是國(guó)際照明委員會(huì)（CIE）于1976年公布的一種色彩模式。L表示亮度，范圍在0~100之間。a和b則表示顏色過(guò)渡的變化值。

Photoshop顏色模式（2）3．灰度模式13Photoshop顏色模式（3）5．HSB模式HSB模式是一種可以調(diào)整圖像顏色效果的色彩值，Photoshop圖像不能直接保存為HSB模式，執(zhí)行“圖像”→“調(diào)整”→“色相/飽和度”命令后，才能對(duì)圖像進(jìn)行HSB模式調(diào)整。

6．Bitmap模式Bitmap模式又稱(chēng)為位圖模式，它是使用黑、白兩種顏色來(lái)描述圖像的一種方式，因?yàn)槲恢媚Ｊ降膱D像也稱(chēng)作黑白圖像。7．索引顏色模式索引顏色模式也稱(chēng)作映射顏色。在這種模式下，只能存儲(chǔ)一個(gè)8bit色彩深度的文件，即最多256種顏色，而且顏色都是預(yù)先定義好的。Photoshop顏色模式（3）5．HSB模式14合成圖像--調(diào)整圖像大小改變當(dāng)前編輯的圖像大小，其常用方法是“圖像”→“圖像大小”命令，打開(kāi)如下圖所示的對(duì)話(huà)框。用戶(hù)在像素大小或文檔大小中調(diào)整“寬度”和“高度”值。若勾選對(duì)話(huà)框底部的“約束比例”復(fù)選框，會(huì)在寬度和高度間建立等比例效果。單擊“好”按鈕后，圖像將按新的寬度和高度對(duì)整個(gè)圖像進(jìn)行縮放，從而改變圖像的尺寸大小。

合成圖像--調(diào)整圖像大小改變當(dāng)前編輯的圖像大小，其常用方法是15合成圖像--調(diào)整圖像色調(diào)調(diào)整圖像色調(diào)，其最直觀方法是“圖像”→“調(diào)整”→“色彩平衡”命令，打開(kāi)下圖所示對(duì)話(huà)框。用戶(hù)可根據(jù)圖像最終效果進(jìn)行調(diào)整和設(shè)置。單擊“好”按鈕后，圖像將按新的色調(diào)整生成效果圖。

合成圖像--調(diào)整圖像色調(diào)調(diào)整圖像色調(diào)，其最直觀方法是“圖像”16選擇鋼筆工具,選擇目標(biāo)對(duì)象替換頁(yè)面上其他位置的圖層內(nèi)容。扭曲文字，效果如下圖所示GIF格式最多只能儲(chǔ)存256色，所以通常用來(lái)顯示簡(jiǎn)單圖形及文字。Photoshop蒙版原理可運(yùn)用不同濾鏡，以產(chǎn)生一些意想不到的特效；（6）單擊工具箱中文字工具，在選文字工具選項(xiàng)欄上設(shè)置字體為“黑體”、大小為“22點(diǎn)”、文字顏色為“白色”。ImageReadyCS介紹圖層樣式可以創(chuàng)建出投影、發(fā)光、浮雕、描邊等特殊效果。Photoshop:窗口->工作區(qū)->復(fù)位調(diào)板位置逐幀顯示文字，效果如下圖所示。3、在圖層2當(dāng)中畫(huà)星—會(huì)閃的星星閃爍的星光效果，如下圖所示。翻轉(zhuǎn)(ImageReady)PhotoshopCS工作界面使用“徑向模糊”濾鏡功能制作“秀我風(fēng)采”文字的噴發(fā)光芒效果，效果如圖：綜合實(shí)例二：企業(yè)標(biāo)志制作2、輸入文字，然后柵格化“火焰字”文字圖層，并且復(fù)制該圖層它是基于色彩模式這一基礎(chǔ)上衍生出的簡(jiǎn)化操作工具。JPEG圖像文件格式主要用于圖像瀏覽及超文本文檔，如HTML文檔等。色彩調(diào)整實(shí)例制作“感受中國(guó)”頁(yè)面圖像，效果如下圖所示

具體要求：1、加強(qiáng)圖像綠色調(diào)；2、調(diào)整圖像“寬度”值為“698像素”、“高度”值為“179像素”。選擇鋼筆工具,選擇目標(biāo)對(duì)象色彩調(diào)整實(shí)例制作“感受中國(guó)”頁(yè)面17色彩調(diào)整實(shí)例步驟“感受中國(guó)”頁(yè)面圖像制作步驟如下：（1）執(zhí)行“文件”→“打開(kāi)”命令，打開(kāi)原始圖像。（2）執(zhí)行“圖像”→“調(diào)整”→“色彩平衡”命令，在彈出的“色彩平衡”調(diào)整對(duì)話(huà)框中將綠色中間值設(shè)置為“+80”，點(diǎn)擊“好”按鈕。（3）執(zhí)行“圖像”→“圖像大小”命令，在彈出“圖像大小”調(diào)整對(duì)話(huà)框中取消“約束比例”復(fù)選框，設(shè)置“寬度”值為“698”、“高度”值為“179”，點(diǎn)擊“好”按鈕。（4）執(zhí)行“文件”→“存儲(chǔ)為”命令來(lái)存儲(chǔ)效果圖，選擇JPG或PNG格式。色彩調(diào)整實(shí)例步驟“感受中國(guó)”頁(yè)面圖像制作步驟如下：（1）執(zhí)18使用選擇工具中文版PhotoshopCS提供的選取工具分為兩大類(lèi)，一類(lèi)是規(guī)則選取工具也稱(chēng)為框選工具，另一類(lèi)是建立不規(guī)則選區(qū)的工具也稱(chēng)為套索類(lèi)工具。

1．規(guī)則的框選工具在使用時(shí)，只需在圖像中拖動(dòng)鼠標(biāo)指針或單擊鼠標(biāo)左鍵，即可出一個(gè)選擇區(qū)域。。

2．套索選擇工具可用于徒手畫(huà)的方式描繪出不規(guī)則形狀的選取區(qū)域。被選定的圖像區(qū)域邊界上會(huì)顯示出一條流動(dòng)的虛線，對(duì)虛線以?xún)?nèi)的選定區(qū)域可以進(jìn)行任意操作。使用選擇工具中文版PhotoshopCS提供的選取工具19三、Photoshop合成圖像選擇工具組面板

框選工具組套索工具組三、Photoshop合成圖像選擇工具組面板框選工具組套20三、Photoshop合成圖像選區(qū)的操作（1）增加選區(qū)(按住鍵盤(pán)上Shift鍵

)（2）減少選區(qū)(按住鍵盤(pán)上Alt鍵

)（3）填充選區(qū)(前景顏色填充（Alt+Delete）或背景顏色填充（Ctrl+Delete）

)（4）描邊選區(qū)（5）移動(dòng)選區(qū)（6）平滑選區(qū)（7）羽化選區(qū)（8）反向選擇三、Photoshop合成圖像選區(qū)的操作21法學(xué)網(wǎng)頁(yè)圖像處理優(yōu)質(zhì)精選課件22合成圖像實(shí)例

合成照片，效果如下圖所示

最終效果圖素材一素材二合成圖像實(shí)例合成照片，效果如下圖所示最終效果圖素材一素材23圖像格式（1）

Photoshop保存文件過(guò)程中，有多種圖像格式可供用戶(hù)選擇，不同的格式圖像的色彩品質(zhì)、容量大小都有一程度的差異。不同的文件格式可以用擴(kuò)展名來(lái)區(qū)分，如PSD、JPG、GIF、PNG等。

1．PSD（.PSD）格式

PSD圖像文件是Photoshop軟件自身格式，也稱(chēng)為原文件格式，是惟一能支持全部圖像色彩模式的格式。以PSD格式保存的圖像可以包含圖層、通道及色彩模式。

2．JPEG(.JPG；.JPE)格式

JPEG圖像文件格式主要用于圖像瀏覽及超文本文檔，如HTML文檔等。支持多種色彩模式。使用JPEG格式保存的圖像經(jīng)過(guò)高倍率的壓縮，可使圖像文件容量變得較小，但在壓縮過(guò)程中會(huì)丟失部分?jǐn)?shù)據(jù)。

圖像格式（1）Photoshop保存文件過(guò)程中，有多種圖像24圖像格式（2）3．GIF（.GIF）格式它在壓縮過(guò)程中，圖像的像素資料不會(huì)被丟失，然而丟失的卻是圖像的色彩。GIF格式最多只能儲(chǔ)存256色，所以通常用來(lái)顯示簡(jiǎn)單圖形及文字。4．PND（.PNG）格式

PNG圖像格式文件(或者稱(chēng)為數(shù)據(jù)流)由一個(gè)8字節(jié)的PNG文件署名(PNGfilesignature)域和按照特定結(jié)構(gòu)組織的3個(gè)以上的數(shù)據(jù)塊(chunk)組成。PNG用來(lái)存儲(chǔ)灰度圖像時(shí)，灰度圖像的深度可多到16位，存儲(chǔ)彩色圖像時(shí)，彩色圖像的深度可多到48位，并且還可存儲(chǔ)多到16位的α通道數(shù)據(jù)。另外PNG也被稱(chēng)為專(zhuān)業(yè)網(wǎng)頁(yè)圖像格式，其最大的優(yōu)點(diǎn)就是能儲(chǔ)存透明背景的圖像。

圖像格式（2）3．GIF（.GIF）格式25圖像格式（3）

5．BMP（.BMP）格式

BMP圖像文件格式是一種標(biāo)準(zhǔn)的點(diǎn)陣式圖像格式，支持RGB、灰度和位圖色彩模式，但不支持Alpha通道。

6．TIFF（.TIF）格式

TIFF圖像文件格式可以在許多不同的平臺(tái)和應(yīng)用軟件間交換信息，其應(yīng)用相當(dāng)廣泛。該格式支持RGB、CMYK、位圖、灰度等色彩模式。而且在RGB、CMYK，以及灰度等模式支持Alpha通道的使用。

圖像格式（3）5．BMP（.BMP）格式26可運(yùn)用不同濾鏡，以產(chǎn)生一些意想不到的特效；做圖的邊緣淡化效果；包括移動(dòng)工具、裁剪工具、手形工具、縮放工具、注釋工具組等。（3）背景圖案：一般體積很小，通常用于填充網(wǎng)頁(yè)和表格。ImageReady界面5、選擇火苗區(qū)域（按住鍵盤(pán)上Ctrl鍵和Alt鍵）復(fù)習(xí)：Photoshop合成圖像閃爍的星光效果，如下圖所示。（1）增加選區(qū)(按住鍵盤(pán)上Shift鍵)將優(yōu)化結(jié)果存儲(chǔ)為：可將當(dāng)前文件保存為HTML文件格式。PSD圖像文件是Photoshop軟件自身格式，也稱(chēng)為原文件格式，是惟一能支持全部圖像色彩模式的格式。（6）工作區(qū)：工作區(qū)是圖像編輯區(qū)，顯示了當(dāng)前正在編輯的圖像內(nèi)容。索引顏色模式也稱(chēng)作映射顏色?？梢允褂肐mageReady中的“Web內(nèi)容”調(diào)板來(lái)跟蹤切片及其翻轉(zhuǎn)狀態(tài)。最后一定要“應(yīng)用蒙版”才可以使更改生效。替換頁(yè)面上其他位置的圖層內(nèi)容?！铮?）然后在對(duì)話(huà)框中設(shè)置相應(yīng)的參數(shù)后，點(diǎn)“好”按鈕即可。單擊“好”按鈕后，圖像將按新的寬度和高度對(duì)整個(gè)圖像進(jìn)行縮放，從而改變圖像的尺寸大小。（1）創(chuàng)建圖像文件，在“新建”對(duì)話(huà)框中設(shè)置圖像寬度為400像素，高度為100像素?！铮?）然后在對(duì)話(huà)框中設(shè)置相應(yīng)的參數(shù)后，點(diǎn)“好”按鈕即可。編輯文本在Photoshop中可以制作出多種特殊效果的文字，常出現(xiàn)在各種廣告、招牌中。在設(shè)計(jì)網(wǎng)頁(yè)過(guò)程中，文字工具可以創(chuàng)作出網(wǎng)頁(yè)標(biāo)題、導(dǎo)航文本、網(wǎng)站LOGO等項(xiàng)目。可運(yùn)用不同濾鏡，以產(chǎn)生一些意想不到的特效；編輯文本在Ph27文本工具的使用單擊工具箱中的按鈕，系統(tǒng)彈出文字工具選項(xiàng)欄，如下圖所示。用戶(hù)可以在其中設(shè)置出各式各樣的字體和字形。用鼠標(biāo)左鍵在工作區(qū)中的任意位置單擊，可出現(xiàn)輸入文字的閃爍光標(biāo)提示，即可開(kāi)始輸入所需文字。文本工具的使用單擊工具箱中的按鈕，系統(tǒng)彈出文字工具選項(xiàng)欄，如28調(diào)整文本格式

選擇需要調(diào)整格式的文本，單擊文字工具選項(xiàng)欄右端按鈕，系統(tǒng)彈出字符調(diào)整面板，如下圖所示，用戶(hù)可根據(jù)要求自行設(shè)置。調(diào)整文本格式選擇需要調(diào)整格式的文本，單擊文字工具選項(xiàng)29編輯文本實(shí)例

制作文字標(biāo)題，效果如下圖所示

編輯文本實(shí)例制作文字標(biāo)題，效果如下圖所示30編輯文本操作步驟

（1）創(chuàng)建圖像文件，在“新建”對(duì)話(huà)框中設(shè)置圖像寬度為442像素，高度為51像素。（2）設(shè)置前景顏色RGB值分別為（153、204、1），通過(guò)按Alt+Delele鍵用前景顏色填充畫(huà)布。（3）單擊圖層面板上的新建圖層按鈕，創(chuàng)建新的空白圖層1。（4）單擊工具箱中的矩形框選按鈕，在適當(dāng)位置繪制矩形選區(qū)并以白色填充。（5）單擊工具箱中文字工具，在選文字工具選項(xiàng)欄上設(shè)置字體為“黑體”、大小為“20點(diǎn)”、文字顏色為“白色”。在工作區(qū)域內(nèi)輸入“TheNewImpression”。單獨(dú)選擇“TheNew”文本，將其顏色設(shè)置為“黑色。（6）單擊工具箱中文字工具，在選文字工具選項(xiàng)欄上設(shè)置字體為“黑體”、大小為“22點(diǎn)”、文字顏色為“白色”。在工作區(qū)域內(nèi)輸入“最新印象”。單獨(dú)選擇“印象”文本，將其顏色設(shè)置為“黑色”大小設(shè)置為“30點(diǎn)”。（7）執(zhí)行“文件”→“存儲(chǔ)”命令，保存圖像，文件格式按要求設(shè)定。編輯文本操作步驟（1）創(chuàng)建圖像文件，在“新建”對(duì)話(huà)框中設(shè)置31創(chuàng)建變形文本單擊文本選項(xiàng)欄上創(chuàng)建變形文本按鈕，彈出變形文字對(duì)話(huà)框，單擊變形文字對(duì)話(huà)框中的“樣式”下拉列表，系統(tǒng)彈出變形效果列表項(xiàng)，如下圖所示。變形效果列表項(xiàng)變形文字對(duì)話(huà)框創(chuàng)建變形文本單擊文本選項(xiàng)欄上創(chuàng)建變形文本按鈕，彈出變形文字32柵格化文本柵格化文本圖層功能是將文本圖層轉(zhuǎn)換成圖形化圖層。被柵格化的文本內(nèi)容不能再進(jìn)行文本格式調(diào)整，比如字體就無(wú)法再進(jìn)行設(shè)置。方法：在圖層控制面板中用鼠標(biāo)右鍵單文本圖層，在彈出的下拉菜單中選擇“柵格化圖層”命令即可，如下圖所示。柵格化文本柵格化文本圖層功能是將文本圖層轉(zhuǎn)換成圖形化圖層。33制作漸變文字效果實(shí)例

制作漸變文字效果如下圖所示。

操作步驟：（1）創(chuàng)建圖像文件，在“新建”對(duì)話(huà)框中設(shè)置圖像寬度為400像素，高度為100像素。（2）點(diǎn)擊工具箱中的文本按鈕，輸入“漸變文字效果”文本內(nèi)容，設(shè)置相應(yīng)格式。（3）柵格化文本圖層。（4）按住鍵盤(pán)上Ctrl鍵并同時(shí)在“漸變文字效果”圖層上單擊鼠標(biāo)左鍵，可載入圖層選區(qū)。（5）點(diǎn)擊工具箱中的（漸變填充）按鈕，在漸變選項(xiàng)欄上選擇“黑色，白色”漸變，用鼠標(biāo)左鍵在選區(qū)內(nèi)部拖動(dòng)創(chuàng)建漸變效果。（6）執(zhí)行“選擇”→“取消選擇”命令即可完成效果圖。制作漸變文字效果實(shí)例制作漸變文字效果如下圖所示。操作步驟34綜合實(shí)例：網(wǎng)站ＬＯＧＯ制作

綜合實(shí)例一：網(wǎng)站ＬＯＧＯ制作

重點(diǎn)要求：圖像寬度為234像素，高度為97像素。綜合實(shí)例：網(wǎng)站ＬＯＧＯ制作綜合實(shí)例一：網(wǎng)站ＬＯＧＯ制作重35綜合實(shí)例：網(wǎng)站ＬＯＧＯ制作

綜合實(shí)例二：企業(yè)標(biāo)志制作

綜合實(shí)例：網(wǎng)站ＬＯＧＯ制作綜合實(shí)例二：企業(yè)標(biāo)志制作36Photoshop顏色模式（3）Photoshop蒙版原理在這種模式下，只能存儲(chǔ)一個(gè)8bit色彩深度的文件，即最多256種顏色，而且顏色都是預(yù)先定義好的。（1）圖片：一般無(wú)法分割的圖片（原圖大?。?。制作閃電，效果如下圖所示方法：在圖層控制面板中用鼠標(biāo)右鍵單文本圖層，在彈出的下拉菜單中選擇“柵格化圖層”命令即可，如下圖所示。設(shè)計(jì)Web頁(yè)--頁(yè)面設(shè)計(jì)切片目的：盡可能小的減少網(wǎng)頁(yè)文件的體積Photoshop顏色模式（2）添加幀以創(chuàng)建翻轉(zhuǎn)動(dòng)畫(huà)。GIF格式最多只能儲(chǔ)存256色，所以通常用來(lái)顯示簡(jiǎn)單圖形及文字。做圖的邊緣淡化效果；（3）填充選區(qū)(前景顏色填充（Alt+Delete）或背景顏色填充（Ctrl+Delete）)3、打開(kāi)”動(dòng)畫(huà)“調(diào)板，創(chuàng)建新幀CMYK顏色模式是一種專(zhuān)門(mén)用來(lái)印刷的顏色，CMYK顏色是由青色、品紅、黃色、黑色四種印刷顏色組成。（2）背景色：通過(guò)網(wǎng)頁(yè)代碼可以實(shí)現(xiàn)的顏色。圖像映射將圖像區(qū)域鏈接到URL。為了使人的肉眼感覺(jué)不到圖像的切換，一秒鐘至少要顯示24幀。（5）單擊工具箱中文字工具，在選文字工具選項(xiàng)欄上設(shè)置字體為“黑體”、大小為“20點(diǎn)”、文字顏色為“白色”。L表示亮度，范圍在0~100之間。內(nèi)容概要（2）合成圖像

2圖層樣式

3蒙版5使用路徑4圖像格式1Photoshop顏色模式（3）內(nèi)容概要（2）合成圖像2圖37圖像格式（1）

Photoshop保存文件過(guò)程中，有多種圖像格式可供用戶(hù)選擇，不同的格式圖像的色彩品質(zhì)、容量大小都有一程度的差異。不同的文件格式可以用擴(kuò)展名來(lái)區(qū)分，如PSD、JPG、GIF、PNG等。

1．PSD（.PSD）格式

PSD圖像文件是Photoshop軟件自身格式，也稱(chēng)為原文件格式，是惟一能支持全部圖像色彩模式的格式。以PSD格式保存的圖像可以包含圖層、通道及色彩模式。

2．JPEG(.JPG；.JPE)格式

JPEG圖像文件格式主要用于圖像瀏覽及超文本文檔，如HTML文檔等。支持多種色彩模式。使用JPEG格式保存的圖像經(jīng)過(guò)高倍率的壓縮，可使圖像文件容量變得較小，但在壓縮過(guò)程中會(huì)丟失部分?jǐn)?shù)據(jù)。

圖像格式（1）Photoshop保存文件過(guò)程中，有多種圖像38圖像格式（2）3．GIF（.GIF）格式它在壓縮過(guò)程中，圖像的像素資料不會(huì)被丟失，然而丟失的卻是圖像的色彩。GIF格式最多只能儲(chǔ)存256色，所以通常用來(lái)顯示簡(jiǎn)單圖形及文字。4．PND（.PNG）格式

PNG圖像格式文件(或者稱(chēng)為數(shù)據(jù)流)由一個(gè)8字節(jié)的PNG文件署名(PNGfilesignature)域和按照特定結(jié)構(gòu)組織的3個(gè)以上的數(shù)據(jù)塊(chunk)組成。PNG用來(lái)存儲(chǔ)灰度圖像時(shí)，灰度圖像的深度可多到16位，存儲(chǔ)彩色圖像時(shí)，彩色圖像的深度可多到48位，并且還可存儲(chǔ)多到16位的α通道數(shù)據(jù)。另外PNG也被稱(chēng)為專(zhuān)業(yè)網(wǎng)頁(yè)圖像格式，其最大的優(yōu)點(diǎn)就是能儲(chǔ)存透明背景的圖像。

圖像格式（2）3．GIF（.GIF）格式39圖像格式（3）

5．BMP（.BMP）格式

BMP圖像文件格式是一種標(biāo)準(zhǔn)的點(diǎn)陣式圖像格式，支持RGB、灰度和位圖色彩模式，但不支持Alpha通道。

6．TIFF（.TIF）格式

TIFF圖像文件格式可以在許多不同的平臺(tái)和應(yīng)用軟件間交換信息，其應(yīng)用相當(dāng)廣泛。該格式支持RGB、CMYK、位圖、灰度等色彩模式。而且在RGB、CMYK，以及灰度等模式支持Alpha通道的使用。

圖像格式（3）5．BMP（.BMP）格式40演示：編輯文本實(shí)例

制作文字標(biāo)題，效果如下圖所示

注意最后保存的文件格式演示：編輯文本實(shí)例制作文字標(biāo)題，效果如下圖所示注意最后保41演示：制作漸變文字效果實(shí)例

制作漸變文字效果如下圖所示。

操作步驟：（1）創(chuàng)建圖像文件，在“新建”對(duì)話(huà)框中設(shè)置圖像寬度為400像素，高度為100像素。（2）點(diǎn)擊工具箱中的文本按鈕，輸入“漸變文字效果”文本內(nèi)容，設(shè)置相應(yīng)格式。（3）柵格化文本圖層。（4）按住鍵盤(pán)上Ctrl鍵并同時(shí)在“漸變文字效果”圖層上單擊鼠標(biāo)左鍵，可載入圖層選區(qū)。（5）點(diǎn)擊工具箱中的（漸變填充）按鈕，在漸變選項(xiàng)欄上選擇“黑色，白色”漸變，用鼠標(biāo)左鍵在選區(qū)內(nèi)部拖動(dòng)創(chuàng)建漸變效果。（6）執(zhí)行“選擇”→“取消選擇”命令即可完成效果圖。演示：制作漸變文字效果實(shí)例制作漸變文字效果如下圖所示。操42復(fù)習(xí)：圖層基本概念圖層概念：我們可以把圖層想像成是一張一張疊起來(lái)的透明膠片，每張透明膠片上都有不同的畫(huà)面，改變圖層的順序和屬性可以改變圖像的最后效果。通過(guò)對(duì)圖層的操作，使用它的特殊功能可以創(chuàng)建很多復(fù)雜的圖像效果。圖層面板：圖層面板上顯示了圖像中的所有圖層、圖層組和圖層效果，我們可以使用圖層面板上的各種功能來(lái)完成一些圖像編輯任務(wù)，例如創(chuàng)建、隱藏、復(fù)制和刪除圖層等。

圖層類(lèi)型：1.背景圖層2.一般圖層3.圖層組復(fù)習(xí)：圖層基本概念圖層概念：我們可以把圖層想像成是一張一43圖層樣式（圖層特效）圖層樣式可以創(chuàng)建出投影、發(fā)光、浮雕、描邊等特殊效果。在圖層面板中，單擊“添加圖層樣式”按鈕或者執(zhí)行“圖層”→“圖層樣式”命令，設(shè)置圖層樣式。圖層樣式（圖層特效）圖層樣式可以創(chuàng)建出投影、發(fā)光、浮雕、描邊44圖層不透明度設(shè)置圖層不透明度設(shè)置：圖層的不透明度決定它遮蔽或顯示它的下一個(gè)圖層的程度，如果不透明度為1%的圖層顯得幾乎是透明的，而透明度為100%的圖層顯得完全不透明。演示圖層各種樣式圖層不透明度設(shè)置圖層不透明度設(shè)置：圖層的不透明度決定它遮蔽或45演示：圖層式樣實(shí)例給圖片制作邊框演示：圖層式樣實(shí)例給圖片制作邊框46說(shuō)白了就是FrontPage當(dāng)中的圖片熱區(qū)合成圖像--調(diào)整圖像大小常見(jiàn)的顏色模式有：RGB、CMYK、Lab、HSB以及灰度模式等。您可以在一個(gè)圖像中設(shè)置多個(gè)鏈接區(qū)域（名為圖像映射區(qū)域），鏈接到其他Web頁(yè)或多媒體文件。蒙版可以控制圖層區(qū)域內(nèi)部分內(nèi)容可隱藏或是顯示。不同的文件格式可以用擴(kuò)展名來(lái)區(qū)分，如PSD、JPG、GIF、PNG等。復(fù)習(xí)：Photoshop合成圖像PhotoshopCS工作界面復(fù)習(xí)：Photoshop合成圖像可運(yùn)用不同濾鏡，以產(chǎn)生一些意想不到的特效；每一幀較前一幀有輕微的變化，當(dāng)連續(xù)、快速地顯示這些幀時(shí)就創(chuàng)造出運(yùn)動(dòng)效果。路徑由定位點(diǎn)和連接定位點(diǎn)的線段(曲線)構(gòu)成；2、添加一個(gè)空白覆蓋層以PSD格式保存的圖像可以包含圖層、通道及色彩模式。如果頁(yè)面編排已準(zhǔn)備就緒，可以輸出到Web，您可以使用Photoshop和ImageReady中提供的切片工具，將頁(yè)面版式或復(fù)雜圖形劃分為多個(gè)區(qū)域，并指定獨(dú)立的壓縮設(shè)置（從而獲得較小的文件大小）。為了使人的肉眼感覺(jué)不到圖像的切換，一秒鐘至少要顯示24幀。PhotoshopCS工作界面（3）柵格化文本圖層。Photoshop顏色模式（3）蒙版是Photoshop中的一個(gè)重要概念，使用蒙版可保護(hù)部分圖層，該圖層不能被編輯。復(fù)習(xí)：Photoshop合成圖像選擇工具組面板

框選工具組套索工具組說(shuō)白了就是FrontPage當(dāng)中的圖片熱區(qū)復(fù)習(xí)：Photos47復(fù)習(xí)：Photoshop合成圖像選區(qū)的操作（1）增加選區(qū)(按住鍵盤(pán)上Shift鍵

)（2）減少選區(qū)(按住鍵盤(pán)上Alt鍵

)（3）填充選區(qū)(前景顏色填充（Alt+Delete）或背景顏色填充（Ctrl+Delete）

)（4）描邊選區(qū)（5）移動(dòng)選區(qū)（6）平滑選區(qū)（7）羽化選區(qū)（8）反向選擇復(fù)習(xí)：Photoshop合成圖像選區(qū)的操作48合成圖像實(shí)例

合成照片，效果如下圖所示

最終效果圖素材一素材二合成圖像實(shí)例合成照片，效果如下圖所示最終效果圖素材一素材49使用路徑路徑是定義和編輯圖像區(qū)域的最佳方法之一，其能用來(lái)精確定義具體區(qū)域，并保存這些結(jié)果以便以后重復(fù)使用。當(dāng)使用正確時(shí)，路徑幾乎不給文件增加額外長(zhǎng)度，并且能在文件之間共享，甚至能在文件與其他應(yīng)用程序之間共享。它是由多個(gè)節(jié)點(diǎn)的矢量線條構(gòu)成的圖像，而不是圖層的本身像素，所以路徑易于修整、重新選擇或移動(dòng)等操作，可以保存在圖像文件中，也可以單獨(dú)輸出。使用路徑路徑是定義和編輯圖像區(qū)域的最佳方法之一，其能用來(lái)精50路徑(Path)

所謂路徑(Path),在屏幕上表現(xiàn)為一些不可打印、不活動(dòng)的矢量形狀。路徑使用鋼筆工具創(chuàng)建，使用鋼筆工具的同級(jí)其它工具進(jìn)行修改。路徑由定位點(diǎn)和連接定位點(diǎn)的線段(曲線)構(gòu)成；每一個(gè)定位點(diǎn)還包含了兩個(gè)句柄，用以精確調(diào)整定位點(diǎn)及前后線段的曲度，從而匹配想要選擇的邊界。

“路徑”在PHOTOSHOP中是使用貝賽爾曲線所構(gòu)成的一段閉合或者開(kāi)放的曲線段。路徑(Path)

所謂路徑(Path),在屏幕上表現(xiàn)為一些51使用鋼筆摳圖選擇鋼筆工具,選擇目標(biāo)對(duì)象使用“路徑面板”載入選區(qū)或者（Ctrl+Enter)使用鋼筆摳圖選擇鋼筆工具,選擇目標(biāo)對(duì)象52路徑實(shí)例1路徑實(shí)例153路徑實(shí)例2--郵票制作路徑實(shí)例2--郵票制作54圖層蒙版蒙版也是Photoshop圖層中的一個(gè)重要概念，使用蒙版可保護(hù)部分圖層，該圖層不能被編輯。蒙版可以控制圖層區(qū)域內(nèi)部分內(nèi)容可隱藏或是顯示。更改蒙版可以對(duì)圖層應(yīng)用各種效果，不會(huì)影響該圖層上的圖像。最后一定要“應(yīng)用蒙版”才可以使更改生效。

圖層蒙版蒙版也是Photoshop圖層中的一個(gè)重要概念，使用55Photoshop蒙版原理Photoshop蒙板是將不同灰度色值轉(zhuǎn)化為不同的透明度，并作用到它所在的圖層，使圖層不同部位透明度產(chǎn)生相應(yīng)的變化。黑色為完全透明，白色為完全不透明。Photoshop蒙版原理Photoshop蒙板是將不同灰度56原理：只是將上面一個(gè)圖層的透明度降低,慢慢地看到下面一個(gè)圖層的顏色?！铮?）打開(kāi)待處理的圖像文件后，對(duì)需處理的部分加以選擇。將優(yōu)化結(jié)果存儲(chǔ)為：可將當(dāng)前文件保存為HTML文件格式。2．套索選擇工具可用于徒手畫(huà)的方式描繪出不規(guī)則形狀的選取區(qū)域。要試驗(yàn)不同的頁(yè)面編排或?qū)С鲰?yè)面的不同形式，請(qǐng)使用“圖層復(fù)合”調(diào)板。Photoshop保存文件過(guò)程中，有多種圖像格式可供用戶(hù)選擇，不同的格式圖像的色彩品質(zhì)、容量大小都有一程度的差異。用戶(hù)在像素大小或文檔大小中調(diào)整“寬度”和“高度”值。演示：制作漸變文字效果實(shí)例Photoshop蒙版的優(yōu)點(diǎn)在設(shè)計(jì)網(wǎng)頁(yè)過(guò)程中，文字工具可以創(chuàng)作出網(wǎng)頁(yè)標(biāo)題、導(dǎo)航文本、網(wǎng)站LOGO等項(xiàng)目。（1）圖片：一般無(wú)法分割的圖片（原圖大?。１窘坛探榻B的是目前使用最廣泛的圖形圖像設(shè)計(jì)與制作軟件Photoshop。PhotoshopCS工作界面通道實(shí)際上可以理解為是選擇區(qū)域的映射?？蛇\(yùn)用不同濾鏡，以產(chǎn)生一些意想不到的特效；PhotoshopCS工作界面蒙版可以控制圖層區(qū)域內(nèi)部分內(nèi)容可隱藏或是顯示。濾鏡只能用于當(dāng)前正在編輯的、可見(jiàn)的圖層的選定區(qū)域，如果沒(méi)有選定區(qū)域，系統(tǒng)會(huì)將整個(gè)圖像視為當(dāng)前選定區(qū)域。Photoshop蒙版原理“感受中國(guó)”頁(yè)面圖像制作步驟如下：Photoshop蒙版的優(yōu)點(diǎn)1.修改方便，不會(huì)因?yàn)槭褂孟鹌げ粱蚣羟袆h除而造成不可返回的遺憾;2.可運(yùn)用不同濾鏡，以產(chǎn)生一些意想不到的特效；3.任何一張灰度圖都可用來(lái)用為蒙板。

原理：只是將上面一個(gè)圖層的透明度降低,慢慢地看到下面一個(gè)圖層57Photoshop蒙版的主要作用1.摳圖；2.做圖的邊緣淡化效果；3.圖層間的溶合。按住Ctrl鍵—載入選區(qū)按住Alt鍵—切換到蒙版Photoshop蒙版的主要作用1.摳圖；58蒙版實(shí)例蒙版實(shí)例59綜合實(shí)例—海報(bào)設(shè)計(jì)綜合實(shí)例—海報(bào)設(shè)計(jì)60綜合實(shí)例—金屬文字制作綜合實(shí)例—金屬文字制作61內(nèi)容概要（3）通道

2濾鏡3特效文字4蒙版1網(wǎng)頁(yè)效果設(shè)計(jì)5切片、導(dǎo)出6內(nèi)容概要（3）通道2濾鏡3特效文字4蒙版1網(wǎng)頁(yè)效果設(shè)計(jì)5切62圖層蒙版蒙版是Photoshop中的一個(gè)重要概念，使用蒙版可保護(hù)部分圖層，該圖層不能被編輯。蒙版可以控制圖層區(qū)域內(nèi)部分內(nèi)容可隱藏或是顯示。更改蒙版可以對(duì)圖層應(yīng)用各種效果，不會(huì)影響該圖層上的圖像。圖層蒙版蒙版是Photoshop中的一個(gè)重要概念，使用蒙版可63Photoshop蒙版原理Photoshop蒙板是將不同灰度色值轉(zhuǎn)化為不同的透明度，并作用到它所在的圖層，使圖層不同部位透明度產(chǎn)生相應(yīng)的變化。黑色為完全透明，白色為完全不透明。Photoshop蒙版原理Photoshop蒙板是將不同灰度64Photoshop蒙版的主要作用1.摳圖2.做圖的邊緣淡化效果3.圖層間的溶合Photoshop蒙版的主要作用1.摳圖65蒙版實(shí)例蒙版實(shí)例66通道的概念通道這一概念在Photoshop中是非常獨(dú)特的，它不象層那樣容易上手，其中的奧妙也要遠(yuǎn)遠(yuǎn)多于層等。它是基于色彩模式這一基礎(chǔ)上衍生出的簡(jiǎn)化操作工具。譬如說(shuō)，一幅RGB三原色圖有三個(gè)默認(rèn)通道：Red（紅）、Green（綠）、Blue（藍(lán)）。但如果是一幅CMYK圖像，就有了四個(gè)默認(rèn)通道：Cyan（藍(lán)綠）、Magenta（紫紅）、Yellow（黃）、Black（黑）。由此看出，每一個(gè)通道其實(shí)就是一幅圖像中的某一種基本顏色的單獨(dú)通道。也就是說(shuō)，通道是利用圖像的色彩值進(jìn)行圖像的修改的，我們可以把通道看作攝像機(jī)的中的濾光鏡。通道的概念通道這一概念在Photoshop中是非常獨(dú)特的，它67通道的效果通道的效果68通道與圖層的區(qū)別一個(gè)通道層同一個(gè)圖像層之間最根本的區(qū)別在于：圖層的各個(gè)象素點(diǎn)的屬性是以紅綠藍(lán)三原色的數(shù)值來(lái)表示的，而通道層中的象素顏色是由一組原色的亮度值組成的。再說(shuō)通俗點(diǎn)：通道中只有一種顏色的不同亮度，是一種灰度圖像。通道實(shí)際上可以理解為是選擇區(qū)域的映射。

通道與圖層的區(qū)別一個(gè)通道層同一個(gè)圖像層之間最根本的區(qū)別在于：69通道摳圖范例通道摳圖范例70濾鏡概述在主單菜單上單擊“濾鏡”命令，將打開(kāi)濾鏡菜單，其分為4個(gè)部分。頂部為最后一次使用過(guò)的濾鏡；中間分別是PhotoshopCS版新增濾鏡老版中的13類(lèi)濾鏡；底部為外掛濾鏡，只有安裝了外掛式濾鏡之后，才會(huì)顯示在其菜單中。通過(guò)使用濾鏡，可以為圖像加入各種特效，讓平談無(wú)奇的圖片出現(xiàn)神奇的效果。濾鏡概述在主單菜單上單擊“濾鏡”命令，將打開(kāi)濾鏡菜單，其分為71濾鏡使用說(shuō)明濾鏡只能用于當(dāng)前正在編輯的、可見(jiàn)的圖層的選定區(qū)域，如果沒(méi)有選定區(qū)域，系統(tǒng)會(huì)將整個(gè)圖像視為當(dāng)前選定區(qū)域。濾鏡以像素為單位進(jìn)行處理，濾鏡的處理效果與圖像的分辨率有關(guān)。濾鏡不能應(yīng)用于索引模式和16位通道模式。濾鏡使用說(shuō)明濾鏡只能用于當(dāng)前正在編輯的、可見(jiàn)的圖層的選定區(qū)域72濾鏡的基本操作在PhotoshopCS中盡管有風(fēng)格各異、用途不同的濾鏡，但它們通常的使用步驟如下：★（1）打開(kāi)待處理的圖像文件后，對(duì)需處理的部分加以選擇?！铮?）從“濾鏡”菜單中選取相應(yīng)的濾鏡組，并選擇其下一級(jí)子菜單中的一個(gè)濾鏡。★（3）然后在對(duì)話(huà)框中設(shè)置相應(yīng)的參數(shù)后，點(diǎn)“好”按鈕即可。在點(diǎn)擊“好”按鈕后，系統(tǒng)將濾鏡效果應(yīng)用于圖像，這將花費(fèi)一些時(shí)間，如要中斷濾鏡的應(yīng)用，按下鍵盤(pán)上Esc鍵。濾鏡的基本操作在PhotoshopCS中盡管有風(fēng)格各異、用73濾鏡效果實(shí)例--閃電制作閃電，效果如下圖所示

濾鏡效果實(shí)例--閃電制作閃電，效果如下圖所示74閃電制作方法1、從工作區(qū)右上角向工作區(qū)左下角的漸變2、執(zhí)行“濾鏡”→“渲染”→“分層云彩”命令3、執(zhí)行“圖像”→“調(diào)整”→“曲線調(diào)整”命令，調(diào)整亮度4、執(zhí)行“圖像”→“反相”命令5、執(zhí)行“圖像”→“調(diào)整”→“亮度/對(duì)比度”命令6、執(zhí)行“圖像”→“調(diào)整”→“色相/飽和度”命令閃電制作方法1、從工作區(qū)右上角向工作區(qū)左下角的漸變75濾鏡效果實(shí)例--扭曲文字扭曲文字，效果如下圖所示

要點(diǎn)提示：對(duì)柵格后的文本進(jìn)行旋轉(zhuǎn)扭曲操作濾鏡效果實(shí)例--扭曲文字扭曲文字，效果如下圖所示要點(diǎn)提示：762、添加一個(gè)空白覆蓋層圖層面板：圖層面板上顯示了圖像中的所有圖層、圖層組和圖層效果，我們可以使用圖層面板上的各種功能來(lái)完成一些圖像編輯任務(wù)，例如創(chuàng)建、隱藏、復(fù)制和刪除圖層等。例如，72dpi表示圖像中每英寸包含72個(gè)像素或點(diǎn)。若勾選對(duì)話(huà)框底部的“約束比例”復(fù)選框，會(huì)在寬度和高度間建立等比例效果。復(fù)習(xí)：Photoshop合成圖像Photoshop蒙板是將不同灰度色值轉(zhuǎn)化為不同的透明度，并作用到它所在的圖層，使圖層不同部位透明度產(chǎn)生相應(yīng)的變化。Photoshop蒙版原理Photoshop顏色模式（2）路徑由定位點(diǎn)和連接定位點(diǎn)的線段(曲線)構(gòu)成；可運(yùn)用不同濾鏡，以產(chǎn)生一些意想不到的特效；中文版PhotoshopCS提供的選取工具分為兩大類(lèi)，一類(lèi)是規(guī)則選取工具也稱(chēng)為框選工具，另一類(lèi)是建立不規(guī)則選區(qū)的工具也稱(chēng)為套索類(lèi)工具?！铮?）打開(kāi)待處理的圖像文件后，對(duì)需處理的部分加以選擇。Photoshop:窗口->工作區(qū)->復(fù)位調(diào)板位置黑色為完全透明，白色為完全不透明。在圖層面板中，單擊“添加圖層樣式”按鈕或者執(zhí)行“圖層”→“圖層樣式”命令，設(shè)置圖層樣式。BMP圖像文件格式是一種標(biāo)準(zhǔn)的點(diǎn)陣式圖像格式，支持RGB、灰度和位圖色彩模式，但不支持Alpha通道。蒙版可以控制圖層區(qū)域內(nèi)部分內(nèi)容可隱藏或是顯示。替換頁(yè)面上其他位置的圖層內(nèi)容。閃爍的星光效果，如下圖所示。路徑是定義和編輯圖像區(qū)域的最佳方法之一，其能用來(lái)精確定義具體區(qū)域，并保存這些結(jié)果以便以后重復(fù)使用。濾鏡效果實(shí)例--火焰字制作火焰字，效果如圖下圖所示

2、添加一個(gè)空白覆蓋層濾鏡效果實(shí)例--火焰字制作火焰字，效果77火焰字制作方法1、新建圖片，并色彩模式設(shè)置為“灰度模式”2、輸入文字，然后柵格化“火焰字”文字圖層，并且復(fù)制該圖層3、選擇“火焰字”副本圖層，執(zhí)行“濾鏡”→“模糊”→“高斯模糊”命令，半徑為24、執(zhí)行“濾鏡”→“風(fēng)格化”→“風(fēng)”命令5、選擇火苗區(qū)域（按住鍵盤(pán)上Ctrl鍵和Alt鍵）6、執(zhí)行“濾鏡”→“扭曲”→“波紋”命令7、執(zhí)行“圖像”→“模式”→“索引顏色”命令8、執(zhí)行“圖像”→“模式”→“顏色表”命令火焰字制作方法1、新建圖片，并色彩模式設(shè)置為“灰度模式”78濾鏡效果實(shí)例—發(fā)光文字使用“徑向模糊”濾鏡功能制作“秀我風(fēng)采”文字的噴發(fā)光芒效果，效果如圖：濾鏡效果實(shí)例—發(fā)光文字使用“徑向模糊”濾鏡功能制作“秀我風(fēng)79網(wǎng)頁(yè)效果設(shè)計(jì)在網(wǎng)站設(shè)計(jì)與制作過(guò)程當(dāng)中，經(jīng)常先使用Photoshop制作網(wǎng)頁(yè)的可視化效果。在完成頁(yè)面效果的制作之后，使用切片工具制作網(wǎng)頁(yè)所需要的素材。網(wǎng)頁(yè)效果設(shè)計(jì)在網(wǎng)站設(shè)計(jì)與制作過(guò)程當(dāng)中，經(jīng)常先使用Photos80網(wǎng)頁(yè)效果設(shè)計(jì)實(shí)例（1）網(wǎng)站首頁(yè)圖片的設(shè)計(jì)網(wǎng)頁(yè)效果設(shè)計(jì)實(shí)例（1）網(wǎng)站首頁(yè)圖片的設(shè)計(jì)81網(wǎng)頁(yè)效果設(shè)計(jì)實(shí)例（2）網(wǎng)站首頁(yè)圖片的設(shè)計(jì)網(wǎng)頁(yè)效果設(shè)計(jì)實(shí)例（2）網(wǎng)站首頁(yè)圖片的設(shè)計(jì)82網(wǎng)頁(yè)切片切片目的：盡可能小的減少網(wǎng)頁(yè)文件的體積切片網(wǎng)頁(yè)圖片分為：（1）圖片：一般無(wú)法分割的圖片（原圖大小）。（2）背景色：通過(guò)網(wǎng)頁(yè)代碼可以實(shí)現(xiàn)的顏色。（3）背景圖案：一般體積很小，通常用于填充網(wǎng)頁(yè)和表格。網(wǎng)頁(yè)切片切片目的：盡可能小的減少網(wǎng)頁(yè)文件的體積83切片切片是圖像的一塊矩形區(qū)域。通過(guò)將圖像劃分為切片，將能夠更好地控制圖像的功能和文件大小?？梢允褂们衅瑢⒃磮D像分成許多的功能區(qū)域。在您存儲(chǔ)圖像和HTML文件時(shí)，每個(gè)切片都會(huì)作為獨(dú)立文件存儲(chǔ)，并具有其自己的設(shè)置和顏色調(diào)板，而且會(huì)保留正確的鏈接、翻轉(zhuǎn)效果以及動(dòng)畫(huà)效果。切片切片是圖像的一塊矩形區(qū)域。通過(guò)將圖像劃分為切片，將能84圖像切片實(shí)例圖像切片實(shí)例85內(nèi)容概要（4）ImageReadyCS介紹1動(dòng)畫(huà)圖片制作(實(shí)例)2設(shè)計(jì)Web頁(yè)3內(nèi)容概要（4）ImageReadyCS介紹1動(dòng)畫(huà)圖片制作86ImageReadyCSImageReady是集成在AdobePhotoshop中的一個(gè)應(yīng)用程序，是一個(gè)網(wǎng)頁(yè)GIF動(dòng)畫(huà)編輯工具。ImageReady功能簡(jiǎn)單易學(xué)，其卓越的網(wǎng)絡(luò)圖像處理制作能力和動(dòng)畫(huà)制作能力受到大都用戶(hù)的喜愛(ài)。ImageReadyCSImageReady是集成在Ado87認(rèn)識(shí)ImageReadyCS認(rèn)識(shí)ImageReadyCS

要啟動(dòng)ImageReadyCS，在Photoshop中執(zhí)行“文件”→“在ImageReadyCS中進(jìn)行編輯”命令，或者單擊工具箱下端的按鈕，系統(tǒng)彈出ImageReadyCS工作界面。

ImageReadyCS是Photoshop家庭成員，其工作界面和Photoshop非常相似，各種工具、控制面板、瀏覽窗口都一樣，ImageReadyCS只多了一項(xiàng)動(dòng)畫(huà)控制面板。

認(rèn)識(shí)ImageReadyCS認(rèn)識(shí)ImageReadyCS88ImageReady界面動(dòng)畫(huà)調(diào)板ImageReady界面動(dòng)畫(huà)調(diào)板89小技巧恢復(fù)默認(rèn)界面Photoshop:窗口->工作區(qū)->復(fù)位調(diào)板位置ImageReady:窗口->工作區(qū)->默認(rèn)調(diào)板位置小技巧恢復(fù)默認(rèn)界面90ImageReady工具箱ImageReady工具箱91ImageReady專(zhuān)有工具ImageReady專(zhuān)有工具92ImageReady中的圖像映射圖像映射將圖像區(qū)域鏈接到URL。您可以在一個(gè)圖像中設(shè)置多個(gè)鏈接區(qū)域（名為圖像映射區(qū)域），鏈接到其他Web頁(yè)或多媒體文件。

說(shuō)白了就是FrontPage當(dāng)中的圖片熱區(qū)ImageReady中的圖像映射圖像映射將圖像區(qū)域鏈接到U93網(wǎng)頁(yè)切片切片目的：盡可能小的減少網(wǎng)頁(yè)文件的體積切片網(wǎng)頁(yè)圖片分為：（1）圖片：一般無(wú)法分割的圖片（原圖大?。?。（2）背景色：通過(guò)網(wǎng)頁(yè)代碼可以實(shí)現(xiàn)的顏色。（3）背景圖案：一般體積很小，通常用于填充網(wǎng)頁(yè)和表格。網(wǎng)頁(yè)切片切片目的：盡可能小的減少網(wǎng)頁(yè)文件的體積94切片切片是圖像的一塊矩形區(qū)域。通過(guò)將圖像劃分為切片，將能夠更好地控制圖像的功能和文件大小?？梢允褂们衅瑢⒃磮D像分成許多的功能區(qū)域。在您存儲(chǔ)圖像和HTML文件時(shí)，每個(gè)切片都會(huì)作為獨(dú)立文件存儲(chǔ)，并具有其自己的設(shè)置和顏色調(diào)板，而且會(huì)保留正確的鏈接、翻轉(zhuǎn)效果以及動(dòng)畫(huà)效果。切片切片是圖像的一塊矩形區(qū)域。通過(guò)將圖像劃分為切片，將能95使用動(dòng)畫(huà)控制面板使用動(dòng)畫(huà)控制面板

使用動(dòng)畫(huà)控制面板使用動(dòng)畫(huà)控制面板96動(dòng)畫(huà)原理動(dòng)畫(huà)原理

“動(dòng)畫(huà)”就是多幅圖像按一定的先后次序，在設(shè)定的時(shí)間內(nèi)依次顯示。在動(dòng)畫(huà)制作過(guò)程中將其中一幅圖像稱(chēng)作“幀”，動(dòng)畫(huà)就是由這樣多幀圖像組成。每一幀較前一幀有輕微的變化，當(dāng)連續(xù)、快速地顯示這些幀時(shí)就創(chuàng)造出運(yùn)動(dòng)效果。為了使人的肉眼感覺(jué)不到圖像的切換，一秒鐘至少要顯示24幀。在ImageReadyCS中，處理圖層是創(chuàng)建動(dòng)畫(huà)的基礎(chǔ)。通過(guò)將動(dòng)畫(huà)的每一幀置于其自身所在的圖層上，在不同的幀上顯示不同的圖層就可完成動(dòng)畫(huà)的創(chuàng)作。

動(dòng)畫(huà)原理動(dòng)畫(huà)原理97動(dòng)畫(huà)效果實(shí)例（1）逐幀顯示文字，效果如下圖所示。動(dòng)畫(huà)效果描述：實(shí)現(xiàn)“歡迎您來(lái)到我的個(gè)人網(wǎng)站”文字內(nèi)容，從左到右逐字顯示效果。動(dòng)畫(huà)效果實(shí)例（1）逐幀顯示文字，效果如下圖所示。動(dòng)畫(huà)效果描述98關(guān)鍵步驟1、輸入文字2、添加一個(gè)空白覆蓋層3、創(chuàng)建10幀4、取消選擇（取消虛線框）5、選擇每一幀中的空白覆蓋層移動(dòng)一下位置6、設(shè)置延時(shí)0.2秒關(guān)鍵步驟1、輸入文字99保存文件為GIF等在ImageReadyCS軟件中，文件有以下幾種保存方式。存儲(chǔ)：保存ImageReady自身文件格式，擴(kuò)展名為PSD文件。存儲(chǔ)為：將已經(jīng)保存過(guò)的文件改名存儲(chǔ)，或者改變文件存儲(chǔ)位置。將優(yōu)化結(jié)果存儲(chǔ)為：可將當(dāng)前文件保存為HTML文件格式。導(dǎo)出：可以導(dǎo)出GIF、SWF動(dòng)畫(huà)文件。保存文件為GIF等100動(dòng)畫(huà)效果實(shí)例（2）閃爍的星光效果，如下圖所示。動(dòng)畫(huà)效果描述：實(shí)現(xiàn)星光閃爍效果。動(dòng)畫(huà)效果實(shí)例（2）閃爍的星光效果，如下圖所示。動(dòng)畫(huà)效果描述：101關(guān)鍵步驟1、打開(kāi)圖片，創(chuàng)建2個(gè)空層2、在圖層1當(dāng)中添加星（畫(huà)筆工具，在工具欄當(dāng)中載入“混合畫(huà)筆”，選25）--不變的星星3、在圖層2當(dāng)中畫(huà)星—會(huì)閃的星星4、創(chuàng)建新幀5、選擇第1幀隱藏圖層2（有星星的圖層），選擇第2幀隱藏圖層3（空白層，沒(méi)星星的）6、設(shè)置播放時(shí)間0.1秒關(guān)鍵步驟1、打開(kāi)圖片，創(chuàng)建2個(gè)空層102動(dòng)畫(huà)實(shí)例—文字顏色漸變實(shí)現(xiàn)文字從一種顏色漸漸的變成另一種顏色原理：只是將上面一個(gè)圖層的透明度降低,慢慢地看到下面一個(gè)圖層的顏色。動(dòng)畫(huà)實(shí)例—文字顏色漸變實(shí)現(xiàn)文字從一種顏色漸漸的變成另一種顏色103關(guān)鍵步驟1、輸入文字，設(shè)置顏色（如：黃色）2、復(fù)制文字圖層，修改文字顏色（如：綠色）3、打開(kāi)”動(dòng)畫(huà)“調(diào)板，創(chuàng)建新幀4、選擇新創(chuàng)建的幀，修改文字副本圖層的透明度為05、選擇第1幀，單擊”過(guò)渡“實(shí)現(xiàn)過(guò)渡效果的創(chuàng)建關(guān)鍵步驟1、輸入文字，設(shè)置顏色（如：黃色）104設(shè)計(jì)Web頁(yè)P(yáng)hotoshop和ImageReady中的圖形工具和功能簡(jiǎn)化了大多數(shù)Web設(shè)計(jì)任務(wù)。使用Photoshop和ImageReady進(jìn)行Web頁(yè)（網(wǎng)頁(yè)）的設(shè)計(jì)類(lèi)似于建筑師繪制建筑的效果圖。網(wǎng)頁(yè)設(shè)計(jì)員類(lèi)似于建筑工人，他們制作的網(wǎng)頁(yè)就需要達(dá)到效果圖所需要的效果。設(shè)計(jì)Web頁(yè)P(yáng)hotoshop和ImageReady中105設(shè)計(jì)Web頁(yè)--頁(yè)面設(shè)計(jì)在ImageReady中，針對(duì)頁(yè)面和橫幅、網(wǎng)格、導(dǎo)向線和智能參考線的預(yù)設(shè)文檔大小簡(jiǎn)化了頁(yè)面版式。在Photoshop和ImageReady中，都可以使用文本、繪圖和繪畫(huà)工具向版面中添加內(nèi)容。在ImageReady中，可以使用圖層、圖層組和編組的圖層來(lái)排列和對(duì)齊內(nèi)容。要試驗(yàn)不同的頁(yè)面編排或?qū)С鲰?yè)面的不同形式，請(qǐng)使用“圖層復(fù)合”調(diào)板。設(shè)計(jì)Web頁(yè)--頁(yè)面設(shè)計(jì)在ImageReady中，針對(duì)頁(yè)106設(shè)計(jì)Web頁(yè)--切片如果頁(yè)面編排已準(zhǔn)備就緒，可以輸出到Web，您可以使用Photoshop和ImageReady中提供的切片工具，將頁(yè)面版式或復(fù)雜圖形劃分為多個(gè)區(qū)域，并指定獨(dú)立的壓縮設(shè)置（從而獲得較小的文件大?。ＴO(shè)計(jì)Web頁(yè)--切片如果頁(yè)面編排已準(zhǔn)備就緒，可以輸出到W107設(shè)計(jì)Web頁(yè)--翻轉(zhuǎn)可以使用ImageReady中的“Web內(nèi)容”調(diào)板來(lái)跟蹤切片及其翻轉(zhuǎn)狀態(tài)。例如，您可以針對(duì)某個(gè)Web頁(yè)創(chuàng)建這樣一個(gè)按鈕：只要用戶(hù)將指針?lè)胖迷谠摪粹o上，該按鈕就會(huì)發(fā)光。并且，您可以管理按鈕的狀態(tài)以及這些狀態(tài)中的活動(dòng)。設(shè)計(jì)Web頁(yè)--翻轉(zhuǎn)可以使用ImageReady中的“W108Web內(nèi)容調(diào)板(ImageReady)Web內(nèi)容”調(diào)板使您能夠創(chuàng)建和查看圖像中的翻轉(zhuǎn)狀態(tài)以及設(shè)置其選項(xiàng)。除了翻轉(zhuǎn)狀態(tài)之外，“Web內(nèi)容”調(diào)板還能夠顯示切片、圖像映射和動(dòng)畫(huà)幀。顯示切片和圖像映射可幫助您跟蹤圖像中包含翻轉(zhuǎn)效果的各個(gè)圖素。顯示動(dòng)畫(huà)幀可以很方便地查看圖像的哪些狀態(tài)包含動(dòng)畫(huà)。Web內(nèi)容調(diào)板(ImageReady)Web內(nèi)容”調(diào)板109Web內(nèi)容調(diào)板界面Web內(nèi)容調(diào)板界面110翻轉(zhuǎn)(ImageReady)翻轉(zhuǎn)是Web頁(yè)上的按鈕或圖像，當(dāng)查看者將指針移到其上面或者點(diǎn)按它時(shí)，頁(yè)面就會(huì)發(fā)生變化。按鈕本身可能會(huì)發(fā)生變化，或者頁(yè)面上可能會(huì)出現(xiàn)另一個(gè)項(xiàng)目（如一幅照片或菜單項(xiàng)列表）。遠(yuǎn)程翻轉(zhuǎn)觸發(fā)被翻轉(zhuǎn)的按鈕或圖像以外的Web頁(yè)圖素發(fā)生變化。翻轉(zhuǎn)(ImageReady)翻轉(zhuǎn)是Web頁(yè)上的按鈕或111創(chuàng)建翻轉(zhuǎn)要?jiǎng)?chuàng)建翻轉(zhuǎn)，請(qǐng)將翻轉(zhuǎn)圖像定義為基于圖層的切片或基于圖層的圖像映射。然后，使用ImageReady中的“Web內(nèi)容”調(diào)板和“圖層”調(diào)板，執(zhí)行以下任何操作來(lái)創(chuàng)建不同版本的圖形：添加或更改圖層樣式或移動(dòng)圖層內(nèi)容來(lái)修改圖層內(nèi)容。使用新圖層替換圖像內(nèi)容。替換頁(yè)面上其他位置的圖層內(nèi)容。添加幀以創(chuàng)建翻轉(zhuǎn)動(dòng)畫(huà)。創(chuàng)建翻轉(zhuǎn)要?jiǎng)?chuàng)建翻轉(zhuǎn)，請(qǐng)將翻轉(zhuǎn)圖像定義為基于圖層的切片或基于圖112翻轉(zhuǎn)實(shí)例—按鈕注意事項(xiàng)：

1、在制作翻轉(zhuǎn)按鈕的時(shí)候最好先完成所有效果的設(shè)計(jì)

2、每個(gè)翻轉(zhuǎn)狀態(tài)所看到的效果包括了當(dāng)前圖層調(diào)板當(dāng)中所看到的效果翻轉(zhuǎn)實(shí)例—按鈕113設(shè)計(jì)Web頁(yè)--動(dòng)畫(huà)在Photoshop和ImageReady中，您都可以使用“動(dòng)畫(huà)”調(diào)板來(lái)創(chuàng)建簡(jiǎn)單的Web動(dòng)畫(huà)?？梢允褂么苏{(diào)板來(lái)逐幀確定動(dòng)畫(huà)的外觀。您可以從Photoshop中將動(dòng)畫(huà)導(dǎo)出為動(dòng)畫(huà)GIF，也可以從ImageReady中將動(dòng)畫(huà)導(dǎo)出為動(dòng)畫(huà)GIF或SWF文件。在ImageReady中，您可以結(jié)合切片組、嵌套表、百分比寬度表以及遠(yuǎn)程翻轉(zhuǎn)（將鼠標(biāo)移到某幅圖像上時(shí)，另一幅圖像發(fā)生變化）來(lái)創(chuàng)建動(dòng)畫(huà)。設(shè)計(jì)Web頁(yè)--動(dòng)畫(huà)在Photoshop和ImageR114設(shè)計(jì)Web頁(yè)--導(dǎo)出和圖像優(yōu)化當(dāng)頁(yè)面或圖形已準(zhǔn)備就緒可用于最后的導(dǎo)出時(shí)，可以使用“存儲(chǔ)為Web所用格式”對(duì)話(huà)框(Photoshop)和“優(yōu)化”調(diào)板(ImageReady)來(lái)精確指定應(yīng)如何導(dǎo)出頁(yè)面或圖形。設(shè)計(jì)Web頁(yè)--導(dǎo)出和圖像優(yōu)化當(dāng)頁(yè)面或圖形已準(zhǔn)備就緒可用于最115為什么要優(yōu)化圖像？在進(jìn)行網(wǎng)頁(yè)創(chuàng)建和利用網(wǎng)絡(luò)傳送圖像時(shí)，要在保證一定質(zhì)量、顯示效果的同時(shí)盡可能減小圖像文件的大小。當(dāng)前常見(jiàn)的Web圖像格式有三種：JPG格式、GIF格式、PNG格式。為什么要優(yōu)化圖像？在進(jìn)行網(wǎng)頁(yè)創(chuàng)建和利用網(wǎng)絡(luò)傳送圖像時(shí)，要在116是JPG還是GIF?圖像在網(wǎng)絡(luò)中的使用，大多采用JPG和GIF格式，什么時(shí)候用JPG，何時(shí)又用GIF格式呢？對(duì)圖像的優(yōu)化從很大程度上是對(duì)于圖像的顏色進(jìn)行優(yōu)化，而構(gòu)成一幅圖像的色調(diào)有兩種情況，連續(xù)色調(diào)和非連續(xù)色調(diào)。從各種情況下壓縮測(cè)試的效果來(lái)看，對(duì)于連續(xù)色調(diào)的圖像最好使用JPG格式進(jìn)行壓縮，而對(duì)于不連續(xù)色調(diào)的圖像最好使用GIF格式進(jìn)行壓縮，以使圖像質(zhì)量和圖像大小有一個(gè)最佳的平衡點(diǎn)。是JPG還是GIF?圖像在網(wǎng)絡(luò)中的使用，大多采用JPG和117PhotoshopCS工作界面PhotoshopCS工作界面118圖層管理

1.選擇圖層

2.隱藏、顯示圖層內(nèi)容

3.更改圖層順序

4.鏈接圖層

5.調(diào)整圖層內(nèi)容（對(duì)齊、分布）

6.鎖定圖層

7.從圖層取樣圖層管理1.選擇圖層119合成圖像--調(diào)整圖像大小改變當(dāng)前編輯的圖像大小，其常用方法是“圖像”→“圖像大小”命令，打開(kāi)如下圖所示的對(duì)話(huà)框。用戶(hù)在像素大小或文檔大小中調(diào)整“寬度”和“高度”值。若勾選對(duì)話(huà)框底部的“約束比例”復(fù)選框，會(huì)在寬度和高度間建立等比例效果。單擊“好”按鈕后，圖像將按新的寬度和高度對(duì)整個(gè)圖像進(jìn)行縮放，從而改變圖像的尺寸大小。

合成圖像--調(diào)整圖像大小改變當(dāng)前編輯的圖像大小，其常用方法是120Photoshop蒙版原理Photoshop蒙板是將不同灰度色值轉(zhuǎn)化為不同的透明度，并作用到它所在的圖層，使圖層不同部位透明度產(chǎn)生相應(yīng)的變化。黑色為完全透明，白色為完全不透明。Photoshop蒙版原理Photoshop蒙板是將不同灰度121蒙版實(shí)例蒙版實(shí)例122通道摳圖范例通道摳圖范例123ImageReady專(zhuān)有工具ImageReady專(zhuān)有工具124保存文件為GIF等在ImageReadyCS軟件中，文件有以下幾種保存方式。存儲(chǔ)：保存ImageReady自身文件格式，擴(kuò)展名為PSD文件。存儲(chǔ)為：將已經(jīng)保存過(guò)的文件改名存儲(chǔ)，或者改變文件存儲(chǔ)位置。將優(yōu)化結(jié)果存儲(chǔ)為：可將當(dāng)前文件保存為HTML文件格式。導(dǎo)出：可以導(dǎo)出GIF、SWF動(dòng)畫(huà)文件。保存文件為GIF等125一、網(wǎng)頁(yè)圖像處理概述網(wǎng)頁(yè)的設(shè)計(jì)少不了對(duì)圖形圖像的制作和處理。圖形圖像設(shè)計(jì)與處理軟件層出不窮，如Adobe公司推出的Photoshop、Firework軟件、Corel公司推出的CorelDRAW等。本教程介紹的是目前使用最廣泛的圖形圖像設(shè)計(jì)與制作軟件Photoshop。一、網(wǎng)頁(yè)圖像處理概述網(wǎng)頁(yè)的設(shè)計(jì)少不了對(duì)圖形圖像的制作和處理。126位圖與矢量圖

1．位圖位圖也稱(chēng)為點(diǎn)陣圖或像素圖，計(jì)算機(jī)屏幕上的圖像是由屏幕上的發(fā)光點(diǎn)構(gòu)成的，每個(gè)點(diǎn)用二進(jìn)制數(shù)據(jù)來(lái)描述其顏色與亮度等信息，這些點(diǎn)是離散的，類(lèi)似于矩陣。多個(gè)像素的色彩組合就形成了圖像，稱(chēng)之為位圖。2．矢量圖矢量圖也稱(chēng)為向量圖，是用一系列計(jì)算機(jī)指令來(lái)描述和記錄的一幅圖，一幅圖可分解為一系列由點(diǎn)、線、面等組成的子圖，矢量圖記錄的是對(duì)象的幾何形狀、線條粗細(xì)和色彩等，因此生成的文件存儲(chǔ)容量很小。

位圖與矢量圖127圖像分辨率分辨率是指單位長(zhǎng)度上像素的多少，單位長(zhǎng)度上像素越多，圖像就越清晰。例如，72dpi表示圖像中每英寸包含72個(gè)像素或點(diǎn)。位圖矢量圖圖像分辨率分辨率是指單位長(zhǎng)度上像素的多少，單位長(zhǎng)度上像128PhotoshopCS工作界面PhotoshopCS工作界面129PhotoshopCS工作界面PhotoshopCS的窗口是由標(biāo)題欄、菜單欄、工具選項(xiàng)欄、工具箱、工作區(qū)和控制面板6大部分組成。（1）標(biāo)題欄（2）菜單欄（3）工具選項(xiàng)欄PhotoshopCS工作界面PhotoshopCS130PhotoshopCS工作界面（4）工具箱：Photoshop軟件的所有工具（繪圖、選擇工具、調(diào)整工具等）都置于工具箱中，用戶(hù)需要使用什么工具，只要在工具箱中選擇即可。（5）控制面板：控制面板是Photoshop軟件中非常重要的輔助作圖工具，其總是浮動(dòng)在活動(dòng)窗口中最前面，供用戶(hù)隨時(shí)訪問(wèn)。（6）工作區(qū)：工作區(qū)是圖像編輯區(qū)，顯示了當(dāng)前正在編輯的圖像內(nèi)容。PhotoshopCS工作界面（4）工具箱：Photosh131Photoshop工具箱工具箱上的工具大致分為以下四大類(lèi)：（1）選項(xiàng)區(qū)工具。包括選區(qū)工具組、套索工具組、魔術(shù)棒工具。（2）繪制工具。包括畫(huà)筆工具組、歷史畫(huà)筆工具組、橡皮擦工具組、漸變工具組、吸管工具。（3）編輯工具。包括印章工具組、亮化工具組、模糊工具組、鋼筆工具組。（4）輔助工具。包括移動(dòng)工具、裁剪工具、手形工具、縮放工具、注釋工具組等。Photoshop工具箱工具箱上的工具大致分為以下四大類(lèi)：132圖層控制面板圖層控制面板如下圖所示，主要用來(lái)對(duì)圖層進(jìn)行管理和操作，包括添加圖層、刪除圖層、合并圖層等。圖層控制面板圖層控制面板如下圖所示，主要用來(lái)對(duì)圖層進(jìn)行管理和133圖層基本概念圖層概念：我們可以把圖層想像成是一張一張疊起來(lái)的透明膠片，每張透明膠片上都有不同的畫(huà)面，改變圖層的順序和屬性可以改變圖像的最后效果。通過(guò)對(duì)圖層的操作，使用它的特殊功能可以創(chuàng)建很多復(fù)雜的圖像效果。圖層面板：圖層面板上顯示了圖像中的所有圖層、圖層組和圖層效果，我們可以使用圖層面板上的各種功能來(lái)完成一些圖像編輯任務(wù)，例如創(chuàng)建、隱藏、復(fù)制和刪除圖層等。

圖層類(lèi)型：1.背景圖層2.一般圖層3.圖層組圖層基本概念圖層概念：我們可以把圖層想像成是一張一張疊起134圖層操作1.新建圖層2.復(fù)制圖層3.顏色標(biāo)識(shí)4.刪格化圖層5.合并圖層6.蓋印圖層7.圖層疊加模式圖層操作1.新建圖層135圖層管理

1.選擇圖層

2.隱藏、顯示圖層內(nèi)容

3.更改圖層順序

4.鏈接圖層

5.調(diào)整圖層內(nèi)容（對(duì)齊、分布）

6.鎖定圖層

7.從圖層取樣圖層管理1.選擇圖層136Photoshop顏色模式（1）常見(jiàn)的顏色模式有：RGB、CMYK、Lab、HSB以及灰度模式等。1．RGB模式RGB模式是在Photoshop中處理圖像時(shí)接觸最多的顏色模式，RGB顏色是由紅、綠、藍(lán)三原色構(gòu)成。2．CMYK模式CMYK顏色模式是一種專(zhuān)門(mén)用來(lái)印刷的顏色，CMYK顏色是由青色、品紅、黃色、黑色四種印刷顏色組成。

Photoshop顏色模式（1）常見(jiàn)的顏色模式有：RGB、C137Photoshop顏色模式（2）3．灰度模式灰度模式采用了256級(jí)不同強(qiáng)度的灰度來(lái)描述圖像。其值為0%時(shí)，表示為黑色，值為100%時(shí)，表示為白色。

4．Lab模式Lab模式是國(guó)際照明委員會(huì)（CIE）于1976年公布的一種色彩模式。L表示亮度，范圍在0~100之間。a和b則表示顏色過(guò)渡的變化值。

Photoshop顏色模式（2）3．灰度模式138Photoshop顏色模式（3）5．HSB模式HSB模式是一種可以調(diào)整圖像顏色效果的色彩值，Photoshop圖像不能直接保存為HSB模式，執(zhí)行“圖像”→“調(diào)整”→“色相/飽和度”命令后，才能對(duì)圖像進(jìn)行HSB模式調(diào)整。

6．Bitmap模式Bitmap模式又稱(chēng)為位圖模式，它是使用黑、白兩種顏色來(lái)描述圖像的一種方式，因?yàn)槲恢媚Ｊ降膱D像也稱(chēng)作黑白圖像。7．索引顏色模式索引顏色模式也稱(chēng)作映射顏色。在這種模式下，只能存儲(chǔ)一個(gè)8bit色彩深度的文件，即最多256種顏色，而且顏色都是預(yù)先定義好的。Photoshop顏色模式（3）5．HSB模式139合成圖像--調(diào)整圖像大小改變當(dāng)前編輯的圖像大小，其常用方法是“圖像”→“圖像大小”命令，打開(kāi)如下圖所示的對(duì)話(huà)框。用戶(hù)在像素大小或文檔大小中調(diào)整“寬度”和“高度”值。若勾選對(duì)話(huà)框底部的“約束比例”復(fù)選框，會(huì)在寬度和高度間建立等比例效果。單擊“好”按鈕后，圖像將按新的寬度和高度對(duì)整個(gè)圖像進(jìn)行縮放，從而改變圖像的尺寸大小。

合成圖像--調(diào)整圖像大小改變當(dāng)前編輯的圖像大小，其常用方法是140合成圖像--調(diào)整圖像色調(diào)調(diào)整圖像色調(diào)，其最直觀方法是“圖像”→“調(diào)整”→“色彩平衡”命令，打開(kāi)下圖所示對(duì)話(huà)框。用戶(hù)可根據(jù)圖像最終效果進(jìn)行調(diào)整和設(shè)置。單擊“好”按鈕后，圖像將按新的色調(diào)整生成效果圖。

合成圖像--調(diào)整圖像色調(diào)調(diào)整圖像色調(diào)，其最直觀方法是“圖像”141選擇鋼筆工具,選擇目標(biāo)對(duì)象替換頁(yè)面上其他位置的圖層內(nèi)容。扭曲文字，效果如下圖所示GIF格式最多只能儲(chǔ)存256色，所以通常用來(lái)顯示簡(jiǎn)單圖形及文字。Photoshop蒙版原理可運(yùn)用不同濾鏡，以產(chǎn)生一些意想不到的特效；（6）單擊工具箱中文字工具，在選文字工具選項(xiàng)欄上設(shè)置字體為“黑體”、大小為“22點(diǎn)”、文字顏色為“白色”。ImageReadyCS介紹圖層樣式可以創(chuàng)建出投影、發(fā)光、浮雕、描邊等特殊效果。Photoshop:窗口->工作區(qū)->復(fù)位調(diào)板位置逐幀顯示文字，效果如下圖所示。3、在圖層2當(dāng)中畫(huà)星—會(huì)閃的星星閃爍的星光效果，如下圖所示。翻轉(zhuǎn)(ImageReady)PhotoshopCS工作界面使用“徑向模糊”濾鏡功能制作“秀我風(fēng)采”文字的噴發(fā)光芒效果，效果如圖：綜合實(shí)例二：企業(yè)標(biāo)志制作2、輸入文字，然后柵格化“火焰字”文字圖層，并且復(fù)制該圖層它是基于色彩模式這一基礎(chǔ)上衍生出的簡(jiǎn)化操作工具。JPEG圖像文件格式主要用于圖像瀏覽及超文本文檔，如HTML文檔等。色彩調(diào)整實(shí)例制作“感受中國(guó)”頁(yè)面圖像，效果如下圖所示

具體要求：1、加強(qiáng)圖像綠色調(diào)；2、調(diào)整圖像“寬度”值為“698像素”、“高度”值為“179像素”。選擇鋼筆工具,選擇目標(biāo)對(duì)象色彩調(diào)整實(shí)例制作“感受中國(guó)”頁(yè)面142色彩調(diào)整實(shí)例步驟“感受中國(guó)”頁(yè)面圖像制作步驟如下：（1）執(zhí)行“文件”→“打開(kāi)”命令，打開(kāi)原始圖像。（2）執(zhí)行“圖像”→“調(diào)整”→“色彩平衡”命令，在彈出的“色彩平衡”調(diào)整對(duì)話(huà)框中將綠色中間值設(shè)置為“+80”，點(diǎn)擊“好”按鈕。（3）執(zhí)行“圖像”→“圖像大小”命令，在彈出“圖像大小”調(diào)整對(duì)話(huà)框中取消“約束比例”復(fù)選框，設(shè)置“寬度”值為“698”、“高度”值為“179”，點(diǎn)擊“好”按鈕。（4）執(zhí)行“文件”→“存儲(chǔ)為”命令來(lái)存儲(chǔ)效果圖，選擇JPG或PNG格式。色彩調(diào)整實(shí)例步驟“感受中國(guó)”頁(yè)面圖像制作步驟如下：（1）執(zhí)143使用選擇工具中文版PhotoshopCS提供的選取工具分為兩大類(lèi)，一類(lèi)是規(guī)則選取工具也稱(chēng)為框選工具，另一類(lèi)是建立不規(guī)則選區(qū)的工具也稱(chēng)為套索類(lèi)工具。

1．規(guī)則的框選工具在使用時(shí)，只需在圖像中拖動(dòng)鼠標(biāo)指針或單擊鼠標(biāo)左鍵，即可出一個(gè)選擇區(qū)域。。

2．套索選擇工具可用于徒手畫(huà)的方式描繪出不規(guī)則形狀的選取區(qū)域。被選定的圖像區(qū)域邊界上會(huì)顯示出一條流動(dòng)的虛線，對(duì)虛線以?xún)?nèi)的選定區(qū)域可以進(jìn)行任意操作。使用選擇工具中文版PhotoshopCS提供的選取工具144三、Photoshop合成圖像選擇工具組面板

框選工具組套索工具組三、Photoshop合成圖像選擇工具組面板框選工具組套145三、Photoshop合成圖像選區(qū)的操作（1）增加選區(qū)(按住鍵盤(pán)上Shift鍵

)（2）減少選區(qū)(按住鍵盤(pán)上Alt鍵

)（3）填充選區(qū)(前景顏色填充（Alt+Delete）或背景顏色填充（Ctrl+Delete）

)（4）描邊選區(qū)（5）移動(dòng)選區(qū)（6）平滑選區(qū)（7）羽化選區(qū)（8）反向選擇三、Photoshop合成圖像選區(qū)的操作146法學(xué)網(wǎng)頁(yè)圖像處理優(yōu)質(zhì)精選課件147合成圖像實(shí)例

合成照片，效果如下圖所示

最終效果圖素材一素材二合成圖像實(shí)例合成照片，效果如下圖所示最終效果圖素材一素材148圖像格式（1）

Photoshop保存文件過(guò)程中，有多種圖像格式可供用戶(hù)選擇，不同的格式圖像的色彩品質(zhì)、容量大小都有一程度的差異。不同的文件格式可以用擴(kuò)展名來(lái)區(qū)分，如PSD、JPG、GIF、PNG等。

1．PSD（.PSD）格式

PSD圖像文件是Photoshop軟件自身格式，也稱(chēng)為原文件格式，是惟一能支持全部圖像色彩模式的格式。以PSD格式保存的圖像可以包含圖層、通道及色彩模式。

2．JPEG(.JPG；.JPE)格式

JPEG圖像文件格式主要用于圖像瀏覽及超文本文檔，如HTML文檔等。支持多種色彩模式。使用JPEG格式保存的圖像經(jīng)過(guò)高倍率的壓縮，可使圖像文件容量變得較小，但在壓縮過(guò)程中會(huì)丟失部分?jǐn)?shù)據(jù)。

圖像格式（1）Photoshop保存文件過(guò)程中，有多種圖像149圖像格式（2）3．GIF（.GIF）格式它在壓縮過(guò)程中，圖像的像素資料不會(huì)被丟失，然而丟失的卻是圖像的色彩。GIF格式最多只能儲(chǔ)存256色，所以通常用來(lái)顯示簡(jiǎn)單圖形及文字。4．PND（.PNG）格式

PNG圖像格式文件(或者稱(chēng)為數(shù)據(jù)流)由一個(gè)8字節(jié)的PNG文件署名(PNGfilesignature)域和按照特定結(jié)構(gòu)組織的3個(gè)以上的數(shù)據(jù)塊(chunk)組成。PNG用來(lái)存儲(chǔ)灰度圖像時(shí)，灰度圖像的深度可多到16位，存儲(chǔ)彩色圖像時(shí)，彩色圖像的深度可多到48位，并且還可存儲(chǔ)多到16位的α通道數(shù)