準備工作
1、設置：
首選項－》單位與標尺－》像素
窗口－》面板－》選項、工具、信息（F8）、圖層（F7）、歷史記錄
<strong>移動工具選項面板－》自動選擇－》圖層</strong>
2、輔助視圖：視圖－》對齊、標尺Ctrl＋R、顯示－>參考線Ctrl＋;（需勾選顯示額外內容）
3、保存工作區：工作區－》新建工作區
4、常用工具：移動工具 矩形選框工具 魔棒工具 裁剪工具＋切片工具 縮放工具 取色器
5、常用操作：
撤銷：Ctrl+z 連續撤銷：Ctrl+alt+z 回退N：歷史記錄
魔棒工具：容差（顏色選取范圍） 消除鋸齒（使邊緣光滑） 連續（選擇范圍是否連續）
縮放：Ctrl+ Ctrl- Ctrl+1(100%) alt+滾輪（Mac option＋滾輪）
矩形選框：添加到選區（按住Shift）從選區減去（按住Alt）與選區交叉（按住Shift＋Alt）
切片工具：適用于可以一刀切的活動頁
獲取信息
取色獲取顏色信息、測量獲取尺寸信息
1、尺寸信息：
測量什么？寬高、邊距、邊框、定位、文字大小、行高、背景圖位置
工具：矩形選框＋信息面板（活用矩形選框快捷鍵進行選框鎖定）
示例：測量字體與行高：字體選擇－選項面板－最右邊圖標；從選區減去獲取選區；添加到選區獲取超屏幕元素寬高信息
注意：畫布盡可能大以減少誤差
2、顏色信息：
取什么色？邊框色、背景色、文字色
工具：拾色器＋吸管工具
示例：獲取文本顏色(文字選項區），如果文字疊加了特殊效果需要用取色器；取色器確定是否漸變；魔棒工具確定是否線性漸變
切圖
1、切什么？
修飾性：圖標、logo、有特殊效果的按鈕文字等、非純色的背景 保存：PNG24（IE6不支持半透明）、PNG8
內容性：banner、廣告圖片、文章中的配圖 保存：一般存為JPG
2、怎么切？
PNG24: 1、移動工具選中所需圖層（按住Ctrl多選） 2、右鍵合并圖層（Ctrl＋E） 3、右鍵復制圖層到新文件或直接拖動支已有文件（新建Ctrl＋N）
PNG8(帶背景切): 1、合并（可見）圖層（Shift＋Ctrl＋E） 2、矩形選框工具選擇內容 3、魔棒工具去除多余部分（從選區中減去：按住Alt）
可平鋪背景的切圖：1、用矩形選框工具選取一塊區域 2、復制粘貼到新文件中
使用切片工具：1、拉參考線 2、選擇切片工具 3、點擊“基于參考線的切片”按鈕 4、選擇切片選擇工具，雙擊切片更改名稱 5、保存－文件-》存儲為Web所用格式－》全選切片－》統一設置存儲格式
步驟
1、隱藏文字只留背景
若文字為獨立圖層、隱藏文字圖層
若文字和背景合并，平鋪背景覆蓋文字（矩形選框工具、自由變換Ctrl＋T/使用移動工具＋Alt)
2、切圖
3、保存
存儲所需內容：復制、新建、粘貼(Ctrl+C Ctrl+N Ctrl+V)
存儲為Web所用格式(Alt+Shift+Ctrl+S)
保存類型：
圖片色彩豐富并且無透明要求（JPG并選擇合適品質）
圖片色彩不太豐富時無論有無透明度要求（PNG8）
圖片有半透明要求（PNG24）
為保證圖片質量（保留一份PSD，在PSD上修改）Why？1、PSD保留了圖層有利于后期維護 2、壓縮后圖片上基礎上修改會丟失很多像素點
4、維護和修改
A、繼續放更多圖片－更改畫布大?。▓D像－》畫布大?。犯某叽?、定位左上角；選區工具＋裁剪）
B、移動圖標－若為獨立圖層，使用移動工具拖動；else 用選區工具選中圖標區域，移動工具拖動；Ctrl＋X Ctrl＋V可以將同一圖層元素分開
C、修改PNG8點圖片。需更改顏色模式為：RGB顏色（默認為索引顏色更改過程會丟失顏色信息）圖像－》模式－》RGB顏色
5、圖片優化與合并
為什么要拼圖？減少網絡請求、提升網頁加載速度（加載速度、瀏覽器請求數量限制、用戶體驗）
如何？
A、大小與質量
平衡與取舍；壓縮工具：無損(minimage) 有損(TinyPng)
B、合并（排列、分類）
圖片之間必須保留空隙（可維護性與容錯性）
圖片排列方式（橫向、縱向）
分類：同屬于一個模塊的合并（后期維護與請求）；大小相近的合并（節省空間）；色彩相近的合并（減小大?。痪C上合并
合并推薦：只本頁的圖片合并（減少請求）；有狀態的圖標合并（利于操作）
瀏覽器兼容方案：IE6不支持PNG24半透明（存兩份spirit.png 24 spirit_ie.png 8)；CSS3&切圖（高級CSS3，低級圖片＋Hack；高級CSS3，低級無特效）
問題
1、如何新建參考線？
Ctrl＋R打開標尺，從標尺上下（右）拉即可生成參考線
2、如何刪除參考線？
切換到移動工具，鼠標指針放到參考線上，當變成上下箭頭，中間夾著參考線的時候，拖動參考線到標尺上，松手后，參考線就刪除了
以上筆記根據網易前端微專業課程。
記得以前有跟著課程練習一下的，前幾天自己切了下圖發現全忘了，于是記下這些筆記供以后查閱。
