用ps制作網站導航按鈕可能是經常使用的技巧，雖然目前有很多免費的png圖標按鈕提供下載，但學習常用導航按鈕的制作過程缺是一個網站界面設計者必須掌握的基本技巧。

第一步:創建工作區域:

首先我們新建一300 x 500的文件,填充背景色為黑色#000000

開始制作按鈕導航前加入背景花紋圖片:

我使用的背景是通過ps筆刷直接制作的,你可能電腦里沒有這個筆刷,不過沒關系,這不是按鈕導航制作所必須的,這里使用只是為了效果更明好而已

第2步:開始創建導航按鈕

在ps里新建一圖層,使用矩形選框工具在新圖層上畫一矩形:

|||

為選框隨便填充一種顏色,因為后面要加圖層樣式:

為導航按鈕增加陰影圖層樣式:

漸變圖層樣式:

邊框:

應用以上圖層樣式后的效果如下圖:

 |||

第3步:覆蓋簡便效果制作

按住ctrl鍵的同時點選導航按鈕圖層,會出現如下選框,隨后新建立一圖層(請確保圖層在原導航按鈕圖層之上),隨后使用漸變工具(選擇徑向漸變),顏色從白色到白色(后一種設置個小點的不透明度),在圖層上拉一漸變線,如下圖:

完成后的效果因該如下圖:

調整你的漸變效果，使其顏色與導航按鈕接近,產生比較自然的高光效果:

 |||

第4步:增加按鈕上半部高光

新建一圖層,使用矩形選區工具,減去之前的選框:

選擇區域如下:

填充白色,并調整不透明度

 |||

第5步:復制做好的導航按鈕

第6步:加上文字連接

 |||

第7步:為每個導航按鈕加入一些筆刷圖案

目前線條圖案在網頁設計中經常被使用,這些不但效果簡潔,而且不會對頁面產生過大的視覺牽引,這些圖案大多是使用ps筆刷來制作的。

完成后效果: