網頁設計包含了背景、導航條、按鈕、logo、文字等元素，用Photoshop軟體將這些元素進行組合排版製作。本次案例以電影網站為設計主題。
方法/步驟
新建一個空白文件，打開「素材/網頁素材1.jpg」文件，使用「移動工具」將圖片移至當前畫布中，得到「圖層 1」。使用「自由變換」調整大小。效果如圖所示。
使用 「矩形工具」將網頁布局劃分、顏色白色RGB為（255.255.255）、設置圖層混合模式：投影效果如圖所示。
將形狀圖形載入選區。創建一個新圖層「圖層2」，使用 「漸變工具」顏色RGB為（178.178.178）（255.255.255）填充漸變效果，如圖所示。
使用「移動工具」將導航條圖片移至當前畫布中，得到「圖層 3」。使用「自由變換」調整大小，如圖所示。
製作內容，打開「素材/網頁素材3.jpg、網頁素材4.jpg、網頁素材5.jpg、網頁素材6.jpg、網頁素材7.jpg」文件，使用「移動工具」將圖片移至當前畫布中，得到「圖層 4」、「圖層 5」、「圖層 6」、「圖層 7」、「圖層 8」。使用「自由變換」調整大小。效果如圖所示。
使用 「橫排文字工具」字體大小為14點、中文字體（幼圓）、顏色RGB為（143.86.46）輸入每部電影的名稱，效果如圖所示。
打開「素材/網頁素材8.jpg、網頁素材9.jpg、網頁素材10.jpg」文件，使用「移動工具」將圖片移至當前畫布中，得到「圖層 9」、「圖層 10」 「圖層11」，使用「自由變換」調整大小。效果如圖所示。
使用 「橫排文字工具」字體大小為18點、中文字體（黑體）、顏色RGB為（143.86.46）輸入每部電影簡介。效果如圖所示。
打開「素材/網頁素材11.jpg」文件，使用「移動工具」將表格圖片移至當前畫布中，得到「圖層 12」，使用「自由變換」調整大小。效果如圖所示。
使用 「橫排文字工具」字體大小為18點、中文字體（宋體）、顏色RGB為（143.86.46）輸入數字製作選擇菜單。打開「素材/第9章/網頁素材12.jpg、網頁素材13.jpg」文件，使用「移動工具」將按鈕圖片移至當前畫布中，得到「圖層 13」、「圖層 14」，刪除不需要的背景，使用「自由變換」調整大小。效果如圖所示。
繪製矩形選區，單擊按鈕創建「圖層15」，使用 「漸變工具」填充顏色RGB為（255.255.255）到透明的漸變效果。選擇 「橫排文字工具」字體大小為16點、西文字體（Verdana）、顏色RGB為（255.255.255）輸入字體。效果如圖所示。
打開「素材/網頁素材14.jpg」文件，使用「移動工具」將標誌圖片移至當前畫布中，得到「圖層 16」，使用「自由變換」調整大小。效果如圖所示。
使用 「橫排文字工具」字體大小為40點、西文字體（Lithos Pro）、顏色RGB為（188.202.112）和（143.86.46）輸入標題文字。效果如圖所示。
最終效果圖如圖所示。