หน่วยท่ี 1 ความรู้เกี่ยวกับกราฟิก
ประกอบด้วยแผนการสอนทัง้ 3 บท ดงั นี้
บทที่ 1 : ความหมายของกราฟกิ (2 ช่วั โมง)
บทท่ี 2 : ประเภทของไฟล์ภาพ (2 ช่ัวโมง)
บทที่ 3 : ระบบสีในงานกราฟิก (2 ชว่ั โมง)
การสร้างภาพกราฟกิ หรือการตกแตง่ ภาพกราฟกิ ประเภทของไฟลภ์ าพกราฟกิ เป็นอีกปัจจยั หนึ่งท่มี ี ความสาคัญ
เพราะความละเอียดของไฟล์ภาพจะส่งผลกับขนาดของภาพ เชน่ ภาพทีน่ ามาใชง้ าน บนเว็บเพจควรจะต้องมีขนาด
เลก็ เพื่อนาไปเรียกใช้งานบนเว็บเพจได้อยา่ งรวดเร็ว ประเภทของไฟล์ภาพกราฟิกท่ีนยิ มใช้โดยทั่วไป
1. มคี วามรู้ ความเข้าใจเกี่ยวกับประเภทของไฟลภ์ าพกราฟิก
2. มคี วามรู้ ความเขา้ ใจเก่ียวกบั การคน้ หาไฟล์ภาพบนอนิ เตอร์เนต็
3. สามารถประยุกต์ใช้งานประเภทของไฟล์ของภาพกราฟิกตา่ งๆไดเ้ หมาะสม
4. สามารถคน้ หาไฟล์ภาพจากอินเตอร์เนต็ และบันทกึ ไฟล์นามสกุลตา่ งๆได้
5. มจี ริยธรรมท่ดี ใี นการใชง้ านอินเตอร์เน็ตสาหรบั สืบค้นข้อมูลรูปภาพต่างๆ
2.1 ประเภทไฟล์ของภาพ
2.2 การค้นหาภาพบนอนิ เตอรเ์ น็ต
ใบงานท่ี 1.2
กิจกรรมกลุ่ม
แผนท่ี 2 ประเภทของไฟลภ์ าพ
2.1 ประเภทของไฟลภ์ าพกราฟกิ
การสรา้ งภาพกราฟกิ หรือการตกแต่งภาพกราฟิกประเภทของไฟลภ์ าพกราฟิกเป็นอีกปจั จัยหนง่ึ ทมี่ ี
ความสาคัญ เพราะความละเอยี ดของไฟล์ภาพจะส่งผลกบั ขนาดของภาพ เชน่ ภาพทีน่ ามาใชง้ าน บนเว็บเพจควร
จะตอ้ งมีขนาดเล็ก เพ่ือนาไปเรยี กใช้งานบนเวบ็ เพจได้อย่างรวดเร็ว ประเภทของไฟลภ์ าพกราฟิกที่นิยมใช้
โดยทวั่ ไป ไดแ้ ก่
2.1.1 JPEG หรือ JPG (Join Photographic Export Group)
เป็นรูปแบบไฟลท์ เ่ี ก็บภาพแบบราสเตอร์ท่ีไม่ต้องการคุณภาพสงู มากนัก เช่น ภาพถ่ายจากกลอ้ งดจิ ติ อล
ภาพถ่ายจากโทรศัพท์มือถือและภาพกราฟิกสาหรับแสดงบนอินเทอรเ์ น็ต สามารถแสดงสไี ด้ถึง 16.7 ล้านสี เป็น
ไฟลภ์ าพชนิดหนึง่ ท่ีได้รบั ความนิยม เพราะไฟลม์ ีขนาดเลก็ สามารถบบี อัดข้อมูลได้หลายระดบั
จุดเดน่
1. สนับสนุนสไี ด้ถงึ 24 bit
2. แสดงสไี ดถ้ งึ 16.7 ลา้ นสี
3. สามารถกาหนดค่าการบบี อดั ไฟลไ์ ด้ตามที่ต้องการ
4. มรี ะบบแสดงผลแบบหยาบและค่อย ๆ ขยายไปสลู่ ะเอียดในระบบโพรเกรสซีฟ (Progressive)
5. มีโปรแกรมสนับสนุนการสร้างจานวนมาก
6. เรยี กดูไดก้ ับบราวเซอร์ (Browser) ทุกตัว
จุดด้อย
1. ไม่สามารถทาภาพให้มีพืน้ หลงั แบบโปรง่ ใส (Transparent) ได้
2. ทาภาพเคลอ่ื นไหว (Animation) ไมไ่ ด้
2.2.2 GIF (Graphic Interchange Format)
เป็นไฟลภ์ าพท่ีสามารถบบี อดั ข้อมลู ให้มีขนาดเล็กได้ส่วนมากจะนาไปใชบ้ นั ทึกเปน็ ไฟลภ์ าพ เคลื่อนไหว
และนิยมมากในการใชง้ านบนเวบ็ เพจ
จดุ เดน่
1. สามารถใช้งานข้ามระบบไมว่ า่ จะเปน็ ระบบปฏบิ ัติการวินโดวส์ (Windows) หรอื ระบบปฏิบัติการ
ยูนกิ ซ์ (Unix) กส็ ามารถเรยี กใชไ้ ฟล์ภาพสกุลนี้ได้
2. ภาพมขี นาดไฟลต์ ่า จากเทคโนโลยกี ารบีบอดั ภาพทาใหส้ ามารถสง่ ไฟลภ์ าพได้อย่างรวดเรว็
3. สามารถทาภาพพน้ื หลงั แบบโปร่งใสได้
4. มโี ปรแกรมสนับสนุนการสรา้ งจานวนมาก
5. เรียกดูไดก้ ับบราวเซอรท์ กุ ตวั
6. สามารถนาเสนอแบบภาพเคลอื่ นไหวได้
จดุ ด้อย
1. แสดงสีไดเ้ พียง 256 สี
2. ไมเ่ หมาะกับภาพทตี่ อ้ งการความคมชดั หรอื ความสดใส
2.2.3 PNG (Portable Network Graphics)
แผนท่ี 2 ประเภทของไฟล์ภาพ
เป็นชนิดของไฟลภ์ าพทนี่ าจดุ เด่นของไฟลภ์ าพแบบ GIF และแบบ JPG มาพัฒนารว่ มกัน ทาให้
ไฟลภ์ าพชนิดนีแ้ สดงสีได้มากกวา่ 256 สี และยงั สามารถทาพื้นหลังภาพให้โปร่งใสได้ จงึ เป็นไฟลภ์ าพทไ่ี ดร้ ับความ
นยิ มมากในปัจจุบัน
จุดเดน่
1. สนบั สนนุ สไี ดต้ ามค่า True color (16 bit, 32 bit หรือ 64 bit)
2. สามารถกาหนดค่าการบบี อดั ไฟล์ได้ตามท่ีต้องการ
3. ทาภาพพืน้ หลังแบบโปรง่ ใสได้
จดุ ด้อย
1. หากกาหนดคา่ การบีบอดั ไฟล์ไว้สงู จะใชเ้ วลาในการคลายไฟล์ภาพสงู ตามไปด้วย
2. ไมส่ นับสนนุ กบั บราวเซอรร์ ุน่ เก่า
3. โปรแกรมสนบั สนนุ ในการสรา้ งมีน้อย
2.2.4 BMP (Bitmap)
เป็นรูปแบบของไฟลภ์ าพมาตรฐานที่ใชไ้ ดใ้ นระบบปฏิบตั กิ ารวนิ โดวส์โดยมีลักษณะการจัดเก็บ ไฟล์ภาพ
เปน็ จดุ สีทีละจุดจงึ ทาใหภ้ าพดเู สมือนจรงิ
จุดเดน่
1. แสดงรายละเอียดสีได้ 24 บิต
2. ไมม่ ีการสญู เสยี ข้อมูลใด ๆ เม่อื มีการย่อหรือขยายภาพ
3. นาไปใชง้ านไดก้ ับทุกโปรแกรมในระบบปฏิบัตกิ ารวนิ โดวส์
จดุ ดอ้ ย
1. ภาพมีขนาดใหญม่ ากจึงใชเ้ น้ือทีใ่ นการจัดเกบ็ ค่อนข้างมาก
2. ความละเอยี ดของภาพอาจจะไมช่ ัดเจนเหมือนตน้ ฉบับ
2.2.5 TIF หรือ TIFF (Tagged Image File)
เปน็ ไฟล์ทใ่ี ชเ้ ก็บภาพแบบราสเตอรค์ ุณภาพสงู เช่น ภาพกราฟิกที่นาไปทางานดา้ นสิง่ พมิ พ์ (Artwork)
สามารถเกบ็ ข้อมูลของภาพไวไ้ ดค้ รบถ้วน ทาใหค้ ุณภาพของสีเหมือนต้นฉบับ
จดุ เด่น
1. สามารถใชง้ านขา้ มระบบ ไม่ว่าจะเป็นระบบปฏบิ ัตกิ ารวนิ โดวส์หรือระบบปฏบิ ัตกิ ารยูนกิ ซ์
ก็สามารถเรียกใช้ไฟล์ภาพชนดิ น้ไี ด้
2. แสดงรายละเอยี ดสไี ด้ 48 บิต
3. ไฟลม์ ีความยดื หยนุ่ สงู สามารถเปล่ียนแปลงแก้ไขได้
4. เมอ่ื มีการบีบอัดไฟล์จะมีการสูญเสยี ขอ้ มลู น้อยมาก
5. มโี ปรแกรมสนบั สนนุ การสร้างจานวนมาก
จดุ ด้อย
1. ไฟลภ์ าพมีขนาดค่อนข้างใหญ่
2. ใช้พน้ื ทีใ่ นการจัดเก็บไฟล์ภาพสงู
2.2.6 PSD (Photoshop Document)
เป็นไฟล์ภาพเฉพาะโปรแกรม Adobe Photoshop จะทาการบนั ทกึ แบบแยกเลเยอร์ (Layer)
โดยเกบ็ ประวตั ิการทางานและรายละเอียดการตกแต่งภาพ เอาไว้ เพื่องา่ ยต่อการแก้ไขในภายหลัง
จุดเด่น
1. มีการบนั ทกึ แบบแยกเลเยอรแ์ ละเกบ็ ประวตั ิการทางานทุกข้นั ตอน
2. สามารถนาไฟล์ภาพมาแก้ไขได้ในภายหลัง
จุดดอ้ ย
1. ไฟลภ์ าพมีขนาดใหญ่เมื่อเทียบกับไฟล์ภาพประเภทอ่ืน
2. ไม่สามารถเปดิ ใชง้ านในโปรแกรมอื่นได้
2.2 การคน้ หาภาพบนอินเตอร์เน็ต
เราสามารถค้นหารปู ได้แสนงา่ ย ความสามารถท่ีผ้ใู ชส้ ่วนใหญ่ชอบกันนกั หนา และสรา้ งช่ือ
ใหก้ ับ Google กค็ ือการคน้ หารปู ภาพดว้ ย Google
Search วธิ กี ารใช้ กค็ อื
1. คลิกเมนูลงิ ค์ รูปภาพ จากนนั้ ก็พิมพ์ช่ือภาพทตี่ อ้ งการคน้ หา และคลกิ ป่มุ คน้ หารูปภาพ ดงั รปู
(หากต้องการค้นหาภาพนามสกลุ ตา่ งๆ สามารถเตมิ ชื่อนามสกุลตอ่ ท้ายคาค้นหา
ได้ เชน่ doraemon .gif ผลลัพธค์ อื จะแสดงภาพเคล่ือนไหว gif เท่านัน้ หากเราระบุนามสกลุ ท่ีต้องการ)
2. จะปรากฏรูปภาพทง้ั หมดท่ตี ้องการดังรปู