在Photoshop中為您的產(chǎn)品攝影圖片創(chuàng )建透明背景可以為您的特色產(chǎn)品提供多種引人注目的顯示選項。例如,透明背景使您能夠將產(chǎn)品放置在動(dòng)態(tài)變化顏色的背景上。在響應式設計的網(wǎng)站上,具有透明背景的特色產(chǎn)品可以根據用戶(hù)的屏幕尺寸與其背景進(jìn)行不同的交互。
您網(wǎng)站的徽標文件也應使用透明背景創(chuàng )建,以便您可以放置徽標無(wú)論頁(yè)面的背景顏色如何,您網(wǎng)站上的任何位置。
使用Photoshop創(chuàng )建透明背景,然后將文件保存為適用于網(wǎng)絡(luò )的適當格式,一旦您知道自己在做什么,這將非常容易正在做。廣州攝影公司-艾米攝影將在下面的教程中引導您完成這個(gè)簡(jiǎn)單的過(guò)程。
如何在Photoshop中為產(chǎn)品圖像創(chuàng )建透明背景
第1步:將圖像制作成分層文件
在Photoshop中打開(kāi)您的產(chǎn)品圖像。最有可能的是,它將采用JPG格式。對于此示例,我們將使用在白色背景下拍攝的手表圖像。
打開(kāi)圖層面板。默認情況下,此面板位于圖像窗口的右側,但如果看不到它,可以通過(guò)單擊應用程序窗口頂部下拉菜單中的“窗口”>“圖層”來(lái)訪(fǎng)問(wèn)它。
在圖層面板中,雙擊背景圖層。將出現一個(gè)新圖層對話(huà)框,要求您重命名該圖層。您可以將其保留為默認層0,然后單擊確定。
您現在已經(jīng)解鎖了背景層,以及您想要的任何內容從中刪除將是透明的。
了解如何使用圖層在Photoshop中使用本教程了解更多
第2步:創(chuàng )建選區
從應用程序左側的工具欄中選擇魔棒工具窗戶(hù)。然后,單擊屏幕頂部選項欄中的選擇主題。無(wú)論背景如何,Photoshop都會(huì )嘗試從您的照片中選擇對象。您會(huì )看到選區周?chē)?ldquo;行進(jìn)的螞蟻”。
如果選區不完美,您可以使用魔術(shù)棒工具從中移除更多背景選區,或將更多產(chǎn)品添加到選區,具體取決于選區的方式。
在此示例中,Photoshop并未從選區中完全移除手表的陰影,因此我們將選擇減去從選項欄中的選擇圖標,然后使用魔術(shù)棒工具單擊陰影部分,直到選擇僅包含手表。
創(chuàng )建選擇時(shí),請確保您還選擇了包含手表的任何區域日您的產(chǎn)品圖片中有“洞”,例如示例圖片中表盤(pán)與腕帶相接的區域。
第3步:刪除背景
選擇產(chǎn)品后,通過(guò)鍵入SHIFT+CTRL+I(在Mac上為SHIFT+COMMAND+I)或從應用程序窗口頂部的下拉菜單中選擇“選擇”>“反向”來(lái)選擇反向。
選擇反向(背景)后,鍵入BACKSPACE(在Mac上為DELETE)。您的背景現在將是透明的。在Photoshop中,透明背景用灰色和白色棋盤(pán)圖案表示。
鍵入CTRL+D(在Mac上為COMMAND+D)取消選擇。
第4步:以適合網(wǎng)絡(luò )的格式保存圖像
在Photoshop中創(chuàng )建透明背景只是第一步;您需要確保以正確的格式保存您的產(chǎn)品圖片,以便它以透明背景顯示在您的電子商務(wù)網(wǎng)站上。
要展示的最佳格式將您的圖像保存為PNG-24。這種格式允許多層透明,這意味著(zhù)您的圖像在放置在不同顏色的背景上時(shí)永遠不會(huì )有像素化的“光暈”。PNG-8和GIF等較舊的透明文件格式會(huì )產(chǎn)生這種不良的光暈效果,因此請盡可能使用PNG-24。
了解如何重新格式化、調整大小和優(yōu)化您的網(wǎng)絡(luò )圖像了解更多
要在PhotoshopCC中將文件保存為PNG-24,請鍵入SHIFT+ALT+CTRL+W(在Mac上為SHIFT+OPTION+COMMAND+W)或選擇文件>導出>導出為...從應用程序窗口頂部的下拉菜單中選擇。
注意:如果您使用的是舊版本的Photoshop,并且沒(méi)有看到“導出為...”選項,您可以選擇為Web保存并從對話(huà)框右側的預設下拉菜單中選擇PNG-24。
在出現的對話(huà)框中,在文件設置下框的右側,將格式設置為PNG,并確保透明度b牛被檢查。不要選中SmallerFile(8-bit)—這會(huì )將文件轉換為PNG-8
在圖像的左側,您會(huì )看到文件大小為您的PNG文件預測。請務(wù)必注意這一點(diǎn),因為較大的文件會(huì )使您的網(wǎng)頁(yè)加載速度變慢。我個(gè)人的偏好是將Web圖像保持在200KB左右或更小。
在對話(huà)框右側的“圖像大小”下,您可以選擇調整圖像的尺寸。較小的尺寸意味著(zhù)較小的文件大小。但是,您不想讓圖像的尺寸小于您希望它們出現在網(wǎng)站上的尺寸;這樣做會(huì )產(chǎn)生模糊或像素化的圖像。
此外,由于您的許多客戶(hù)在視網(wǎng)膜顯示器上查看您的產(chǎn)品,因此最好將產(chǎn)品圖像保存為比實(shí)際尺寸大50%–100%的尺寸您希望它顯示的大小。這將有助于它在所有設備上看起來(lái)清晰。換句話(huà)說(shuō),如果您知道您的產(chǎn)品將以400像素寬顯示在最大的情況下,您需要在此處使其至少有600像素寬。
因此,是的,您需要在最大化圖像尺寸的同時(shí)最小化您的圖像尺寸方面取得一些平衡。文件大小。為最大限度地減少加載時(shí)間,您可以選擇僅將特色產(chǎn)品圖片保存為更大的視網(wǎng)膜顯示器,并允許以實(shí)際尺寸保存大部分產(chǎn)品圖片。
第5步:保存文件
將圖像大小設置為適當的尺寸后,單擊“全部導出”。
在“保存”對話(huà)框中,選擇保存可用于Web的產(chǎn)品圖像的文件夾。最好將優(yōu)化后的圖像文件與原始圖像文件分開(kāi),以避免在將圖像加載到您的站點(diǎn)時(shí)發(fā)生混淆。為圖像文件命名并確保其擴展名設置為.png。
單擊“保存”。
獲取數字資產(chǎn)管理技巧以整理您的照片并保持理智學(xué)習更多
您現在可以將透明的產(chǎn)品圖片放在不同的b背景并讓它完美顯示。
如何在Photoshop中為徽標創(chuàng )建透明背景
您在網(wǎng)站上使用的徽標應始終具有透明背景。這樣,無(wú)論頁(yè)面背景是什么顏色,您都可以靈活地將其顯示在網(wǎng)站的任何位置。
但是,如果您的徽標另存為JPG,則需要刪除Photoshop中的背景并將文件重新保存為PNG-24,就像我們在上面的示例中對產(chǎn)品圖像所做的那樣。如果您有幸擁有矢量文件形式的徽標(擴展名為.AI、.EPS或.PDF),您仍然需要在Photoshop中打開(kāi)該文件并將其轉換為PNG-24,這樣它才能采用網(wǎng)絡(luò )就緒格式。
了解如何將光柵外包到矢量轉換需求了解更多信息在Photoshop中打開(kāi)徽標文件使背景透明將圖像另存為PNG文件
步驟1:在Photoshop中打開(kāi)徽標文件
在Photoshop中,轉到文件>打開(kāi)并導航,直到您看到徽標文件。單擊打開(kāi)。
如果您打開(kāi)的是.JPG(或其他光柵格式)文件,該文件將直接在Photoshop中打開(kāi)。
如果您打開(kāi)的是矢量格式文件,但是,您需要確保您在出現的對話(huà)框中的設置是正確的:
CropTo:issettoBoundingBoxConstrainProportionsischeckedMode:issettoRGBColor
單擊確定。
第2步:使背景透明
如果您使用的是矢量文件,則可以跳過(guò)此步驟。但是,如果您使用的是JPG,則需要從圖像中選擇并刪除背景。
就像我們在上面的步驟1中將產(chǎn)品圖像背景設為透明時(shí)所做的那樣,您將需要雙擊圖層面板中的背景層,然后單擊確定將背景轉換為圖層0。
選擇徽標文件的背景與選擇產(chǎn)品圖像的背景略有不同,因為你的日志背景o很可能是全白的。從工具欄中選擇魔術(shù)棒工具,然后單擊徽標文件的白色背景。如果您需要選擇多個(gè)區域,請按住SHIFT鍵并使用魔棒工具單擊以添加到選區。
選擇整個(gè)背景后,鍵入退格鍵(在Mac上為DELETE)。您現在將擁有一個(gè)透明背景,由灰色和白色棋盤(pán)圖案表示。
第3步:在Photoshop中將圖像另存為PNG文件
按照上面我們將產(chǎn)品圖像設為透明的步驟4和5將您的文件導出為PNG-24。無(wú)論您以何種文件格式開(kāi)始,無(wú)論您的原始文件是JPG、AI、PDF還是其他文件格式,這些步驟都是相同的。
當您導出圖像時(shí),您會(huì )注意到您的文件大小明顯小于透明背景產(chǎn)品圖像的文件大小。這是因為標志往往只有一種或兩種顏色,不像現有的數千種顏色t在產(chǎn)品圖片中。因此,您無(wú)需在保存徽標文件時(shí)縮小圖像比例。保持您的尺寸與您一直使用的原始文件大小相同,然后單擊保存。
您現在已經(jīng)掌握了創(chuàng )建具有透明背景的網(wǎng)絡(luò )就緒圖像的知識,這些圖像將在不減慢您的速度的情況下精美地顯示網(wǎng)站。