แปลงไฟล์ภาพเป็นฟอร์แมท AVIF หรือ WebP ฟรี

แปลงไฟล์ภาพเป็นฟอร์แมท AVIF หรือ WebP ฟรี

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

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

AVIF มาตรฐานใหม่แห่งคุณภาพ

AVIF หรือ AV1 Image File Format เป็นรูปแบบไฟล์ที่พัฒนาโดย Alliance for Open Media เปิดตัวในปี 2019 โดยใช้เทคโนโลยีการบีบอัดแบบ AV1 ที่ทันสมัย จุดเด่นของ AVIF อยู่ที่ความสามารถในการบีบอัดไฟล์ให้มีขนาดเล็กลงได้มากถึง 50% เมื่อเทียบกับ JPEG โดยที่คุณภาพของภาพยังคงความคมชัดสูง นอกจากนี้ AVIF ยังรองรับการแสดงผลแบบ HDR และ wide color gamut ทำให้สามารถแสดงสีสันได้สมจริงและสวยงามมากขึ้น

WebP ทางเลือกที่เป็นที่ยอมรับ

WebP เป็นรูปแบบไฟล์ที่พัฒนาโดย Google ตั้งแต่ปี 2011 แม้จะเก่ากว่า AVIF แต่ก็ได้รับการยอมรับอย่างกว้างขวางในวงการเว็บ WebP สามารถลดขนาดไฟล์ลงได้ประมาณ 30% เมื่อเทียบกับ JPEG และยังรองรับความโปร่งใสเหมือน PNG รวมถึงสามารถสร้างภาพเคลื่อนไหวได้เหมือน GIF ทำให้เป็นรูปแบบไฟล์ที่มีความยืดหยุ่นสูง

การเปรียบเทียบประสิทธิภาพ AVIF และ WebP

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

ข้อได้เปรียบเหนือ PNG และ JPEG

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

การเลือกใช้งานที่เหมาะสม

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

ทำความรู้จัก CompressX

CompressX เป็นปลั๊กอินฟรีสำหรับ WordPress ที่พัฒนาโดยทีมงาน WPvivid สามารถช่วยแปลงไฟล์ภาพ JPG และ PNG ให้เป็นรูปแบบ WebP และ AVIF พร้อมทั้งบีบอัดขนาดไฟล์ให้เล็กลง การทำงานทั้งหมดเกิดขึ้นบนเว็บเซิร์ฟเวอร์ของคุณโดยตรง ไม่ต้องส่งไฟล์ไปประมวลผลที่เซิร์ฟเวอร์อื่น มีฟีเจอร์การจัดการโฟลเดอร์ สามารถเลือกโฟลเดอร์ที่ไม่ต้องการประมวลผลได้ หรือเลือกโฟลเดอร์นอกเหนือจาก Uploads ในโฟลเดอร์ wp-content เพื่อประมวลผลได้

วิธีการใช้งาน

เริ่มจากติดตั้งตัวปลั๊กอินกันก่อน ไปที่เมนู Plugins > Add new plugin ค้นหาคำว่า “CompressX” กด Install และ Activate ให้เรียบร้อย

การใช้งานให้เข้าไปที่เมนู CompressX ที่เมนูด้านซ้ายมือ เลือกที่เมนูย่อย Settings

หน้าตาเรียบง่าย น่าใช้งานไม่เบาเลย

ส่วนแรกจะเป็นการกำหนดให้มีการบีบอัดและแปลงไฟล์เป็น WebP หรือ AVIF เมื่อมีการอัปโหลดไฟล์ภาพใหม่ ถ้าเราต้องการฟีเจอร์นี้ให้เลือก “Enable it to compress & convert the new uploaded images.”

Library to Process Images เป็นการกำหนดเลือก PHP extension สำหรับประมวลผลรูปภาพ ตัวเลือก

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

Output Formats มีให้เลือก 2 ฟอร์แมทคือ WebP และ AVIF

Compression Level เป็นการกำหนดระดับการบีบอัดไฟล์มากหรือน้อย

– Lossless คุณภาพระดับ 100 จะไม่ค่อยสูญเสียรายละเอียดของภาพ แต่ขนาดไฟล์ใหญ่สุด

– ลูกศรชี้ซ้าย คุณภาพระดับ 90

– ไอคอนยกนิ้วโป้ง คุณภาพค่าปกติ อยู่ที่ 80

– ลูกศรชี้ขวา คุณภาพระดับ 70

– Lossy คุณภาพระดับ 60 จะบีบอัดไฟล์เยอะ คุณภาพไฟล์ย่อมลดลง แต่ขนาดไฟล์ย่อมเล็กกว่า

– Custom ปรับแต่งคุณภาพได้เอง

General Settings การตั้งค่าทั่วไป

Browser compatibility เป็นการตั้งค่าความเข้ากันได้ของเบราว์เซอร์ที่ใช้ มี 2 รูปแบบคือ

วิธี Rewrite Rule

เป็นการเพิ่มกฎการ rewrite ลงในไฟล์ .htaccess ที่อยู่ในโฟลเดอร์ /wp-content/ โดยจะทำงานตามลำดับดังนี้

– ถ้าเบราว์เซอร์รองรับ AVIF จะโหลดไฟล์ AVIF

– ถ้าไม่รองรับ AVIF จะโหลดไฟล์ WebP แทน

– ถ้าไม่รองรับทั้งสองรูปแบบ จะโหลดไฟล์ต้นฉบับ (.jpg หรือ .png)

วิธี Picture Tag

เป็นการแทนที่แท็ก <img> ด้วยแท็ก <picture> เหมาะสำหรับกรณีที่ไม่สามารถใช้ .htaccess ได้ เช่น เซิร์ฟเวอร์ OpenLiteSpeed ที่ต้องรีสตาร์ทเพื่อให้ .htaccess ทำงาน วิธีนี้ใช้ได้กับเบราว์เซอร์ส่วนใหญ่ แต่มีข้อจำกัดคือไม่รองรับรูปภาพที่กำหนดใน CSS

Do not convert PNG images
ไม่ต้องแปลงไฟล์ PNG ฟีเจอร์นี้หากเซิร์ฟเวอร์ใช้ ImageMagick เวอร์ชัน 6.x อาจเกิดปัญหารูปภาพ PNG สูญเสียพื้นหลังโปร่งใสเมื่อแปลงเป็น AVIF ในกรณีนี้ การเลือกตัวเลือกนี้จะทำให้รูปภาพ PNG ถูกแปลงเป็น WebP เท่านั้น

ปัญหานี้ไม่เกิดขึ้นใน ImageMagick เวอร์ชันที่สูงกว่า เช่น เวอร์ชัน 7

Remove EXIF data
ลบข้อมูล EXIF ​​(ไม่สามารถใช้กับวิธีการแปลงแบบ GD ได้)

Parameters of processing images
ค่านี้แสดงจำนวนไฟล์แนบรูปภาพของ WordPress (รวมทั้งรูปภาพต้นฉบับและรูปขนาดย่อ) ที่สามารถประมวลผลได้ในหนึ่งรอบของ AJAX ตัวอย่างเช่น หากตั้งค่าเป็น 1 ปลั๊กอินจะประมวลผลไฟล์แนบ 1 รายการ ซึ่งอาจประกอบด้วยรูปภาพต้นฉบับ 1 รูป และรูปขนาดย่อ 20 รูป

โดยทั่วไปบริการเว็บโฮสติ้งจะอนุญาตให้ AJAX ทำงานได้นาน 120 วินาที ซึ่งในช่วงเวลานี้สามารถประมวลผลไฟล์แนบรูปภาพได้ 3 รายการ เทียบเท่ากับรูปภาพต้นฉบับ 3 รูป และรูปขนาดย่อ 60 รูป โดยค่าเริ่มต้นถูกกำหนดไว้ที่ 5

Automatic removal of files in output formats larger than the original ones
การลบไฟล์ในรูปแบบเอาท์พุตที่มีขนาดใหญ่กว่าต้นฉบับโดยอัตโนมัติ

Auto-resizing large images
ปรับขนาดภาพขนาดใหญ่โดยอัตโนมัติ สามารถกำหนดความกว้างและความยาวสูงสุดได้

Choose the thumbnail sizes you want to process
เลือกขนาดรูปย่อที่คุณต้องการให้ประมวลผล บางธีมอาจสร้างขนาดรูปย่อใหม่ขึ้นมาในบางครั้ง ในกรณีนี้คุณจำเป็นต้องประมวลผลขนาดรูปย่อเหล่านั้นใหม่โดยใช้ฟังก์ชันการประมวลผลแบบกลุ่ม (Bulk Processing)

Exclude Folders
สามารถกำหนดโฟลเดอร์ที่ไม่ต้องการให้แปลงไฟล์ได้

หลังจากตั้งค่าตามต้องการเรียบร้อยแล้ว เราก็มาทำการแปลงและบีบอัดขนาดไฟล์โดยการกดที่ปุ่ม Start Bulk Processing

ระหว่างรอปลั๊กอินทำการบีบอัดและแปลงไฟล์ตามที่เรากำหนด รอให้ครบ 100%

ถ้าใครมีรูปในเว็บเยอะมากก็จะต้องรอนานหน่อย ดีไม่ดีอาจเป็นชั่วโมง หลังแปลงเสร็จแล้วตัวเลขจะแสดงเป็น 100%

บางท่านอาจจะมีคำถามสงสัยต่อว่า แล้วแปลงเสร็จแล้วไฟล์ภาพไปเก็บไว้ที่ไหน คำตอบก็คือ ไฟล์รูปภาพจะถูกเก็บไว้ที่โฟลเดอร์ /wp-content/compressx-nextgen/ ซึ่งถ้าหากเราดูที่หน้าเว็บ Frontend แล้วคลิกขวา Inspect ดูเบื้องต้นอาจจะพบว่ามันยังแสดงชื่อไฟล์เป็นนามสกุลเดิมอยู่ แล้วถ้าเราลอง Save Image มาดูจะพบว่าเป็นนามสกุล WebP หรือ AVIF เรียบร้อย

วิธีการให้คลิกขวาที่หน้าเว็บเบราว์เซอร์เลือก Inspect > เลือกแท็บ Network กด Ctrl + R เพื่อ Reload จากนั้นกดที่แท็บ Img กดเลือกรูปภาพที่เราจะตรวจสอบ แล้วดู Image Type จะแสดงเป็น WebP หรือ AVIF

สรุป

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

รายละเอียดเพิ่มเติม