วิธีปรับขนาดรูปภาพโดยไม่สูญเสียคุณภาพ

คำตอบสั้น ๆ: วิธีปรับขนาดโดยไม่สูญเสียคุณภาพได้อย่างไร?

สำหรับภาพเดียว ให้ใช้ Image Resizer; สำหรับหลายไฟล์ ให้ใช้ ImageMagick สำหรับขั้นตอนการทำงานที่กว้างขึ้น ดูได้ที่ how to batch resize

"การไม่สูญเสียคุณภาพ" หมายความว่าอย่างไรกันแน่?

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

กรณีที่การปรับขนาดทำให้สูญเสียคุณภาพที่มองเห็นได้นั้นมีขอบเขตเฉพาะเจาะจง:

• Upscaling (การทำให้ภาพมีขนาดใหญ่ขึ้น) ไม่สามารถเพิ่มรายละเอียดจริงได้ — ดูที่ วิธีอัปสเกลรูปภาพ
• การบังคับขนาดที่แน่นอน จะทำให้ภาพผิดรูปจากการยืดขยาย
• การใช้ฟิลเตอร์ที่ไม่ดี (nearest-neighbor) จะทำให้ภาพที่ย่อขนาดดูเป็นเหลี่ยมๆ

หากทำสามข้อนี้ได้ถูกต้อง การลดขนาดก็จะถือว่าสูญเสียคุณภาพได้อย่างมีประสิทธิภาพที่ขนาดเป้าหมาย

ทำไมจึงควรคงอัตราส่วนภาพ?

อัตราส่วนภาพคือความกว้างต่อความสูง หากคุณปรับขนาดโดยไม่คงอัตราส่วนไว้ เช่น การบังคับรูปถ่าย 3:2 ให้เข้ากรอบ 16:9 ภาพจะยืดและดูผิดรูปเสมอ ควรปรับขนาดโดยระบุเพียงมิติเดียว (เช่น ความกว้าง 1920) และปล่อยให้ความสูงคำนวณตามอัตโนมัติ

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

ควรใช้ฟิลเตอร์รีแซมปลิ้งตัวไหนดี?

ฟิลเตอร์รีแซมปลิ้งจะกำหนดวิธีการคำนวณพิกเซลใหม่จากพิกเซลเดิม สำหรับการลดขนาดภาพ (downscaling) รูปถ่าย Lanczos เป็นตัวเลือกที่ดีที่สุดโดยทั่วไป — ให้ความคมชัดโดยไม่มีอาการริ่ง (ringing). Bicubic อยู่ในอันดับรองลงมา; bilinear เร็วกว่าแต่ให้ผลที่นุ่มกว่า; nearest-neighbor ใช้ได้เฉพาะกับงาน pixel art เท่านั้น

ใน ImageMagick, -filter Lanczos จะเลือกใช้ฟิลเตอร์นี้ โปรแกรมแก้ไขส่วนใหญ่จะตั้งค่าเริ่มต้นเป็นฟิลเตอร์ที่ดีสำหรับการลดขนาดภาพ ดังนั้นคุณจึงไม่จำเป็นต้องเปลี่ยนมันบ่อยนัก เอกสาร ImageMagick resize documentation และบทความ Wikipedia article on Lanczos resampling ได้กล่าวถึงฟิลเตอร์และการแลกเปลี่ยนข้อดีข้อเสียของมันอย่างละเอียด

ทำไมต้องปรับขนาดก่อนบีบอัด?

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

เมื่อวัดจากรูปภาพหนึ่งรูป การปรับขนาด + บีบอัดสามารถลดขนาดไบต์ได้ประมาณ ~85% เทียบกับเพียงการบีบอัดที่ทำได้แค่ ~30% ดูวิธี how to compress JPEG

ต้องเลือกขนาดเป้าหมายอย่างไร?

ขนาดเป้าหมายที่ถูกต้องคือขนาดการแสดงผล ไม่ใช่ "ใหญ่ที่สุดเท่าที่จะทำได้" ให้จับคู่ขอบที่ยาวที่สุดกับตำแหน่งที่รูปภาพจะแสดง โดยเผื่อบัฟเฟอร์เล็กน้อยสำหรับหน้าจอ high-DPI รูปภาพเนื้อหาในคอลัมน์บทความกว้าง 800px ต้องการประมาณ 1200–1600px (1.5–2× สำหรับ retina); แบนเนอร์ hero ที่ข้ามหน้าจอ 1920px ต้องใช้ 1920–2560px; ภาพย่อที่แสดงผลที่ 200px ต้องการเพียง 300–400px การทำให้ใหญ่กว่าการแสดงผลจะสิ้นเปลือง bytes กับพิกเซลที่หน้าจอไม่สามารถแสดงได้; การทำให้เล็กเกินไปจะทำให้รูปภาพดูนุ่มเมื่อเบราว์เซอร์ขยายมัน social media image sizes guide มีขนาดสำหรับแต่ละแพลตฟอร์มสำหรับเป้าหมายโซเชียล เมื่อสงสัย ให้ปรับขนาดเป็นประมาณ 1.5× ความกว้างของการแสดงผล — ซึ่งครอบคลุมหน้าจอ high-DPI ส่วนใหญ่โดยไม่ทำให้ไฟล์บวม

จะปรับขนาดอย่างไรโดยที่ยังคงคุณภาพไว้ได้?

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

เมื่อไหร่ที่การเพิ่มขนาดภาพ (upscaling) เป็นสิ่งที่หลีกเลี่ยงไม่ได้ — และควรทำอย่างไรต่อ?

บางครั้งคุณอาจจำเป็นต้องขยายภาพ (เช่น ภาพถ่ายเก่า หรือรูปภาพที่ดาวน์โหลดมา) การทำ upscaling ไม่สามารถเพิ่มรายละเอียดจริงได้ แต่ upscaler ที่ดี (Real-ESRGAN) จะคาดการณ์รายละเอียดที่เป็นไปได้และดูดีกว่าการปรับขนาดแบบดิบๆ ยอมรับว่าผลลัพธ์ที่ได้จะนุ่มนวลกว่าภาพที่จับมาในความละเอียดสูงโดยธรรมชาติ ดูวิธี how to upscale images

ความแตกต่างที่สำคัญคือระหว่าง downscaling ซึ่งโดยพื้นฐานแล้วไม่มีการสูญเสียคุณภาพเมื่อถึงขนาดเป้าหมาย และ upscaling ซึ่งมีข้อจำกัดโดยธรรมชาติ เมื่อใครบางคนถามว่าจะ "ปรับขนาดโดยไม่สูญเสียคุณภาพ" พวกเขามักจะหมายถึงการ downscale แหล่งที่มาขนาดใหญ่ให้เป็นขนาดสำหรับเว็บ — และสำหรับการทำเช่นนั้น กฎข้างต้น (keep ratio, use Lanczos, resize before compress) จะให้ผลลัพธ์ที่ไม่สามารถแยกความแตกต่างจากภาพต้นฉบับได้เมื่ออยู่ในขนาดใหม่ การ upscaling เป็นปัญหาที่แตกต่างกันและมีคำตอบที่ต่างออกไป การนำสองสิ่งนี้มาปะปนกันคือสิ่งที่ทำให้เกิดความผิดหวังเมื่อรูปภาพขนาดเล็กถูกขยายแล้วดูนุ่มนวล หากคุณกำลังขยายภาพ ให้อ่านคู่มือ upscaling ก่อน และตั้งความคาดหวังของคุณให้เหมาะสม

ข้อผิดพลาดที่พบบ่อย

• การเพิ่มขนาด (Upscaling) แล้วคาดหวังรายละเอียด. รายละเอียดเหล่านั้นไม่สามารถเพิ่มได้; ควรถ่ายภาพใหม่หากเป็นไปได้
• การบังคับให้มีขนาดที่แน่นอน (exact dimensions). จะทำให้รูปภาพผิดเพี้ยน; ควรคงอัตราส่วนภาพไว้
• การบีบอัดก่อนปรับขนาด (resizing). ทำให้เสียเวลา; ควรปรับขนาดก่อน
• การใช้ nearest-neighbor กับภาพถ่าย. ทำให้ได้ผลลัพธ์ที่ขอบหยัก; ควรใช้ Lanczos/bicubic
• การเขียนทับไฟล์ต้นฉบับ (overwriting). ควรบันทึกไปยังโฟลเดอร์เอาต์พุตเสมอ

รายการตรวจสอบการปรับขนาดขั้นสุดท้าย

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

คำถามที่พบบ่อย

การปรับขนาดลดคุณภาพหรือไม่?

การย่อขนาดไม่ได้ลดคุณภาพ ที่มองเห็นได้ ที่ขนาดเป้าหมาย — มันเพียงแค่ทิ้งพิกเซลที่คุณไม่ได้แสดงเท่านั้น ส่วนการขยายขนาดไม่สามารถเพิ่มรายละเอียดได้ ดังนั้นจึงดูนุ่มนวล

จะปรับขนาดโดยไม่ผิดสัดส่วนได้อย่างไร?

ให้คงอัตราส่วนภาพ: ระบุมิติใดมิติหนึ่งและปล่อยให้อีกมิติหนึ่งตามมา ห้ามบังคับทั้งสองอย่างเด็ดขาด

ตัวกรอง (filter) สำหรับการปรับขนาดที่ดีที่สุดคืออะไร?

Lanczos สำหรับรูปถ่าย (คมชัด, มีสิ่งแปลกปลอมน้อยที่สุด) Bicubic เป็นทางเลือกที่ใกล้เคียงกัน

ควรปรับขนาดหรือบีบอัดก่อน?

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

จะปรับขนาดโดยไม่สูญเสียคุณภาพได้อย่างไร?

ใช้ตัวกรอง resampling ที่ดี (Lanczos สำหรับการย่อขนาด, bicubic สำหรับการเปลี่ยนแปลงเล็กน้อย) และคงอัตราส่วนภาพไว้ การปรับขนาดเปลี่ยนจำนวนพิกเซล ไม่ใช่คุณภาพต่อพิกเซล — การสูญเสียคุณภาพมาจากการขยายขนาดเกินกว่าต้นฉบับ หรือการบีบอัดซ้ำ ควรปรับขนาดจากไฟล์ master คุณภาพสูง; ห้ามปรับขนาดและบันทึก JPEG ที่ถูกบีบอัดแล้ว

ทำไมต้องคงอัตราส่วนภาพไว้?

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

ทำไมต้องปรับขนาดก่อนบีบอัด?

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

ตัวกรองการสุ่มตัวอย่าง (resampling filter) ที่ดีที่สุดคืออะไร?

Lanczos สำหรับการย่อขนาด (คมชัดที่สุด, รักษารายละเอียด), bicubic สำหรับการใช้งานทั่วไป, nearest-neighbor สำหรับงาน pixel art เท่านั้น ตัวกรองจะตัดสินว่าพิกเซลใหม่คำนวณจากพิกเซลเก่าอย่างไร สำหรับภาพถ่าย Lanczos คือค่าเริ่มต้น; ให้ทดสอบตามเนื้อหาสำหรับกราฟิก

การปรับขนาดเปลี่ยนขนาดไฟล์หรือไม่?

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

สามารถปรับขนาดรูปภาพได้โดยไม่ต้องใช้แอปหรือไม่?

ได้ — เครื่องมือในเบราว์เซอร์อย่าง Image Resizer ของเราสามารถปรับขนาดได้โดยไม่ต้องติดตั้ง และเครื่องมือที่สร้างมาพร้อมกับ OS (Preview บน Mac, Photos บน Windows) ก็ทำเช่นกัน สำหรับการประมวลผลเป็นชุดหรือระบบอัตโนมัติ command line (ImageMagick, sips) จะจัดการโฟลเดอร์ เลือกตามงาน: รูปภาพเดียวในเบราว์เซอร์ หรือชุดรูปภาพบน command line

สามารถปรับขนาดรูปภาพให้ใหญ่ขึ้นโดยไม่สูญเสียคุณภาพได้หรือไม่?

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

เครดิตรูปภาพ

• แผนผัง Resize-size comparison, aspect-ratio preserve-vs-distort, และ resize-vs-compress — สร้างโดยผู้เขียนจากรูปถ่ายสไตล์อีคอมเมิร์ซ (Pexels #16675632, photo by Mikael Blomkvist) เพื่อแสดงผลลัพธ์การปรับขนาดจริงและการประหยัดไบต์

ตัวอย่างโค้ดที่เก็บรักษาไว้

## Resize to 1920px wide, aspect ratio kept, Lanczos filter
magick input.jpg -filter Lanczos -resize 1920x output.jpg

## To a specific height instead
magick input.jpg -filter Lanczos -resize x1080 output.jpg