การใช้รูปภาพ WebP ใน WordPress

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

รูปภาพประกอบขึ้นเป็นส่วนสำคัญของขนาดไฟล์หน้าเว็บ (บางครั้งเกิน 50% ของข้อมูลหน้าคือรูปภาพ) สิ่งนี้ทำให้รูปภาพเป็นเป้าหมายอันดับหนึ่งในการลดน้ำหนักในการแสวงหาขนาดหน้าที่เล็กกว่า! ตามเนื้อผ้า รูปภาพส่วนใหญ่ที่ใช้บนเว็บไซต์จะเป็น JPEG หรือ PNG ทั้งสองประเภทเป็นไฟล์ที่ยอดเยี่ยมซึ่งทำงานได้ดีบนเว็บไซต์ อย่างไรก็ตามพวกเขาสามารถมีปัญหาเรื่องขนาดได้ ในขณะที่แนะนำให้ใช้เครื่องมือเช่น TinyPNG (และอาจมีผลกระทบอย่างมากต่อขนาดของรูปภาพที่คุณเพิ่มลงในไซต์ของคุณ) จะเกิดอะไรขึ้นหากมีรูปแบบภาพที่เล็กกว่า 'ตรงจากกล่อง' มีและเรียกว่า WebP

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

รูปภาพ WebP คืออะไร

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

Google ชอบเว็บไซต์ที่รวดเร็ว ดังนั้นจึงสมเหตุสมผลที่พวกเขาควรเป็นผู้นำในการจัดหารูปแบบภาพที่จะช่วยให้เว็บไซต์ทำงานได้เร็วขึ้น ไฟล์ WebP โดยทั่วไปจะสูงกว่า JPEG ที่เทียบเท่ากัน 25% ถึง 34% (จากการศึกษาของ Google เอง) บนพื้นฐานที่ว่ารูปภาพสามารถประกอบขึ้นเป็นข้อมูลจำนวนมากบนหน้าเว็บได้ นี่เป็นการประหยัดที่สำคัญ

โฮสต์เว็บไซต์ของคุณด้วย Pressidium

รับประกันคืนเงิน 60 วัน

ดูแผนของเรา

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

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

1. การใช้งาน: ในปัจจุบัน ซอฟต์แวร์ออกแบบกราฟิกส่วนใหญ่ไม่รองรับรูปภาพ WebP เช่น Photoshop หรือ Illustrator ใครก็ตามที่ทำงานในโปรแกรมเหล่านี้จะใช้ในการเปิดไฟล์รูปภาพ (ของคำอธิบายทั้งหมด, JPEG, GIF, PNG เป็นต้น) และเพียงแค่ 'เริ่มต้น' กับการแก้ไขตามต้องการ นอกจากนี้ เมื่อพูดถึงการบันทึกไฟล์เหล่านั้น โดยปกติแล้ว คุณสามารถส่งออกไปยังรูปแบบรูปภาพทั่วไปใดๆ ก็ได้ ด้วย WebP สิ่งนี้ไม่สามารถทำได้ทันทีที่แกะออกจากกล่อง คุณอาจต้องดาวน์โหลดปลั๊กอินจาก WebPPShop แทน เพื่อใช้ซอฟต์แวร์แก้ไขภาพ 'ปกติ' ของคุณ จนกว่าภาพ WebP จะแพร่หลายเท่า JPEG และรูปแบบอื่น ๆ จะมีความไม่เต็มใจที่จะ 'ซับซ้อนเกินไป' อยู่เสมอ และนักออกแบบเว็บไซต์จำนวนมากจะยังคงใช้รูปแบบภาพแบบดั้งเดิมมากขึ้น
2. ความเข้ากันได้ของ เบราว์เซอร์ : WebP ไม่รองรับเบราว์เซอร์ทั้งหมดในระดับสากล ซึ่งหมายความว่าแม้ว่าผู้เยี่ยมชมส่วนใหญ่ของคุณที่ใช้เบราว์เซอร์ที่ทันสมัย ​​เช่น Chrome หรือ Mozilla จะไม่มีปัญหาในการดูภาพเหล่านี้ คุณยังคงมีส่วนน้อยที่ไม่สามารถดูภาพเว็บไซต์ที่บันทึกไว้ได้ เป็น WebP ซึ่งรวมถึง Safari ที่ให้การสนับสนุนเพียงบางส่วนเท่านั้นขึ้นอยู่กับเวอร์ชันที่ใช้ (ในขณะที่เขียน) คุณจะต้องมีวิธีแก้ปัญหา (ซึ่งเราจะพูดถึงด้านล่าง) เพื่อให้แน่ใจว่าผู้เยี่ยมชมของคุณสามารถเห็นเว็บไซต์ของคุณตามที่คุณต้องการ

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

วิธีใช้รูปภาพ WebP กับ WordPress

ใครก็ตามที่พุ่งตรงเข้ามาและพยายามอัปโหลดไฟล์ WebP ไปยังเว็บไซต์ WordPress ก่อนเดือนกรกฎาคม 2021 จะผิดหวังเล็กน้อย คุณอาจคาดหวังให้รูปภาพ WebP ใดๆ ที่อัปโหลดผ่าน Media Center บันทึกได้ตามปกติ คุณอาจเห็นหน้าจอแบบนี้แทน:

โชคดีที่ตั้งแต่เปิดตัว WordPress 5.8 คุณสามารถอัปโหลดภาพ WebP ไปยัง WordPress ได้โดยตรง ซึ่งทำให้รูปแบบภาพที่ยอดเยี่ยมนี้ใช้งานง่ายเช่นเดียวกับรูปแบบ JPEG, PNG และ GIF การปรับปรุงอย่างต่อเนื่องเช่นนี้เป็นสาเหตุหนึ่งที่อาจทำให้คุณอัปเกรดคอร์ WordPress เป็นเวอร์ชันล่าสุดได้ แน่นอน หากคุณใช้โฮสต์ WordPress ที่มีการจัดการ เช่น Pressidium เราจะดูแลเรื่องนี้ให้คุณ ช่วยให้คุณมั่นใจว่าคุณใช้ WordPress เวอร์ชันล่าสุดและดีที่สุดอยู่เสมอ

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

Shortpixel

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

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

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

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

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

Shortpixel to the Rescue

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

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

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