ปรับแต่งรูปภาพในเว็บไซต์ให้สวยดั่งใจด้วย images.tooling.report

ตรวจสอบสถานะของเครื่องมือรูปภาพ

Patrick Kettner
Patrick Kettner

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

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

ทำไมจึงเป็นเช่นนั้น

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

สิ่งนี้คืออะไร

การแสดงรูปภาพที่เพิ่มประสิทธิภาพเป็นมากกว่าแค่การคลิก "บันทึกสำหรับเว็บ" นั่นจึงเป็นเหตุผลที่ images.tooling.report ตรวจหาฟีเจอร์ที่หลากหลาย เราครอบคลุมข้อมูลพื้นฐาน เช่น ปริมาณการบีบอัดที่เครื่องมือและบริการต่างๆ มีให้ และการเพิ่มประสิทธิภาพเครือข่าย เช่น ส่วนหัวของแคชที่มีอายุการใช้งานยาวนาน

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

ภาพหน้าจอของหน้า Landing Page สําหรับ images.tooling.report ในโหมดมืด

แน่นอนว่าทุกเว็บไซต์เปรียบเสมือนเกล็ดหิมะ ไม่มีเครื่องมือหรือบริการใดที่ทำทุกอย่างที่เรากำลังมองหาได้อย่างแน่นอน ซึ่งเป็นเรื่องปกติ เราจึงแยกสิ่งที่เราทดสอบออกเป็นหมวดหมู่ต่างๆ ข้อมูลที่ครอบคลุมเกี่ยวกับเครือข่ายนำส่งข้อมูล (CDN), โปรเจ็กต์ที่โฮสต์ด้วยตนเอง, ปลั๊กอินระบบจัดการเนื้อหา (CMS) และเครื่องมือสร้างเว็บไซต์ คำจำกัดความเหล่านี้ค่อนข้างกว้างขึ้น แต่จริงๆ แล้วต้องพยายามเปรียบเทียบตัวเลือกต่างๆ ให้มีความเกี่ยวข้องกันมากขึ้น

  • ปลั๊กอิน CMS คือแพ็กเกจที่เป็นตัวเลือกที่ง่ายสำหรับการพัฒนาบนแพลตฟอร์มอย่างเช่น WordPress
  • เครื่องมือสร้างเว็บไซต์จะเปรียบเทียบบริการหลายอย่างที่คุณใช้สร้างเว็บไซต์ได้
  • โฮสต์ด้วยตนเองมีไว้สำหรับนักพัฒนาซอฟต์แวร์ที่คุ้นเคยกับการโคลนโปรเจ็กต์ Git หรือเรียกใช้อิมเมจ Docker ของตนเองในเวอร์ชันที่ใช้งานจริง
  • CDN ค่อนข้างซับซ้อน แพลตฟอร์มเหล่านี้เป็น CDN ตามความหมายดั้งเดิม แต่ในบางกรณีก็เป็นบริการที่พร็อกซีหรือโฮสต์รูปภาพของคุณที่ขอบ

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

ขั้นตอนถัดไปคือ

หากคิดว่าเราพลาดเครื่องมือหรือบริการรูปภาพไป โปรดแจ้งให้เราทราบ ทั้งเครื่องมือและบริการ และการทดสอบเองล้วนเป็นสิ่งมีชีวิตที่ได้รับการอัปเดต เมื่อใดก็ตามที่คุณต้องการสถานที่อันรวดเร็วในการดูงานศิลปะในรูปภาพการจัดส่ง คุณควรไปที่ images.tooling.report ที่จุดแรก

รูปภาพหลักโดย Michael Maasen ใน Unsplash