ทำไมภาพบนเว็บไซต์ของคุณถึงต้องถูกบีบอัด | Bulk Image Compressor
หากเว็บไซต์ของคุณใช้เวลาโหลดมากกว่าสองสามวินาที ผู้คนจะออกไป นั่นไม่ใช่ความคิดเห็น งานวิจัยของ Google เองแสดงให้เห็นว่าอัตราการเด้งเพิ่มขึ้น 32% เมื่อเวลาโหลดหน้าเพิ่มจากหนึ่งวินาทีเป็นสามวินาที และภาพมักจะเป็นสาเหตุใหญ่ที่สุดที่ทำให้หน้าโหลดช้า
เว็บไซต์ส่วนใหญ่ให้บริการภาพที่ใหญ่เกินความจำเป็นมาก ภาพหลักเพียงภาพเดียวจากกล้องหรือเว็บไซต์สต็อกภาพสามารถมีขนาด 5MB หรือมากกว่านั้นได้ง่ายๆ บนการเชื่อมต่อบรอดแบนด์ที่ดี ไฟล์นั้นเพียงไฟล์เดียวใช้เวลาสองสามวินาทีในการโหลด บนการเชื่อมต่อ 3G มือถือ คุณกำลังมองหาประมาณ 15 วินาทีสำหรับภาพเดียว ลองนึกภาพหน้าหนึ่งที่มีภาพห้าหรือหกภาพแบบนั้น
ภาพของคุณใหญ่แค่ไหนจริงๆ?
นี่คือการตรวจสอบความเป็นจริงด่วน เปิดเครื่องมือนักพัฒนาของเบราว์เซอร์ของคุณ (F12) ไปที่แท็บ Network โหลดหน้าเว็บของคุณใหม่ และกรองด้วย “Img” ดูที่ขนาด คุณอาจจะพบภาพอย่างน้อยสองสามภาพที่เกิน 1MB
สำหรับการอ้างอิง นี่คือลักษณะของภาพที่ไม่ได้บีบอัดทั่วไป:
- รูปถ่าย DSLR ที่ใช้เป็นแบนเนอร์หลัก: 4 ถึง 8MB
- รูปภาพสินค้าจากสมาร์ทโฟน: 2 ถึง 5MB
- รูปสต็อกที่ดาวน์โหลดที่ความละเอียดเต็ม: 3 ถึง 10MB
- อินโฟกราฟิกหรือภาพประกอบที่บันทึกเป็น PNG: 1 ถึง 4MB
หลังจากการบีบอัดที่เหมาะสม ภาพเดียวกันเหล่านั้นสามารถมีขนาด 100KB ถึง 300KB โดยไม่สูญเสียคุณภาพที่มองเห็นได้ นั่นคือการลดขนาดไฟล์ 90% หรือมากกว่า
ความเร็วหน้าและ Core Web Vitals
Google ใช้ Core Web Vitals เป็นสัญญาณการจัดอันดับ และภาพมีผลโดยตรงต่อสองในสามเมตริก
Largest Contentful Paint (LCP) วัดระยะเวลาที่องค์ประกอบที่มองเห็นได้ใหญ่ที่สุดใช้ในการโหลด ในหน้าส่วนใหญ่ องค์ประกอบที่ใหญ่ที่สุดนั้นคือภาพ หากภาพหลักของคุณคือ 5MB LCP ของคุณจะแย่ Google ถือว่าอะไรก็ตามที่เกิน 2.5 วินาทีเป็นคะแนน LCP ที่ไม่ดี ภาพที่บีบอัดมักจะทำให้ LCP อยู่ภายใต้เกณฑ์นั้น
Cumulative Layout Shift (CLS) วัดความเสถียรทางภาพ ภาพที่ไม่มีขนาดที่กำหนดทำให้เกิดการขยับของเลย์เอาต์เมื่อโหลด สิ่งนี้เกี่ยวกับแอตทริบิวต์ HTML มากกว่าการบีบอัด แต่ภาพขนาดใหญ่ที่โหลดช้าทำให้ปัญหาแย่ลงเพราะหน้าเรนเดอร์คอนเทนต์รอบพื้นที่ว่างที่อาจไม่ตรงกับขนาดภาพสุดท้าย
คุณสามารถตรวจสอบคะแนนปัจจุบันของคุณได้ด้วย Google PageSpeed Insights รันหน้าแรกของคุณและอีกสองสามหน้าภายใน หากคะแนนประสิทธิภาพของคุณต่ำกว่า 90 ภาพน่าจะเป็นส่วนใหญ่ของปัญหา
ความเชื่อมโยงกับ SEO
ความเร็วหน้าเป็นปัจจัยการจัดอันดับของ Google ที่ได้รับการยืนยัน มันเป็นเช่นนั้นมาตั้งแต่ปี 2010 สำหรับเดสก์ท็อปและปี 2018 สำหรับมือถือ การแนะนำ Core Web Vitals ในปี 2021 ทำให้มันตรงยิ่งขึ้น
แต่ผลกระทบไปไกลกว่าสัญญาณความเร็ว หน้าที่ช้าถูก crawl โดย Googlebot น้อยลง Google จัดสรร “crawl budget” ให้กับแต่ละเว็บไซต์ และหากหน้าของคุณช้า บอทจะใช้จ่ายงบประมาณรอการตอบสนองแทนการจัดทำดัชนีคอนเทนต์ของคุณมากขึ้น สำหรับเว็บไซต์ขนาดใหญ่ที่มีหลายร้อยหรือหลายพันหน้า สิ่งนี้สำคัญมาก
นอกจากนี้ยังมีผลทางอ้อมผ่านพฤติกรรมผู้ใช้ เมื่อผู้คนเด้งออกจากหน้าที่ช้า Google จะสังเกตเห็น อัตราการเด้งสูงและเวลาบนหน้าต่ำส่งสัญญาณการมีส่วนร่วมที่ไม่ดีซึ่งอาจส่งผลต่ออันดับของคุณเมื่อเวลาผ่านไป
ประสบการณ์ผู้ใช้และอัตราการเด้ง
ผู้คนใจร้อนเมื่อออนไลน์ การศึกษาโดย Portent พบว่าอัตราการแปลงลดลงโดยเฉลี่ย 4.42% สำหรับทุกวินาทีที่เพิ่มขึ้นของเวลาโหลด หากเว็บไซต์อีคอมเมิร์ซของคุณใช้เวลาโหลดห้าวินาทีแทนที่จะเป็นสองวินาที คุณอาจสูญเสียเปอร์เซ็นต์ยอดขายที่มีนัยสำคัญ
ผู้ใช้มือถือยิ่งใจร้อนไม่เข้าใครมากกว่า มากกว่าครึ่งหนึ่งของทราฟฟิกเว็บทั้งหมดมาจากอุปกรณ์มือถือ และการเชื่อมต่อมือถือโดยทั่วไปช้ากว่าเดสก์ท็อป ภาพของคุณต้องเล็กพอที่จะโหลดเร็วบนโทรศัพท์ที่ใช้เครือข่ายเซลลูลาร์
นอกจากนี้ยังมีปัจจัยด้านการรับรู้ เว็บไซต์ที่เร็วให้ความรู้สึกเป็นมืออาชีพและน่าเชื่อถือมากกว่า เว็บไซต์ที่ช้ารู้สึกพัง แม้ว่าทุกอย่างจะโหลดในที่สุด ความประทับใจแรกเกิดขึ้นในมิลลิวินาที
ค่าใช้จ่ายแบนด์วิดท์เพิ่มขึ้น
หากคุณใช้โฮสติ้งที่ใช้ร่วมกันหรือแผนพื้นฐาน แบนด์วิดท์อาจไม่ใช่สิ่งที่คุณคิด แต่สำหรับเว็บไซต์ที่มีทราฟฟิกจริง แบนด์วิดท์มีค่าใช้จ่าย
ลองคำนวณดู สมมติว่าหน้าเฉลี่ยของคุณมีภาพ 3MB และคุณมีผู้เข้าชม 100,000 หน้าต่อเดือน นั่นคือข้อมูลภาพ 300GB ที่ถ่ายโอนต่อเดือน หลังจากการบีบอัด หน้าเดียวกันเหล่านั้นอาจมีภาพ 400KB ทำให้การถ่ายโอนลดลงเหลือ 40GB นั่นคือการลดต้นทุนโฮสติ้งและค่า CDN อย่างมีนัยสำคัญ
สำหรับเว็บไซต์ที่มีทราฟฟิกสูง บริษัทสื่อ หรือร้านค้าอีคอมเมิร์ซที่มีแคตตาล็อกสินค้าจำนวนมาก ความแตกต่างนี้สามารถประหยัดเงินได้หลายร้อยหรือหลายพันดอลลาร์ต่อเดือน
วิธีบีบอัดภาพเว็บไซต์ของคุณแบบกลุ่ม
คุณสามารถบีบอัดภาพทีละภาพใน Photoshop หรือ GIMP แต่ถ้าคุณมีภาพหลายสิบหรือหลายร้อยภาพ นั่นไม่ใช่เรื่องปฏิบัติ การบีบอัดแบบกลุ่มเป็นวิธีที่ถูกต้อง
ด้วย Bulk Image Compressor คุณสามารถลากภาพเว็บไซต์ทั้งหมดของคุณในครั้งเดียวและบีบอัดเข้าด้วยกัน นี่คือเวิร์กโฟลว์ที่ใช้งานได้จริง:
-
ส่งออกภาพปัจจุบันของคุณ หากอยู่บนเว็บไซต์ของคุณแล้ว ให้ดาวน์โหลด หากคุณกำลังสร้างเว็บไซต์ใหม่ ให้รวบรวมภาพทั้งหมดที่คุณวางแผนจะใช้
-
เลือกรูปแบบของคุณ สำหรับภาพถ่าย JPEG หรือ WebP ทำงานได้ดีที่สุด สำหรับกราฟิกที่มีความโปร่งใส ใช้ PNG หรือ WebP หากคุณไม่แน่ใจว่าจะเลือกรูปแบบไหน ดู คู่มือรูปแบบภาพสำหรับประสิทธิภาพเว็บ ของเรา
-
ตั้งค่าระดับคุณภาพของคุณ สำหรับภาพเว็บไซต์ส่วนใหญ่ การตั้งค่าคุณภาพ 75 ถึง 85% ให้สมดุลที่ดีระหว่างขนาดไฟล์และคุณภาพของภาพ คุณสามารถตั้งค่าต่ำกว่าสำหรับรูปขนาดย่อหรือภาพพื้นหลัง สำหรับรายละเอียดเพิ่มเติมเกี่ยวกับการแลกเปลี่ยนนี้ ดูบทความของเราเกี่ยวกับ การลดขนาดไฟล์โดยไม่สูญเสียคุณภาพ
-
บีบอัดและดาวน์โหลด เครื่องมือประมวลผลทุกอย่างในเบราว์เซอร์ของคุณ ดังนั้นภาพของคุณไม่เคยออกจากคอมพิวเตอร์ของคุณ แทนที่ต้นฉบับบนเซิร์ฟเวอร์ของคุณด้วยเวอร์ชันที่บีบอัด
-
กำหนดขนาดด้วย อย่าให้บริการภาพกว้าง 4000px ในคอนเทนเนอร์ที่กว้างเพียง 800px ปรับขนาดภาพของคุณให้ตรงกับขนาดแสดงผลก่อนหรือระหว่างการบีบอัด แค่นี้สามารถลดขนาดไฟล์ได้อย่างมาก
ตัวอย่างก่อนและหลังด่วน
นี่คือลักษณะการบีบอัดในทางปฏิบัติสำหรับเว็บไซต์ทั่วไป:
| ภาพ | ก่อน | หลัง | ประหยัด |
|---|---|---|---|
| แบนเนอร์หลัก (JPEG) | 4.2MB | 210KB | 95% |
| รูปทีม (JPEG) | 3.1MB | 185KB | 94% |
| โลโก้ (PNG) | 890KB | 95KB | 89% |
| รูปขนาดย่อบล็อก (JPEG) | 1.8MB | 120KB | 93% |
| รวม | 10MB | 610KB | 94% |
นั่นคือความแตกต่างระหว่างหน้าที่โหลดในหนึ่งวินาทีกับหน้าที่โหลดในแปดวินาที
อย่าลืมเกี่ยวกับคอนเทนต์ใหม่
การบีบอัดภาพที่มีอยู่ของคุณเป็นการแก้ไขครั้งเดียว แต่คุณต้องมีกระบวนการสำหรับคอนเทนต์ที่เกิดขึ้นใหม่ด้วย ทุกครั้งที่คุณหรือทีมของคุณเพิ่มโพสต์บล็อก หน้าสินค้า หรือแลนดิ้งเพจใหม่ ภาพเหล่านั้นควรถูกบีบอัดก่อนเผยแพร่
ทำให้การบีบอัดภาพเป็นส่วนหนึ่งของเวิร์กโฟลว์การเผยแพร่คอนเทนต์ของคุณ มันใช้เวลาสองสามนาทีและผลกระทบต่อความเร็วเว็บไซต์และ SEO ของคุณนั้นจริงและวัดผลได้
ภาพบนเว็บไซต์ของคุณอาจเป็นการปรับปรุงประสิทธิภาพที่ใหญ่ที่สุดเพียงอย่างเดียวที่คุณสามารถทำได้ เครื่องมือฟรี กระบวนการรวดเร็ว และผลลัพธ์จะแสดงทันทีในคะแนนความเร็วหน้าของคุณ
Ready to compress your images?
Bulk compress JPEG, PNG, WebP, and AVIF images right in your browser. No uploads, no sign-ups.
Try Bulk Image Compressor