ทำความเข้าใจกับความโปร่งใสในภาพดิจิทัล

ความโปร่งใสคืออะไร?

ในภาพดิจิทัล ความโปร่งใสหมายความว่าบางพิกเซลอาจมองไม่เห็นบางส่วนหรือทั้งหมด เมื่อคุณวางรูปภาพโปร่งใสบนพื้นหลังที่มีสี ไม่ว่าจะเป็นเว็บไซต์ การออกแบบ หรือรูปภาพอื่น พื้นที่โปร่งใสจะแสดงสิ่งที่อยู่ด้านหลังแทนที่จะเป็นสีทึบ

ความโปร่งใสถือเป็นสิ่งสำคัญสำหรับโลโก้ ภาพตัดผลิตภัณฑ์ ภาพซ้อนทับ และองค์ประกอบใดๆ ที่คุณต้องการให้หัวเรื่องของคุณผสมผสานเข้ากับบริบทใหม่ การลบพื้นหลังจะสร้างความโปร่งใสโดยการทำให้มองไม่เห็นพื้นหลังดั้งเดิม

ช่องอัลฟ่า

RGB กับ RGBA

รูปภาพส่วนใหญ่ใช้ RGB: แต่ละพิกเซลมีค่าสีแดง เขียว และน้ำเงินที่กำหนดสีของมัน รูปภาพโปร่งใสจะเพิ่มค่าที่สี่: อัลฟ่า RGBA หมายถึง แดง เขียว น้ำเงิน และอัลฟ่า ช่องอัลฟ่าจะกำหนดว่าแต่ละพิกเซลมีความทึบหรือโปร่งใสเพียงใด

ค่าอัลฟ่า

โดยทั่วไปอัลฟ่าจะถูกจัดเก็บเป็นตัวเลขตั้งแต่ 0 ถึง 255 (หรือ 0% ถึง 100%) 0 = โปร่งใสเต็มที่ (มองไม่เห็น) 255 = ทึบแสงเต็มที่ (ทึบ) ค่าที่อยู่ระหว่างนั้นจะสร้างความโปร่งใสแบบกึ่งโปร่งใส ซึ่งมีประโยชน์สำหรับขอบที่นุ่มนวล เงา และเอฟเฟกต์กระจก

รูปแบบที่รองรับความโปร่งใส

PNG

PNG รองรับอัลฟ่าเต็มรูปแบบ (8 บิตหรือ 16 บิต) เป็นรูปแบบทั่วไปสำหรับรูปภาพโปร่งใส PNG ไม่มีการสูญเสีย ดังนั้นขอบที่โปร่งใสจึงยังคงคมชัด นี่คือรูปแบบการส่งออกมาตรฐานสำหรับการลบพื้นหลัง

เว็บพี

WEBP สนับสนุนความโปร่งใสด้วยการบีบอัดทั้งแบบสูญเสียและไม่สูญเสียข้อมูล มักจะสร้างไฟล์ขนาดเล็กกว่า PNG ที่มีคุณภาพใกล้เคียงกัน การสนับสนุนที่เพิ่มขึ้นในเบราว์เซอร์และแอป

กิฟ

GIF รองรับเฉพาะความโปร่งใสแบบไบนารีเท่านั้น: พิกเซลมีความโปร่งใสเต็มที่หรือทึบแสงเต็มที่ ไม่มีความโปร่งใสกึ่ง จำกัดสีไว้ที่ 256 สี จึงไม่เหมาะสำหรับภาพถ่าย

TIFF

TIFF รองรับช่องอัลฟ่าและใช้ในเวิร์กโฟลว์ระดับมืออาชีพ พบได้น้อยสำหรับการจัดส่งทางเว็บเนื่องจากขนาดไฟล์ใหญ่

HEIC/HEIF

HEIC รองรับความโปร่งใสและเป็นรูปแบบเริ่มต้นใน iPhone หลายรุ่น QuickRemove ยอมรับ HEIC เป็นอินพุตและสามารถส่งออกผลลัพธ์ที่โปร่งใสใน PNG หรือ WEBP

รูปแบบที่ไม่สนับสนุนความโปร่งใส

JPG/JPEG ไม่รองรับความโปร่งใส โดยทั่วไปพื้นที่โปร่งใสจะเต็มไปด้วยสีทึบ (มักเป็นสีขาว) เมื่อแปลงจากรูปแบบที่รองรับอัลฟ่า หากคุณต้องการความโปร่งใส ให้ส่งออกเป็น PNG หรือ WEBP

BMP มีการสนับสนุนอัลฟ่าที่จำกัดในบางรูปแบบ แต่ไม่ค่อยได้ใช้สำหรับภาพที่โปร่งใส เลือกใช้ PNG หรือ WEBP เพื่อความเข้ากันได้แบบสากล

ความโปร่งใสทำงานอย่างไรในการออกแบบและเว็บ

เว็บ

เบราว์เซอร์เรนเดอร์ PNG และ WEBP แบบโปร่งใสบนพื้นหลังใดๆ ไม่ว่าจะเป็นสีขาว สี หรือการไล่ระดับสี รูปแบบกระดานหมากรุกที่คุณเห็นในโปรแกรมแก้ไขบางตัวเป็นเพียงตัวบ่งชี้ที่มองเห็นได้ มันไม่ปรากฏในภาพสุดท้าย

ซอฟต์แวร์การออกแบบ

เครื่องมือเช่น Photoshop, Figma และ Canva รองรับเลเยอร์ด้วยความโปร่งใส พื้นที่โปร่งใสช่วยให้ชั้นล่างแสดงผ่านได้ ส่งออกเป็น PNG (หรือ WEBP) เพื่อรักษาความโปร่งใสเมื่อย้ายเนื้อหาระหว่างแอป

พิมพ์

การพิมพ์ไม่มี "ความโปร่งใส" ในลักษณะเดียวกัน — คุณไม่สามารถพิมพ์อะไรเลยได้ สำหรับการพิมพ์ พื้นที่โปร่งใสจะเหลือเป็น "น็อคเอาท์" (ไม่มีหมึก) หรือเติมสีพื้นหลังที่กำหนด ปรึกษากับผู้ให้บริการการพิมพ์ของคุณ

ความเข้าใจผิดที่พบบ่อย

"พื้นหลังสีขาว = โปร่งใส"

ไม่ พื้นหลังสีขาวเป็นสีขาวทึบ ความโปร่งใสที่แท้จริงหมายความว่าไม่มีสี — พิกเซลจะมองไม่เห็น ผู้เริ่มต้นบางคนสับสนระหว่างฉากหลังสีขาวกับความโปร่งใส พวกเขาแตกต่างกัน

"ทุกรูปแบบภาพรองรับความโปร่งใส"

ไม่ JPG ไม่สนับสนุนความโปร่งใส ใช้ PNG หรือ WEBP เมื่อคุณต้องการ

"ความโปร่งใสทำให้ขนาดไฟล์เพิ่มขึ้นมาก"

ไฟล์ PNG ที่มีความโปร่งใสอาจมีขนาดใหญ่กว่า JPG แต่ช่องอัลฟ่านั้นไม่ได้เพิ่มขนาดเป็นสองเท่าเสมอไป การบีบอัดช่วยได้ WEBP มักจะได้ไฟล์โปร่งใสที่มีขนาดเล็กกว่า PNG

QuickRemove และความโปร่งใส

QuickRemove เป็นแอปเดสก์ท็อป Windows ที่สร้างภาพที่โปร่งใสโดยการลบพื้นหลัง มันส่งออก PNG (และสามารถทำงานกับ WEBP) เพื่อรักษาอัลฟ่าแบบเต็ม ภาพตัดของคุณสามารถวางบนพื้นหลังใดก็ได้ในเครื่องมือออกแบบ เว็บไซต์ หรือเวิร์กโฟลว์การพิมพ์ การประมวลผลทั้งหมดเกิดขึ้นในเครื่อง — รูปภาพจะไม่ออกจากพีซีของคุณ