วิธีลดขนาดของภาพ และการเซฟภาพ สำหรับใช้บนเว็บไซต์
วิธีลดขนาดของภาพ และการเซฟภาพ สำหรับใช้บนเว็บไซต์
  •  1. เปิดโปรแกรม Photoshop เลือกเปิดไฟล์ที่ต้องการ ทำการลดขนาดของภาพ  โดยคลิกที่ File --> Open --> เลือกไฟล์ที่ต้องการ



     
  • 2. ทำการเลือกเปิดรูปภาพที่เราต้องการจะลดขนาด เพื่อนำมาใช้บนเว็บไซต์



     
  • 3. หลังจากที่ได้ทำการเปิดรูปภาพขึ้นมาแล้ว ให้ทำการเลือกที่เมนู Image --> Image Size...



     
  • 4. จะพบหน้าต่างใหม่ ซึ่งจะมีค่าความกว้าง และความสูงของรูปภาพที่เลือกมาแสดงอยู่ 



     
  • 5. ทำการเปลี่ยนขนาดภาพให้ลดลงตามที่ต้องการ โดยการเปลี่ยนค่าที่ Pixel Dimensions ในส่วนของ Width (ความกว้าง) และ Height (ความสูง) ค่าที่เราใส่เข้าไปใหม่นี้ ไม่ว่าจะใส่ในค่าของความสูง หรือความกว้างก็ตาม ค่าของอีกตัวเลือกหนึ่งก็จะมีการแปรผันตามอัตโนมัติ  สำหรับงานเว็บไซต์แนะนำว่าควรให้ Resolution อยู่ที่ 72 pixels/inch หลังจากเปลี่ยนขนาดเสร็จแล้วก็เลือกที่ OK


     
    • 5.1 หากทำการนำเครื่องหมายถูกหน้าตัวเลือก Constrain Proportions ออก จะเห็นว่า สัญลักษณ์รูปโซ่ที่แสดงอยู่ข้างหลัง Width และ Height จะหายไป และสามารถที่จะใส่ค่าความสูง และความกว้างแบบอิสระให้แก่ภาพ โดยที่ค่าของอีกตัวเลือกหนึ่งจะไม่แปรผันตาม



       
  • 6. วิธีการ save รูปภาพสำหรับนำไปใช้บนเว็บไซต์  โดยคลิกที่เมนู File --> Save for web...



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


 

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



     
    8.1 หากเราทำการเลือกที่ Transparency จะเป็นการเลือกเพื่อให้พื้นหลังของภาพโปร่งใส




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

None  ภาพจะไม่มีขอบ หรือขอบไม่คมชัด
White  ภาพจะมีขอบสีขาว เหมาะสำหรับใช้บนพื้น Background สีขาว
Black  ภาพจะมีขอบสีดำ เหมาะสำหรับใช้บนพื้น Background สีดำ
Other  เป็นการเลือกสีขอบภาพให้ตรงกับสีพื้น Background ที่เรามีอยู่
 

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

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




Useful Area