本篇內(nèi)容介紹了“PS中用來前端切圖的知識點有哪些”的有關(guān)知識，在實際案例的操作過程中，不少人都會遇到這樣的困境，接下來就讓小編帶領(lǐng)大家學習一下如何處理這些情況吧！希望大家仔細閱讀，能夠?qū)W有所成！

成都創(chuàng)新互聯(lián)-專業(yè)網(wǎng)站定制、快速模板網(wǎng)站建設、高性價比南部網(wǎng)站開發(fā)、企業(yè)建站全套包干低至880元,成熟完善的模板庫,直接使用。一站式南部網(wǎng)站制作公司更省心,省錢,快速模板網(wǎng)站建設找我們，業(yè)務覆蓋南部地區(qū)。費用合理售后完善，十載實體公司更值得信賴。

PS是Web設計的首選軟件，他著重側(cè)重于對圖形的二次處理，主要在顏色方面，通過分圖層處理疊加效果來達到各種其異的夢幻需求，疊加是不是很熟悉，就是css里邊層疊也可以。只是ps是面性的，css是邏輯性的，從上到下。而PS的神奇在于，每個參數(shù)的不一致，導致的結(jié)果不一致，這樣也讓很多非專業(yè)人士自認為有設計藝術(shù)的細胞或假象，以為自己是一個設計奇才，從而選錯行業(yè)，所以設計這行有風險，入行要謹慎。像AI,   CorelDraw著重于對造型的創(chuàng)造或編輯，像CAD則是點線面關(guān)系，3DMax則是空間物理關(guān)系，F(xiàn)lash是空間與時間的關(guān)系等等。而且這些設計軟件中也只有PS能夠完整真實的模擬Web頁面上的真實場景，雖然字體有時候也會在表現(xiàn)上出現(xiàn)稍為的偏差。FireWorks也由于市場份額或PS重合功能太多，已經(jīng)停止新版本開發(fā)或更新了。這是一個公司戰(zhàn)略或市場競爭下必然導致的結(jié)果，個體用戶不能左右。

1).基本信息：

• 以圖層為主要的編輯對象，通過不同層細節(jié)的編輯，使整體效果更為絢麗或多變。

• 以工具為主要的編輯手段，通過多個工具的結(jié)合，滿足大部分編輯要求。

• 通過濾鏡的組合，呈現(xiàn)很多不錯的效果，達到平民人士也能參與互聯(lián)網(wǎng)炒作的大軍中不能自撥，在當下PS已經(jīng)由有一個名詞轉(zhuǎn)為一個動詞了。

• 對前端來說切圖時注意：優(yōu)化切圖流程，提升切圖效率，增加崗位競爭優(yōu)勢

  具體經(jīng)驗分享：修改PS的快捷鍵，使其符合前端操作的習慣，側(cè)面提升工作效率。從而擴展，可以修改其它軟件的快捷鍵，整體提升工作效率，增加就業(yè)資本或信心。

• 圖片格式那些事兒

  一般新手不太注意頁面的性能問題，而性能容易出現(xiàn)在圖片上面，如何在一個大頁面中處理好圖片是一個前端必備的技能之一。

  一般應用比較多的格式有：gif,png-8,png-24,jpg。而新手經(jīng)常混淆png-8,png-24的區(qū)別。

  按我經(jīng)驗4k以下gif,png-8差別不大，4k-100k: png-8,gif占優(yōu)勢，大于100k果斷是jpg。

  png-8不支持alpha透明，在IE6下需要一個JS或透明濾鏡來處理。

  圖片格式與設計那點事兒

  Web性能優(yōu)化：圖片優(yōu)化

2). 提高切圖效率思路之擴展：

在上一點提到的修改快捷鍵，分享一下我修改的幾個快捷鍵（修改這個快捷鍵，有個缺點，換臺電腦可能就不能使用，除非能夠熟悉的記得兩套快捷鍵，即修改過的，或原始的）：

• 新建圖層: F1

  使用頻率比較強，所以放在一個容易的地方。

• 新建文件：F2

  僅次于新建文件，也是使用使用頻率比較高的一個鍵。由于切圖是會從原始圖層上多次的分離圖層，所以這個快捷捷由原來的按兩鍵，變?yōu)橐绘I。并且有效的分離左右手操作的特點，盡量讓使用頻率高的鍵從左側(cè)起步。以下的幾個快捷鍵，都是按照這個思路來進行優(yōu)化或設置的。

• 按屏幕大?。篎3

• 按畫布大?。篎4

  這兩個鍵操作思路主要借鑒于CorelDraw，CorelDraw是一款優(yōu)秀的平面廣告設計軟件，多用于名片，包裝設計。這是由加拿大Corel產(chǎn)品，他們公司另外一個比較著名的繪畫類軟件是Painter。

• 存儲為web格式：F5

  由原來的5鍵優(yōu)化為一鍵，還有一個流程是通過Ctrl+Shift+S來存儲圖片，很明顯這個流程步驟過于繁多，很浪費時間。有興趣的可以做一個對比。

• 裁剪命令：F6

  由原來的3鍵優(yōu)化為一鍵，另外一個是裁剪工具(C)，裁剪工具對整個畫面的破壞力比較大，且不易控制，尤其在PS的版本升級中對這個工具進行了優(yōu)化。而這個命令相對更為輕量或方便。

• F7,F8,F9保持不變

• 轉(zhuǎn)換為RGB模式：ctrl+=

  因為Gif是索引模式，顏色信息較少，如果要進行編輯，首先得轉(zhuǎn)換成RGB模式。

• 從圖層建立組：ctrl+,

  由于剛?cè)胄械脑O計師沒有經(jīng)驗，一個設計稿是沒有分圖層組。其實合理的圖層組可以有效的引導前端，所以這個快捷鍵主要是解決這個問題。

• 自由變換：F10

  變換內(nèi)容

  前端主要還是對現(xiàn)有的PSD文件進行編輯，所以這兩個鍵是可以單獨拿出來的。

• 變換選區(qū)：F11

  變換邊框

• 畫筆：F12

  因為前端不像設計師，對PSD只是一個切割，而設計師注重于創(chuàng)造的過程。所以對畫筆工具的依賴不是很大，由原來的F5移動到F12。

• 復制圖層 Ctrl+ / 原有位置在菜單欄：圖層->復制圖層

  這個快捷鍵，可以快速的把原始PSD中的一個或多個圖層復制到一個新文件當中。

演示：

3). 切圖的幾個辦法：

• 切片(k):

  優(yōu)點：能夠一次切除多個圖片。

  缺點：需要后退一步，降低效率，容易產(chǎn)生多余無用圖片

• 選區(qū)(先用選區(qū)工具來畫一個范圍，然后裁剪):

  優(yōu)點：區(qū)域精確目標單一

  缺點：需要后退一步，容易誤操作

• 拷貝(Ctrl+C):

  優(yōu)點：拷貝單層的內(nèi)容到新文件，能夠快速的切除圖片。

  缺點：不容易找到相應的圖層。

• 合并拷貝(Ctrl+Shift+C):

  優(yōu)點：拷貝所有可見層的內(nèi)容到新文件，能夠快速的切除圖片。

  缺點：不容易找到相應的圖層。

“PS中用來前端切圖的知識點有哪些”的內(nèi)容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識可以關(guān)注創(chuàng)新互聯(lián)網(wǎng)站，小編將為大家輸出更多高質(zhì)量的實用文章！