Templates by BIGtheme NET

การใช้งานภาพกราฟฟิก



ประเภทของไฟล์รูปภาพ

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

1. ไฟล์ประเภท GIF (Graphics Interchange Format)
เป็นไฟล์ภาพที่มีขนาดเล็ก คุณภาพต่ำ เนื่องจากถูกบีบอัดข้อมูลให้มีขนาดเล็ก แสดงสีได้ 256 สี แต่เป็นที่นิยมสำหรับผู้เขียนเว็บเพจเป็นอย่างมากเนื่องจากสามารถทำเป็นภาพเคลื่อนไหว (Animation) และกำหนดให้แสดงภาพแบบโปร่งแสง มองทะลุไปด้านหลังได้ ไฟล์ประเภทนี้ส่วนใหญ่จะเป็น รูปวาด ภาพการ์ตูน รูป icon, emotion, ป้ายโฆษณาแบนเนอร์ และภาพที่ไม่ต้องการความละเอียดมากนัก

ตัวอย่าง

รูป emotion ต่างๆ

สามารถทำภาพแบบโปร่งแสงได้ เมื่อนำไปวางบนพื้นหลังสีอะไร ด้านหลังรูปจะเป็นสีตามพื้นหลัง

2. ไฟล์ประเภท JPEG หรือ JPG (Joint Photographics Expert Group)
เป็นไฟล์รูปภาพที่มีการบีบอัดข้อมูลน้อยกว่าไฟล์ประเภท GIF สามารถแสดงสีได้ 16.7 ล้านสี ภาพที่ได้จะมีความคมชัดมาก ไฟล์ประเภทนี้เหมาะกับภาพที่ต้องการความละเอียดสูง เช่น ภาพถ่ายจากกล้องดิจิตอลหรือ ภาพที่ได้จากการสแกน ภาพที่แสดงการไล่เฉดสี เป็นต้น

ตัวอย่าง
ลี่เจียง

.

3. ไฟล์ประเภท PNG (Portable Network Graphic)
เป็นไฟล์ภาพที่นำมาใช้แทนที่ไฟล์ประเภท GIF เนื่องจากสามารถแสดงภาพได้เร็วกว่า แต่ยังไม่ค่อยแพร่หลายมากนักเนื่องจากไม่สามารถทำเป็นภาพเคลื่อนไหวได้ และมีข้อเสียที่ไม่สามารถใช้กับเว็บเบราเซอร์รุ่นเก่าได้

PNG-8 เป็นรูป แบบที่ใช้สีได้เพียง 256 สี และมีคุณสมบัตคล้ายกับไฟล์ GIF จึงเหมาะสำหรับใช้ทำภาพที่มีสีเรียบๆ เช่น ภาพโลโก้, การ์ตูน สามารถกำหนดพื้นหลังให้โปร่งแสงได้

PNG-24 เป็นรูป แบบที่ใช้สีได้ 16.7 ล้านสี เช่นเดียวกับไฟล์ JPG เหมาะสำหรับภาพถ่าย

ตัวอย่าง

คุณอาจสนใจเรื่องนี้

แนวทางการดีไซน์บล็อกยุคใหม่ (ตอน2)

6. ส่วนแสดงความคิดเห็น(Comments) ส่วนความคิดเห็น เป็นบริเวณที่มีการถกกันเกี่ยวกับบทความจากผู้อ่าน/ผู้เยี่ยมชม หน้าที่ของผู้ออกแบบ จะต้องออกแบบให้บริเวณนี้ดูเป็นการสนทนากัน ด้วยการแยกแต่ละความคิดเห็นออกจากกัน อาจจะด้วยการกำหนดหมายเลขให้แต่ละความคิดเห็น วิธีนี้ยังช่วยให้ง่ายต่อการอ้างอิงความคิดเห็นต่าง ๆ อีกประการ คือแยกความคิดเห็นของเจ้าของบทความ ให้ต่างจากความคิดเห็นทั่วไป เพื่อเอาไว้คั่นว่าได้ตอบความเห็นของผู้อ่านถึงไหนแล้ว หรือ ...

2 ความคิดเห็น

  1. ถามหน่อยคับ ผมทำเว็ปแล้วใส่รูปลงไป แล้วทำไมเวลาย่อหน่าต่างรูปจะเลือนไม่อยู่ต้องตำแหน่งอะคับ

  2. ขึ้นอยู่กับการกำหนดขนาด และตำแหน่งวัตถุ ว่าเป็นแบบยืดหยุ่น หรือ แบบ fix

    เช่น ถ้าเรากำหนดแบบยืดหยุ่นใช้เป็น % พอย่อหน้าต่าง วัตถุมีขนาดใหญ่กว่าพื้นที่ ตำแหน่งจึงเลื่อน

    แต่ถ้าเรากำหนดแบบ fix ไปเลยว่าให้กว้างยาวกี่ pixel และให้วัตถุอยู่ที่ตำแหน่งไหนเป็น pixel
    เวลาย่อหน้าต่าง มันจะอยู่ที่ตำแหน่งเดิม เหมือนเว็บ enjoyday.net และเว็บส่วนใหญ่ในปัจจุบัน
    ลองย่อหน้าต่างดูค่ะ

    http://www.enjoyday.net/webtutorial/css/css_chapter24.html

Leave a Reply

Your email address will not be published. Required fields are marked *