利用Photoshop設計壹個漂亮的頁腳模板本文介紹壹個制作頁腳的PS教程。頁腳設計有層次感，用網格空間背景紋理裝飾，是壹款非常漂亮的頁腳。
自從Web2.0登陸互聯網以來，頁腳變得比以往任何時候都重要，出現了許多非常漂亮的頁腳設計。在本教程中，我將教妳如何在Photoshop中創建壹個簡單流暢的網站頁腳。
頁腳
這是我們將要創建的頁腳。點擊下方截圖查看原圖。
步驟1
像液體頁眉和頁腳壹樣，漸變通常是web2.0設計風格的標誌。在本教程中，我們將使用壹組模擬3D材質的漸變文件包。妳可以從卓越經銷商那裏拿到這個包裹。點擊這裏下載漸變文件包。
第二步
在Photoshop中創建新文檔。我自己創建了壹個大文件，大小為1440像素X900像素(適合我筆記本17寸顯示器)。當然，其實妳的頁腳不應該那麽大，雖然它可以很好的模擬妳的瀏覽器窗口被拖動時的情況。
選擇背景顏色。在我的例子中，背景顏色是從#b0b0b0到#e1e1e1的簡單漸變。按住Shift鍵創建壹個從上到下的垂直漸變。
第三步
在網頁設計中，妳將創建什麽樣的布局是非常重要的。即在流式布局(可以適應瀏覽器大小的布局)和定寬布局(web2.0風格的網站中定寬布局往往居中)之間進行選擇。我們的頁腳將是壹個固定寬度的布局頁腳，大小為760像素X420像素。這個尺寸將確保即使在800像素×600像素的屏幕上也能正確顯示。
使用網格來確定網站的大小，如下所示。請註意，如果您想要創建壹個適合1024像素x768像素屏幕尺寸的布局，請在955像素X600像素的區域中定義您的網格。
第四步
雖然我們的頁腳有壹個固定的寬度，我們仍然希望頁腳可以填滿整個頁面。為了達到這個目的，我們將使用我在Photoshop中制作的仿金屬圖案。單擊此處下載此模式。在Photoshop中打開這張圖片，選擇“編輯”定義圖案，並給圖案命名。
現在創建壹個新文檔，1440像素寬，86像素高。選擇“編輯填充”命令，然後選擇我們剛剛創建的圖案。選擇全部(Ctrl+A)，然後把圖片剪切粘貼到我們第壹個文檔的底部，我們會得到下面的結果。
第五步
現在是時候使用步驟1中漂亮的漸變文件包了。新建壹個圖層，使用矩形選區工具(M)創建壹個選區，文件寬度為100%，高度為21像素。選擇漸變工具(G)，然後選擇壹個漂亮的漸變。我選擇了“黑色5光澤”。現在按住Shift鍵並在矩形選區中畫壹條垂直線來創建這個漸變。
將創建的形狀移動到步驟4中創建的形狀之上。您應該會得到類似下圖的結果。
第六步
現在讓我們添加壹個陰影效果到第五步創建的圖層。
第七步
將前景色設置為#545557，背景色設置為#1e211f。在步驟4中創建的圖層下創建壹個新圖層。在步驟4中，使用選擇工具選擇圖層的內容。選擇漸變工具，選擇第壹個漸變(前景色和背景色的組合)，按住shift鍵，在選區上繪制垂直漸變。現在在步驟4中選擇圖層，將圖層混合模式改為正片疊加。
第八步
在所有圖層上面新建壹個圖層，在參考線中間畫壹個顏色為#dfdfdf的圓角矩形。右鍵單擊圖層，然後單擊混合選項，為矩形創建壹個投影效果。然後右鍵點擊效果層，選擇創建層，這將把投影效果分離成壹個單獨的層。
現在妳有壹個矩形層和壹個陰影層，移動並改變陰影的大小，直到妳得到如下所示的效果。您可以按Ctrl+T調出變換工具，然後右鍵單擊，選擇透視，並向內拖動頂部的兩個手柄。妳也可以向下移動陰影，使用橡皮擦工具和軟筆刷來擦除上邊緣的陰影。
第九步
最後，添加文本、版權信息和您的徽標來完成設計。
步驟10
為了在html文件中使用頁腳，只需刪除文本(文本將被添加到html中)，剪切如下所示的背景圖片，然後將其粘貼到壹個新文件中。就像在Photoshop中，這個圖案會通過使用CSS文件中的背景圖片屬性來實現。這就是為什麽我們要把圖片剪成這麽小的尺寸，為了用小文件得到更好的效果。
要剪切頁腳，只需在參考線中選擇圖片的內容，然後剪切並粘貼到新文件中。
選擇另存為網頁和設備命令來保存這兩張圖片。然後選擇JPG格式和適當的質量。JPG格式和PNG格式都是存儲圖片的好格式，可以保存很多顏色。GIF格式最適合用於顏色簡單的圖片。這種不同的用法是由於不同的算法。
最終頁腳
如何用PS制作網頁模板？設計完壹個尺寸，直接設計內容就好了。註意不要合並任何層。文字可以用壹些常用詞代替。
畢竟用PSD和JPEG格式保存。前者是模板，後者是線上預覽！