Group Blog
 
<<
มิถุนายน 2548
 
 1234
567891011
12131415161718
19202122232425
2627282930 
 
5 มิถุนายน 2548
 
All Blogs
 
Blog tips เก็บ ๆ เค้ามา #8 ภาพกับนามสกุล





เรื่องของภาพ









นามสกุลของภาพ

ก่อนที่เราจะเริ่มการแทรกภาพเข้าไปในหน้า blog มารู้จักนามสกุลของภาพกันก่อนครับ





GIF



GIF หรือ Graphics Interchange Format คือ การเก็บข้อมูลภาพในรูปที่ขนาดเล็ก GIF เป็นที่นิยมสูงมาก โดยใช้ในกรณีของภาพขนาดเล็ก เช่น icon หรือแผนภูมิ หรืแแม้แต่ภาพที่มีจำนวนสีไม่มาก หรือสีเดียวได้โดย loss-less คือไม่มัว หรือไม่มีการเบลอ เทคนิคที่ใช้ในการบีบอัดข้อมูลเรียกว่า LZW compression โดยกลไกคือหาว่า pixels ใดที่มีรูปแบบซ้ำ ๆ กัน ซึ่งจะไม่ลดคุณภาพของภาพ

ตามปกติ จะจำกัดขนาดของสีสูงสุดที่ 256 สี (หรือเรียก 8 bit = 28)ทำให้ภาพนั้นมีความสวยสดสมจริงน้อย แต่ก็สามารถใช้กลวิธีที่เรียกกันว่า Dither คือผสมสีพื้น ๆ สองสีให้ได้สีที่ใกล้เคียงกับสีต้นฉบับครับ แต่ไม่สวยเท่าไหร่หรอก

นอกจากนี้ยังทำเป็นภาพเคลื่อนไหว file animated ได้ด้วย จำพวก banner โค-สะ-นา นั่นล่ะ แล้วยังเลือกสีให้โปร่งแสง (transparency) ได้ด้วย (single-bit transparency) เช่น เหม็นหน้าสีม่วงมาก ลบซะ ตรงที่เคยเป็นสีม่วงจะหายไปเกิดช่องใส ๆ ใน pixels ที่เดิมเป็นสีม่วงซะ ก็จะทำให้มองทะลุไปยัง background ของ blog หรือของ page นั้น ๆ ได้น่ะเองครับ

นอกจากนี้ยัง interlaced ได้ด้วย ก็คือว่ามันจะค่อย ๆ มีภาพจากหยาบ ๆ ค่อย ๆ ไปละเอียด ทำให้รูปลาง ๆ มาเร็วหน่อย ไม่ต้องคอยจนครบค่อยมาทีเดียว ทำนองนั้น ทำให้รู้สึก (หลอก ๆ) ว่ามันเร็วขึ้นน่ะเองล่ะครับ ที่นิยมนำมาใช้คือการนำมาใช้สร้าง icon ต่าง ๆ และภาพ animation ครับ





JPEG



JPEG หรือ Joint Photographic Experts Group บ้างก็เรียก JPG เฉย ๆ ครับ กลุ่มนี้จะสีสันสดใสกว่า ด้วยว่าแบ่งเฉดสีได้ถึง 16 bit ดีเดียว การเก็บข้อมูลนี้เพื่อให้รูปถ่ายสีสดสมจริงโดยไม่ต้องอาศัยวิธี Dither เลยครับ ทำให้มีการผสมฉีดเฉดต่าง ๆ ได้กลมกลืนทีเดียว

หลักการบีดอัดนั้นค่อนข้างซับซ้อน หลักการบียอัดก็ง่าย ๆ โดยทำเป็นเลือกไม่จำรายละเอียดของภาพ โดยจะสามารถเลือกเป็นระดับได้ เช่น ถ้าเลือก 0% compression คือ ไม่บีบอัดเลย ภาพจะคมชัดเท่าต้นฉบับ ถ้า compression มาก ๆ ก็จะไม่ชัดเลยเพราะว่ารายละเอียดหายเหี้ยน ว่างั้น แต่ว่าถ้าไม่บีบอัดเลยก็จะมีขนาด file ใหญ่มาก ดังนั้นแล้วจึงพบว่าการบีบอัดข้อมูลที่ 60% นั้นให้ผลลัพธ์สมดุลครับ คือ ไม่ใหญ่และไม่มัว

การ interlaced นั้น แม้ว่าจะทำได้แต่ว่าไม่สามารถทำ animation และ transparency ได้เหมือนกัน GIF จึงนิยมเก็บไว้เก็บภาพถ่ายแต่อย่างเดียวครับ สำหรับพวก graphic ที่มีสีเดียวกันใหญ่ ๆ เนี่ยไม่ควรเก็บในรูป JPG เพราะขอบภาพจะเบลอเนื่องจากมันพยายามจะให้สีละเอียดเกิน จนไล่สีมากไป ขาดความคมชัดครับ

ตอนนี้เค้ามีระบบ JPEG (อ่าน เจ-เปก) แล้ว นัยว่าสวยดีขึ้นครับ






PNG



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

แต่ก่อนนี้ PNG-8 ก็มี 256 สีเท่ากับ GIF รวมทั้งมี 1 bit transparency ด้วย แต่พบว่าขนาด file เล็กกว่าเพราะการบีบอัดข้อมูลมันดีกว่า

ต่อมา PNG-24 ก็เข้ามาตีตลาดโดยมีสี 24 bit ครับ คราวนี้สีสรรบรรเจิดเท่า JPG เลยละครับ เลยอาจจะกลายเป็นตัวแทน JPG ซะแล้ว แต่ว่ามันดันมีมีระบบบีบอัดข้อมูลแบบ loss-less ด้วยทำให้ขนาดภาพใหญ่กว่าการเก็บด้วยระบบ JPG ครับ

PNG เริ่มมีการใช้ alpha-channels ซึ่งตามปกติหากเราจะทำให้สีใดโปร่งใส (transparency) ก็อาจให้ผลเป็นสีโปร่งหรือทึบก็ได้ แต่ว่าระบบนี้ทำให้กำหนดได้ว่า สีใดใน 0-255 สีที่จะกำหนดให้กลาย transparency ได้โดยถ้าหากว่า 0 ก็ใสมาก ถ้า 255 ก็ออกทึบมาก เลยทำให้มีผลแบบเห็นลาง ๆ เหมือนกับเห็นภาพวิญญานได้ครับ [เทียบน่ากลัวไปไหมเนี่ย...(-"- ) ] ปัญหาก็คือ IE 6 หรือ internet explorer 6 ของเราไม่หนับหนุน alpha channels ครับ ถ้า IE รุ่นใหม่ออกมาล่ะก็...

สำหรับการทำภาพเคลื่อนไหวด้วย PNG นั้นสามารถทำได้โดยใช้ระบบ MNG (Multi-image PNG) ซึ่งตอนนี้ส่วนใหญ่ browser ยังไม่ค่อยสนับสนุนระบบนี้น่ะครับ


สำหรับระบบอื่น ๆ นั้นไม่เป็นที่นิยมในการนำมาสร้างในหน้า web และ blog ครับ เช่น .tiff .bmp .pxr เพราะฉะนั้น วันหลังค่อยอ่านมาเล่าอีกทีนะครับ







[สมุดเยี่ยม]









Create Date : 05 มิถุนายน 2548
Last Update : 2 ธันวาคม 2549 22:58:00 น. 5 comments
Counter : 1707 Pageviews.

 
แวะเข้ามาดูจ้า


โดย: ไม่รักไม่มา ...Naka วันที่: 5 มิถุนายน 2548 เวลา:4:06:14 น.  

 
แอบย่องมาดู สีสวยดีน่อ จิ๊กสีไปใช้ดีกว่าอิอิ


โดย: รำเพย วันที่: 5 มิถุนายน 2548 เวลา:6:34:30 น.  

 

รู้ไว้ใช่ว่า...ใส่บ่าแบกหามค่ะ


โดย: Big Spender วันที่: 5 มิถุนายน 2548 เวลา:6:40:24 น.  

 
ป้ามดมานั่งเรียนค่ะ


โดย: ป้ามด วันที่: 22 กรกฎาคม 2548 เวลา:8:38:08 น.  

 
xfathjtc0xp6k xfathjtc0xp6k xfathjtc0xp6k xfathjtc0xp6k xfathjtc0xp6k3


โดย: funny ringtones IP: 218.226.227.110 วันที่: 26 พฤศจิกายน 2549 เวลา:3:42:26 น.  

ชื่อ : * blog นี้ comment ได้เฉพาะสมาชิก
Comment :
  *ส่วน comment ไม่สามารถใช้ javascript และ style sheet
 

dont wanna no
Location :


[ดู Profile ทั้งหมด]

ฝากข้อความหลังไมค์
Rss Feed

ผู้ติดตามบล็อก : 2 คน [?]




Friends' blogs
[Add dont wanna no's blog to your web]
Links
 

 Pantip.com | PantipMarket.com | Pantown.com | © 2004 BlogGang.com allrights reserved.