รูปภาพเป็นส่วนประกอบที่สำคัญของเว็บไซต์ ในแง่ความสวยงามและยังเป็นรูปประกอบเพื่อให้ผู้เข้าชมเข้าใจเนื้อหาของเว็บด้วยเช่นกัน
แต่ถ้าไฟล์ภาพที่เอาขึ้นเว็บมีขนาดใหญ่ก็จะทำให้เว็บโหลดช้า ยิ่งมีหลายรูปบนหน้าเดียวกันด้วย ยิ่งทำให้ช้าลงไปอีก อาจจะทำให้ผู้เข้าชมบางรายออกจากเว็บเราได้
วิธีแก้ปัญหาเรื่องขนาดไฟล์ภาพที่ใหญ่
1. ย่อไฟล์ภาพให้พอดีกับการใช้งาน
โดยทั่วไป ไฟล์ภาพขนาดใหญ่ ไฟล์ก็ใหญ่ตามมา และการวางภาพในขนาดไม่เหมาะสมกับพื้นที่ใช้งานก็จะทำให้ภาพดูไม่ชัดอีกด้วย เช่นภาพความกว้าง 100px มาจับขยายในพื้นที่ 400px เราจะเห็นว่าภาพเบลอ ในทางกลับกันถ้าเอาไฟล์ภาพกว้าง 6,000px มาบังคับย่อวางในพื้นที่ 400px บางจุดของภาพจะดูหยาบ การย่อขนาดไฟล์ให้พอดีกับการใช้งานบนเว็บไซต์นอกจากจะช่วยให้เว็บโหลดเร็วแล้วจะทำให้ภาพดูคมชัดอย่างเหมาะสมด้วย
สำหรับเว็บ responsive ถ้าภาพที่เราจะใช้นั้นมีการย่อขยาย ในแต่ละอุปกรณ์ไม่เท่ากัน เช่นบนจอคอม อาจให้ภาพย่อเล็กเพื่อเรียบเป็นแถว แต่ในมือถือภาพจะมาเต็มความกว้างภาพเดียว ให้เราเอาขนาดที่ใหญ่ที่สุดในการใช้งานเป็นตัวหลัก
รูปทางซ้ายสุดคือภาพขนาด 100px มาวางในช่องรูปภาพขนาด 400px
รูปกลางคือภาพขนาด 400px วางในช่องภาพ 400px พอดี
รูปขวาสุดคือภาพขนาด 6,000px วางในช่องขนาด 400px จะเห็นขอบจานด้านซ้ายล่างดูหยาบไม่โค้งเรียบ
2 ประเภทของไฟล์ภาพ
ไฟล์ภาพที่นิยมใช้บนเว็บไซต์ส่วนใหญ่มักจะเป็น JPG ซึ่งใช้เป็นมาตรฐานกันมานานเพราะเมื่อเทียบกับไฟล์ภาพนามสกุลต่างๆ JPG จะมีขนาดเล็กกว่า
*JPG: ใช้การบีบอัดแบบสูญเสียข้อมูล (Lossy Compression) ซึ่งจะลดขนาดไฟล์ โดยลดทอนรายละเอียดภาพบางส่วน ส่งผลให้ขนาดไฟล์เล็กลง เหมาะสำหรับการใช้บนเว็บไซต์ บางครั้งการย่อภาพอาจเห็นรอยเบลอจากกว่าย่อได้
แต่ในปัจจุบันไฟล์ภาพนามสกุล WebP จะเข้ามาแทนที่ด้วยขนาดที่เล็กกว่า JPG ตั้งแต่ 30 – 80% แต่ความคมชัดเท่ากัน และผู้พัฒนาไฟล์ WebP นี้คือ Google ซึ่งมีการเปิดตัวมาตั้งแต่ปี 2010 ซึ่งเหมาะสำหรับเว็บไซต์ที่จะทำ SEO อย่างยิ่ง
*ข้อควรระวัง ในบางเว็บไซต์อาจยังไม่รองรับไฟล์ WebP ควรอ่านเงื่อนไขการอัพโหลดในแต่ละเว็บไซต์ด้วย
รูปทางซ้ายสุดคือไฟล์ JPG มีขนาด 6.73 MB รูปขวาคือไฟล์ WebP มีขนาด 1.17 MB โดยความกว้างและสูง เท่ากันคือ 6,067 x 3,467 px
เว็บไซต์ให้บริการแปลงไฟล์เป็น WebP
1. Convertio
แปลงได้หลายไฟล์พร้อมกัน รองรับการแปลงไฟล์ได้สูงสุด 100 MB และมีบริการแปลงไฟล์ประเภทต่างๆ มากมาย
https://convertio.co/th/image-converter/
2. Aspose
นอกจากจะแปลงไฟล์แล้ว ยังมีเครื่องมือสำหรับแต่งภาพ ย่อ ตัด ภาพ ให้เราใช้อีกด้วย
https://products.aspose.app/imaging/conversion/jpg-to-webp
3 Fotor
เช่นเดียวกับ Aspose สามารถแปลงไฟล์ และมีเครื่องมือสำหรับแต่งภาพให้ใช้
https://www.fotor.com/convert/webp-converter/