เทคโนโลยี Portable Network Graphics

โดย ไตรรงค์  ปิมปา
ผู้อำนวยการส่วนพัฒนาระบบข้อมูลสารสนเทศ ศูนย์สารสนเทศทรัพยากรน้ำ

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

 


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

 


ภาพแสดงความโปร่งใส
เมื่อแสดงในโปรแกรมจัดการภาพ

เทคโนโลยี Portable Network Graphics เป็นเทคโนโลยีการบันทึกและแสดงภาพ แบบแรสเตอร์กราฟิก รูปแบบไฟล์ ที่รองรับ การบีบอัดข้อมูลแบบไร้การสูญเสีย PNG ถูกสร้างให้ดูดีขึ้น ทดแทนเทคโนโลยีกราฟฟิค Graphics Interchange Format (GIF) โดยไม่ต้องจดลิขสิทธิ์ภาพ และเป็นรูปแบบการบีบอัดภาพไร้การสูญเสีย เพื่อให้ใช้มากที่สุดบนอินเทอร์เน็ต

PNG สนับสนุนภาพจานสีที่ใช้ (กับจานสี 24 บิต, ระบบสี RGB - Red Green Blue หรือ 32 บิต, ระบบสี RGBA - Red Green Blue Alpha ซึ่งสี Alpha คือความโปร่งแสงและความทึบแสงของสี เมื่อใช้ทับซ้อนฉากหลัง), ภาพโทนสีเทา (มี หรือไม่มี ช่องอัลฟา) และเต็มรูปแบบสีที่ไม่ใช้จานสี RGB ภาพ (มี หรือไม่มี ช่องอัลฟา) PNG ได้รับการออกแบบสำหรับการถ่ายโอนภาพบนอินเทอร์เน็ต ไม่ได้ออกแบบสำหรับกราฟิคคุณภาพระดับมืออาชีพเพื่อพิมพ์ และดังนั้นจึงไม่สนับสนุนระบบอื่นนอกเหนือจาก RGB เช่น CMYK - Cyan Magenta Yellow blacK ซึ่งใช้ในงานพิมพ์ ที่มีระบบการพิมพ์สี่สี ในโรงพิมพ์ คือแม่สี ฟ้า ชมพูอมม่วง เหลือง และดำ

PNG จะใช้ไฟล์นามสกุล PNG หรือ png และ ชนิดของสื่อ image/png PNG ได้รับการอนุมัติสำหรับการใช้งานนี้ได้โดย กลุ่มร่วมวิศวกรรมอินเทอร์เน็ต วันที่ 14 ตุลาคม 1996 และได้รับการตีพิมพ์เป็นมาตรฐาน ISO/IEC ในปี 2004

เทคโนโลยี png สามารถใช้บริการปรับเปลี่ยน ตัดต่อ หรือออกแบบได้แล้วในหลายโปรแกรม หรือแอปต่างๆ  ในปัจจุบัน เช่น โปรแกรม โฟโต้ชอป รวมทั้งโปรแกรมที่เพิ่มมาในโอเอสรุ่นใหม่ เช่นวินโดส์ 7 ขึ้นไป การใช้งานเพียงแต่เมื่อบันทึก เลือกออปชั่น บันทึกเพื่อเว็บ (Save for Web) แล้วเลือก png ซึ่งสามารถเลือกจำนวนสี ความโปร่งแสง หรือรายละเอียดอื่นๆ ได้ที่นั่น

เปรียบเทียบกับไฟล์ชนิดอื่น

     เปรียบเทียบ PNG กับ Graphics Interchange รูปแบบ (GIF)

(ตัวอย่างภาพ .gif แสดงความโปร่งใสเห็นพื้นหลังของบราวเซอร์ และการเคลื่อนไหว)

  • ในภาพขนาดเล็ก, GIF สามารถบรรลุการบีบอัดมากกว่า PNG

  • ในภาพขนาดใหญ่ GIF จะมีขนาดไฟล์ที่มีขนาดใหญ่กว่า PNG เนื่องจากการจัดทำดัชนีของ PNG ให้ช่วงกว้างมาก โดยมีตัวเลือกที่โปร่งใสมากกว่า GIF, รวมทั้ง ช่องอัลฟา(สีแสดงระดับการโปร่งใส)

  • GIF ถูกจำกัดความ 8 บิต ดัชนีสี(ให้สี 256 สี), PNG ให้ช่วงกว้างมากของความลึกสีรวมทั้ง 24 บิต (ให้สี 16.7 ล้านสี หรือ 8 บิตต่อช่อง) และ 48 บิต (ให้สีกว่าพันล้านสี หรือ16 บิตต่อช่องทาง) ให้สีสมจริง (truecolor) เพื่อให้ความแม่นยำสีมากขึ้นเรียบเนียน และการจางหายไป ฯลฯ เมื่อช่องอัลฟาจะมีการเพิ่มขึ้นถึง 64 บิตต่อพิกเซล (ก่อนการบีบอัด) ที่เป็นไปได้

  • เมื่อแปลงภาพจากรูปแบบ PNG เป็น GIF คุณภาพของภาพอาจลดลงถ้า PNG ภาพมีน้อยกว่า 256 สี

  • GIF สนับสนุนภาพเคลื่อนไหว  PNG รองรับภาพเคลื่อนไหวเพียงผ่านทางส่วนขยายที่ไม่เป็นทางการ จากการคำนวณความน่าจะเป็นระหว่างจุดสี

  • ในบราวเซอร์รุ่นเก่า ภาพ PNG อาจแสดงได้ไม่ดี โดยเฉพาะอย่างยิ่ง IE6 หรือเก่ากว่า (ปัจจุบันเป็นรุ่น 11 ขึ้นไปแล้ว)

    เปรียบเทียบ PNG กับ Joint Photographic Experts Group (JPEG)

  • ภาพขวามือแสดงการเปรียบเทียบ JPEG และ PNG เมื่อขยายดู ภาพที่ได้รับการบีบอัดให้ขนาดแฟ้มเล็กลง แสดงการสูญเสียรายละเอียด มองเห็นได้ง่ายชัดเจนในพื้นหลังที่ PNG ภาพมีสีราบเรียบกว่า

  • JPEG รูปแบบสามารถผลิตไฟล์เล็กกว่า PNG สำหรับภาพถ่าย (และภาพเหมือนภาพถ่าย) ภาพ JPEG ใช้วิธีการลดรายละเอียดของภาพโดยออกแบบมาโดยเฉพาะสำหรับข้อมูลภาพถ่าย วิธีนี้ทำให้ภาพดูนุ่มนวลขึ้น ลดความเปรียบต่าง (Contrast) และเพิ่มสัญญาณรบกวน (Noise) ด้วยการสุ่มแสดงโครงสร้างที่ไม่สม่ำเสมอ ภาพ PNG ทดแทนการที่มีคุณภาพสูงสำหรับภาพ JPEG ด้วยการใช้ความโปร่งใสและโปร่งแสง ส่งผลให้เพิ่มขนาดไฟล์ใหญ่กว่าเล็กน้อย แต่คุณภาพดีกว่า ในทางตรงกันข้ามเมื่อการจัดเก็บภาพที่ข้อความประกอบด้วยศิลปะเส้นหรือกราฟิก

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

  • เพราะ PNG เป็น lossless จึงไม่ลดคุณภาพลงเมื่อแก้ไขภาพและบันทึกซ้ำ มันเหมาะสำหรับการจัดเก็บภาพที่จะแก้ไข PNG จึงมีประสิทธิภาพเมื่อบีบอัดภาพการถ่ายภาพที่มีรูปแบบการบีบอัด lossless ออกแบบมาโดยเฉพาะสำหรับการถ่ายภาพ อย่างไรก็ตามรูปแบบเหล่านี้อาจจะยังไม่ได้รับการสนับสนุนอย่างกว้างขวางหรือมีสิทธิเป็นเจ้าของ ภาพสามารถเก็บไว้ losslessly และแปลงเป็นรูปแบบ JPEG เท่านั้นสำหรับการจัดจำหน่าย

  • ข้อกำหนด PNG ไม่รวมถึงมาตรฐานสำหรับการฝัง ข้อมูลภาพจากแหล่งเพิ่มเติมจากต่างๆ เช่นกล้องดิจิตอล PNG มีชิ้นเสริมต่างๆโดยเฉพาะสำหรับการจัดเก็บข้อมูล เมตต้า ที่รูปแบบไฟล์อื่นๆ (เช่น JPEG) โดยปกติจะจัดเก็บในรูปแบบ Exif

  • เว็บเบราเซอร์ในช่วงต้นไม่สนับสนุน PNG ภาพ แต่ JPEG และ GIF เป็นรูปแบบภาพหลัก JPEG ที่ถูกใช้กันทั่วไปเมื่อส่งออกภาพที่มีการไล่ระดับสีสำหรับหน้าเว็บเพราะความลึกของสี จำกัด ของ GIF อย่างไรก็ตาม JPEG การบีบอัดทำให้เกิดการไล่ระดับสี จึงจะเบลอเล็กน้อย PNG ไฟล์จะทำซ้ำอย่างถูกต้องที่สุดในการไล่ระดับสีสำหรับความลึกบิต ในขณะที่การรักษาขนาดไฟล์เล็ก PNG กลายเป็นทางเลือกที่ดีที่สุดสำหรับภาพการไล่ระดับสีขนาดเล็กที่ได้รับการสนับสนุนเว็บเบราเซอร์สำหรับรูปแบบที่ดีขึ้น ไม่มีภาพที่ทุกคนมีความจำเป็นที่จะแสดงการไล่ระดับสีในเบราว์เซอร์ที่ทันสมัยเช่นการไล่ระดับสีที่สามารถสร้างขึ้นโดยใช้ CSS

คำแนะนำการเลือกใช้งานบนเว็บไซตฺ์

เพื่อให้การทำงานบนเว็บ เป็นไปอย่างรวดเร็ว และมีประสิทธิ์ภาพสูงสุด เลือกประเภทแฟ้ม ให้เหมาะกับการทำงาน ทั้งการออกแบบเว็บ หรือแม้แต่การส่งข้อมูลผ่านเฟซบุค ไลน์ เมล์ และการแชร์ในคลาวน์ระบบต่างๆ

การใช้งาน ควรใช้ เหตุผล
การนำเสนอภาพถ่าย  jpg ภาพแฟ้มเล็กกว่า ทำให้ดาวน์โหลดเร็ว และยังเลือกบีบอัดให้แฟ้มเล็กได้หลายขนาด ตามรายละเอียดความคมชัดที่ต้องการ
ภาพพื้นหลัง jpg ภาพแสดงรายละเอียดสูง สามารถนำมาเรียงต่อกันได้แนบเนียน
ภาพสำหรับพิมพ์ jpg สนับสนุนการใช้งานเพื่อการแยกสีที่ถูกต้องในการพิมพ์
ภาพไม่มีลิขสิทธิ์ png สนับสนุนการใช้งานโดยไม่จำกัดสิทธิ์
ภาพโปร่งแสง png สนับสนุนการไล่ระดับทึบแสง โปร่งแสง ถึงโปร่งใส หลายระดับ
ภาพรายละเอียดสูง png การบันทึกไม่มีการสูญเสียรายละเอียดสี รายละเอียดจึงครบถ้วน
ภาพวาด มีสีไม่มาก gif สีที่น้อยกว่า gif จะบีบอัดได้มากว่า
ภาพเคลื่อนไหว gif สนับสนุนการแสดงการเคลื่อนไหวต่อเนื่องได้หลายขั้นตอน
ภาพโปร่งใสขนาดเล็ก gif ขนาดเล็กกว่า แสดงได้เร็วกว่า เหมาะกับภาพที่โปร่งใสระดับเดียว

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


ขอบคุณข้อมูล

- ส่วนพัฒนาระบบข้อมูลสานสนเทศ - นานาน่ารู้ -

 

ส่วนพัฒนาระบบข้อมูลสารสนเทศ ศูนย์สารสนเทศทรัพยากรน้ำ 180/3 ซ.34 ถ. พระรามที่ 6 แขวงสามเสนใน เขตพญาไท กรุงเทพฯ 10400
โทร. 02-270-6000 ต่อ 6303