วิธีลดขนาดของ JPEG และไฟล์รูปภาพอื่นๆ

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

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

สมัครสมาชิกช่อง Youtube ของเรา

การเปลี่ยนประเภทไฟล์

“ขนาดไฟล์” สำหรับไฟล์รูปภาพหมายถึงจำนวนพิกเซลต่อนิ้ว โดยทั่วไป ยิ่งพิกเซลต่อนิ้วมากเท่าใด ไฟล์ก็จะยิ่งมีข้อมูลมากขึ้นเท่านั้น ดังนั้น ขนาดของไฟล์ก็จะยิ่งใหญ่ขึ้น

ไฟล์สองประเภทที่พบบ่อยที่สุดสำหรับรูปภาพคือ JPG และ PNG

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

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

นี่คือภาพตัวอย่าง รูปแบบเดิมเป็นไฟล์ JPG

ฉันใช้คำสั่ง File>Save As ใน Photoshop และเลือกรูปแบบ PNG และทำหน้าที่บันทึกให้เสร็จสิ้น

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

โปรดทราบว่ามีรูปแบบไฟล์อื่นๆ มากมาย ฉันเน้นที่ JPEG และ PNG เพราะเป็นที่นิยมมากที่สุด

การปรับขนาดด้วยตนเองใน Photoshop

ใน Photoshop คุณสามารถใช้ฟังก์ชัน Image>Image Size เพื่อปรับขนาดรูปภาพของคุณด้วยตนเอง เครื่องมือมีลักษณะดังนี้:

คุณสามารถดูขนาดรูปภาพปัจจุบันและขนาดพิกเซลที่ด้านบนของเครื่องมือ การปรับเปลี่ยนใดๆ ที่คุณทำที่นี่จะเปลี่ยนขนาด

Fit To คือรายการแบบเลื่อนลงที่มีขนาดที่กำหนดไว้ล่วงหน้าและการตั้งค่าพิกเซล

ถ้าฉันเลือกตัวเลือกแรกในรายการนั้นเพื่อปรับขนาดและพิกเซลต่อหน่วย (ppi) ฉันจะเห็นว่าขนาดไฟล์จะเปลี่ยนไปอย่างไร

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

บันทึกสำหรับฟังก์ชั่นเว็บ

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

ค้นหาตัวเลือกบันทึกสำหรับเว็บโดยไปที่ไฟล์>ส่งออก>บันทึกสำหรับเว็บ:

เมื่อหน้าต่างบันทึกสำหรับเว็บเปิดขึ้น คุณจะสังเกตเห็นข้อดีอีกอย่างของฟังก์ชันนี้ หากคุณเลือกแท็บ 2-up ที่ด้านบน คุณจะเห็นการเปรียบเทียบรูปภาพต้นฉบับเคียงข้างกับรูปภาพที่เปลี่ยนแปลง

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

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

เครื่องมือเพิ่มประสิทธิภาพรูปภาพ WordPress

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

จินตนาการ – ปรับแต่งรูปภาพทั้งหมดของคุณในครั้งเดียว ปรับขนาดได้อย่างง่ายดาย และกู้คืนรูปภาพเป็นเวอร์ชันดั้งเดิมเมื่อจำเป็น ราคาไม่แพงเกินไป ปลั๊กอินนี้ให้ดาวน์โหลดฟรีและมีพื้นที่ไฟล์ 20 MB ตัวเลือกอื่นๆ คือ $5 ต่อเดือนสำหรับ 500MB และ $10 ต่อเดือนสำหรับพื้นที่ไม่จำกัด

ShortPixel – ไม่มีการจำกัดขนาดไฟล์และคีย์ API หนึ่งคีย์สำหรับหลาย ๆ ไซต์ทำให้สามารถใช้งานได้อย่างยอดเยี่ยมสำหรับปลั๊กอินนี้ พวกเขายังเสนอแผนแบบครั้งเดียวและรายเดือนสำหรับความยืดหยุ่นของงบประมาณ

Optimole – สำหรับข้อมูลที่มุ่งเน้น Optimole มีแดชบอร์ดที่คุณสามารถตรวจสอบสถิติการปรับให้เหมาะสมได้ แผนฟรีของพวกเขาอนุญาตให้มีผู้เข้าชม 5,000 คนต่อเดือนและแบนด์วิดท์ไม่จำกัด

สำหรับการเปรียบเทียบที่สมบูรณ์ยิ่งขึ้นของตัวเลือกเหล่านี้และตัวเลือกอื่นๆ บางส่วน โปรดดูบทความนี้

แหล่งข้อมูลบนเว็บสำหรับการเพิ่มประสิทธิภาพภาพ

หากคุณไม่มีเวลาและ/หรือเงิน มีเครื่องมือเพิ่มประสิทธิภาพรูปภาพออนไลน์ฟรีมากมาย

Compressjpg อนุญาตให้คุณอัปโหลดหลายไฟล์และปรับขนาดทั้งหมดพร้อมกัน นอกจากนี้ยังมีคุณสมบัติที่จะแปลงภาพถ่ายรูปแบบ iPhone HEIC เป็น JPEG เว็บไซต์อื่นที่คล้ายคลึงกันคือ Tinypng และ Image Compressor

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

ห่อ

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

คุณใช้วิธีการเหล่านี้เพื่อปรับขนาดภาพของคุณหรือไม่? ถ้าไม่ คุณคิดว่าคุณจะลองอันไหนก่อน บอกเราในความคิดเห็น!

ภาพเด่นผ่าน Prihanto Edi / shutterstock.com