photoshop切片使用教程(保存為頁面與圖片)

先做一個簡單的說明為什么選擇Photoshop軟件而沒有選擇Firework軟件。Friework Dreamweaver Flash號稱網(wǎng)頁制作三劍客，F(xiàn)riework與Dreamwaver整合得更為緊密，在這里只所以選擇photoshop只是因為我的偏好，況且我對firework軟件使用的次數(shù)很少，不太喜歡他提供的層面板。
在這里我們使用的PS的版本是CS3 以前的版本與此相差無幾，但注意不能使用迷你安裝版，必須是完整安裝。

再說一下我們?yōu)槭裁匆褂们衅?
1 使用切片是最直白的網(wǎng)頁布局方法。不要再想如何去設計表格，也不要想什么DIV，你首先要想的是你的網(wǎng)頁要做成什么樣子？把你所想的畫出來就行了!!
2 使用切片可以有效地減小頁面文件的大小，提高瀏覽者瀏覽頁面的體驗。想想看是把一個圖片完整下載下來快，還是把一個圖片分成若干個小圖同時下載快呢？

如何切片：
一 打開你設計好的PS圖，選擇切片工具

二 按網(wǎng)頁的結(jié)構(gòu)和圖片的特點進行切片
切片的大水上和位置可以通過切片選項來進行調(diào)整

三 選擇文件菜單 另存為WEB格式命令，保存時會生成index.html 圖片文件會存放在images文件夾中(CS3要選擇存儲為html和圖片)

四 使用Dreamweaver軟件打開剛剛保存生成的html文件進行編輯，刪除不必須的圖片和進行內(nèi)容的填充。

切片原則和常見問題：
一 切片是生成表格的依據(jù)，切片的過程要先總體后局部，即先把網(wǎng)頁整體切分成幾個大部分，再細切其中的小部分。
二 對于漸變的效果或圓角等圖片特殊效果，需要在頁面中表現(xiàn)出來的，要單獨切出來
三 在DW中進行編輯時，少用圖片，如果能用背景顏色代替的就使用背景顏色 能使用圖案的也盡可能使用圖案平鋪來形成背景
四 在DW中進行編輯時，刪除圖片時出面表格錯位如何辦？
刪除圖片的時候記住圖片的長寬，再插入一個相同長寬的表格。
五 在DW中如何自定義表格的長寬？
使用表格長寬一樣的圖片做為單元格的背景。
六 如何在圖片上輸入文字？
把圖片設置成背景。
其實我感覺很重要的兩步如下：
第一步：

第二步：

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。TEL:0731-84117792 E-MAIL:11247931@qq.com