本photoshop教程將通過一個商業網站的設計過程，來介紹如何用photoshop方便的制作出這類簡潔的網頁設計！其中使用的無非是漸變和翻轉，但效果卻很不錯。

相關文章：photoshop制作網站教程：簡潔商業網站

先看最終效果：

1 。創建一個新的文件（ 750 * 600 ） 。

2 。使用油漆桶工具填充背景色為#ffffff。

3 。創建一個新圖層，并選擇矩形工具建立一個高度為2 20px長方形。填充顏色為#6dd4f9 …

|||

4 。為頂部的藍色方框增加一個漸變樣式

5 。選擇一幅圖片,將其插入到網頁中作為背景,并且鏡向復制一份

6 。這些課桌看起來非常丑陋，所以，我們在它之上創造我們的內容框，以掩蓋它！如此使用你的矩形選取框工具，選擇一個方框，并填充顏色為#056caf 。

|||

7 。為其增加ps樣式效果

8 。現在我們為頁面加入一組小圖片,如下圖左小角,注意選擇的圖標要與頁面顏色相近,你可以從以下地址下載圖標

9 。復制圖標文本層，然后將其反轉（修改-變形-垂直翻轉），如下圖。

|||

10 ?，F在，我們為這些圖標增加一個倒影效果,這也是網頁設計中常用的手法之一

11 。為您的網站補充上網站標題！

12 。我又補充了一些演示文本，這樣就全部完成了，在這里，你學到了一個完整的網頁設計布局，你可以為你的公司或其他任何組織使用這個教程！