完成的網頁效果:

　　1 創建新的 Photoshop文檔 (Ctrl/Cmd + N)根據下圖.

　　設置單位和標尺

　　2 確保你使用像素為單位, 它是網頁設計的標準尺度. 從前置選項的windows對話框設置標尺 (Ctrl/Cmd + K); 點擊單位和標尺,確保你所有的設置跟下圖相同.

　　為內容區域增加指導

　　3 激活photoshop的標尺,從查看 > 標尺里頭. 按下"Ctrl/Cmd + R"固定標尺的可見度. 也可以通過打開窗口> 信息 (快捷鍵: F8). 通過選區工具,信息面板可以反饋不是有用的信息. 按下"M"字鍵, 選擇矩形選區工具在畫布的左上角繪制出一個120px寬的小盒子.你可以調整選區的大小通過信息面板.現在從左邊開始,根據面板顯示的寬度拖動參考線到如圖的選區右側.

　　4 移動選區到畫布的右邊緣. 分配另外一條參考線到選區左側.

　　你的畫布看起來應該是這樣的:

　　創建logo

　　5 現在我們開始創建LOGO. logo只是添加的應用顏色漸變效果所以很簡單. 創建新的組 (圖層> 新建 >組)并且命名為"logo".

　　6 選擇橫向排版工具 (T)切換到大寫字母 鍵入"SMASHING" (或者你網站的名字) .

　　7 進入字符面板, 設置字體為Arial, 樣式為粗體,大小為 42pt. 設置反鋸齒選項為銳利顏色為#101112. 你同樣可以在激活文字工具之后在工具欄更改.

　　8 雙擊打開圖層面板對話框. 選擇圖層漸變, 點擊漸變設置如下圖顯示設置.