<內容介紹>

網頁設計師必看！
精通Photoshop跨平台網頁設計實用技巧大公開

‧順利展開網頁設計工作的設定及設計準則
‧快速製作設計構圖的準備工作及Tips
‧輕鬆製作跨裝置檔案的實用技巧

隨著智慧手機與平板電腦的普及，網站設計也產生極大變化。身處於跨裝置時代的設計師，在設計網站時，不僅要掌握流行脈動，也要顧及如何讓智慧手機或平板電腦的使用者順利取得網頁資訊的技術，如存取內容的方便性、使用者介面的設計、易用性等。

書中提供跨平台網頁設計的實用技巧，並列舉國外最新流行的網站範例，解說網站製作的技術，同時講解在跨裝置時代下的網站設計趨勢。「好像瞭解了，但是實際上該怎麼執行呢？」有這種疑問的人，或期望在職場上可以順利與客戶溝通者，都可以把本書作為必備指南。

本書編寫時涵蓋的Photoshop版本為Photoshop CC 2014、Photoshop CC、Photoshop CS6，以CC版以上為佳。

<章節目錄>

01 設計前的準備工作
1-1 設定介面(輕觸平移、拖曳縮放、像素格點…)
1-2 指令碼的用法
1-3 環境同步、回復
1-4 適合網頁設計的設定(單位、參考線與格點、靠齊、顏色設定)

02 使用Photoshop CC之後的版本製作最佳構圖範例
2-1 關於範例
2-2 構圖的必要性與製作方針
2-3 開新檔案(網格系統、CSS框架、設計格線系統…)
2-4 設計、製作版面
2-5 使用圖層構圖管理狀態
2-6 管理模組的事前準備工作
2-7 平板電腦、智慧型手機用的版面
2-8 使用Bootstrap製作模型
2-9 摘取資產
2-10 編碼

03 製作手機通用的設計構圖
3-1 順利展開設計工作的準則
3-2 「圖層」面板整理術
3-3 共用元素(圖層、顏色、樣式、文字、狀態…)
3-4 可縮放的表現方法
3-5 利用Generator匯出影像(自動更新)

04 提高工作效率的技巧
4-1 儲存文字特效
4-2 運用含遮色片的圖層群組
4-3 利用變數製作網頁Banner
4-4 製作表格並置入連結
4-5 利用指令碼完成「擴充切片」
4-6 輕鬆製作出色彩變化
4-7 建立確認差異用圖層避免出現錯誤
4-8 利用「Renamy」快速更改圖層名稱
4-9 重疊圖層樣式製作POP文字
4-10 將圖層大小自動記錄在圖層中

05 容易忽略的基本功能
5-1 校正角度與去背
5-2 變形校正
5-3 調整影像素材
5-4 動作(快捷批次處理、批次處理、條件式動作…)
5-5 其他(從PSD匯出文字、以拖放方式置入PSD或影像檔案、更改筆刷大小…)

附錄 Font Awesome Cheatsheet（清單）