วิธีที่มีประสิทธิภาพที่สุดในการฝังวิดีโอบน WordPress
เผยแพร่แล้ว: 2024-03-04อ่า คุณจำสมัยที่การเชื่อมต่อผ่านสายโทรศัพท์และ Edge (2G) เป็นเรื่องหรูหรา และการดูวิดีโอบน YouTube ดูเหมือนจะทดสอบความอดทนของเราหรือไม่
หากคุณไม่มีอินเทอร์เน็ตความเร็วสูง คุณจะต้องคลิกที่ปุ่มเล่นวิดีโอที่คุณชื่นชอบ กดหยุดชั่วคราว จากนั้นปล่อยให้โหลดและบัฟเฟอร์ ในขณะเดียวกัน คุณก็ไปชงกาแฟสักแก้ว เมื่อคุณกลับมา หากคุณโชคดี วิดีโอจะสตรีมได้อย่างราบรื่นในคราวเดียว ไม่เช่นนั้นคุณอาจต้องทนทุกข์ทรมานจากการบัฟเฟอร์
แต่สิ่งที่ดีที่สุดในตอนนี้คือมันจะไม่เกิดขึ้นอีกต่อไป และการเชื่อมต่ออินเทอร์เน็ตที่รวดเร็วก็กลายเป็นเรื่องปกติใหม่ ด้วยเทคโนโลยี 5G ทำให้ผู้คนสามารถรับชมวิดีโอ YouTube ได้อย่างราบรื่นแม้ในความละเอียด 4K
นำเสนอสถานการณ์การใช้วิดีโอบนเว็บไซต์
ด้วยเหตุนี้ แม้แต่การฝังวิดีโอบนเว็บไซต์ก็มีความโดดเด่นเช่นกัน ท้ายที่สุดแล้ว วิดีโอนำเสนอวิธีการสื่อสารและยกระดับประสบการณ์ผู้ใช้ที่น่าดึงดูดยิ่งขึ้น
บางคนพัฒนาให้ดียิ่งขึ้นไปอีกโดยใช้วิดีโอเป็นพื้นหลังทั้งหมดในเว็บไซต์เพื่อเพิ่มองค์ประกอบที่มีชีวิตชีวาและดึงดูดสายตาให้กับการออกแบบเว็บไซต์ของตน
เนื่องจากพบว่ากลยุทธ์นี้มีประสิทธิภาพมากกว่าในการดึงดูดและรักษาความสนใจของผู้เข้าชม จึงกลายเป็นแนวทางปฏิบัติมาตรฐานสำหรับบุคคลใดๆ ในการฝังวิดีโอลงในไซต์ WordPress ของตน
แต่ความจริงไม่ใช่ว่าทุกคนจะทำสิ่งที่ถูกต้อง ส่วนใหญ่ไม่ทราบวิธีที่ถูกต้องในการฝังวิดีโอบน WordPress และเป็นผลให้ความเร็วเว็บไซต์ช้าลง
มันไม่ใช่ข้อความที่ประดิษฐ์ขึ้น เราต้องการปล่อยให้ตัวเลขและผลลัพธ์บอกความจริง
WordPress พร้อมวิดีโอ: การทดสอบ Core Web Vital
มาดูการทดสอบและผลลัพธ์กันดีกว่าโดยไม่ต้องลากหรือคุยโม้อีกต่อไป
ประการแรก เพื่อวัตถุประสงค์ในการทดสอบ เราใช้เว็บไซต์ WordPress ที่เรียบง่ายและเป็นพื้นฐานโดยไม่มีวิดีโอและกราฟิกใดๆ และนำมาทดลองดู
ผลลัพธ์มีดังนี้:
- คุณจะเห็นว่าคะแนนเป็น 100 % พร้อมสัญญาณสีเขียว และตัวชี้วัดทั้งหมดแสดงการตอบรับเชิงบวกสำหรับทั้งอุปกรณ์เคลื่อนที่และเดสก์ท็อป
แต่เมื่อเราเพิ่มวิดีโอ YouTube ลงในหน้าแรกของไซต์ WordPress และทำการทดสอบอีกครั้ง ผลลัพธ์ที่ได้นั้นน่าประหลาดใจ
- สำหรับวิดีโอเดียว คะแนนลดลงเหลือ 65% และเมตริกอื่นๆ ทั้งหมดก็เป็นไปตามนั้น ลดลงอย่างมากถึง 35% ซึ่งเป็นแนวโน้มที่อาจแย่ลงหากมีการเพิ่มวิดีโอเพิ่มเติม
ตอนนี้คุณอาจกำลังคิดว่าอะไรคือวิธีแก้ปัญหา?
คุณต้องแก้ไขปัญหานี้อย่างไร?
แนวทางโดยตรงที่คุณอาจนึกถึงคือการไม่ใช้วิดีโอใด ๆ บนไซต์ แต่นี่ไม่ใช่แนวทางที่ถูกต้อง วิดีโอมีคุณค่าและยังช่วยปรับปรุงประสบการณ์ผู้ใช้ของเว็บไซต์อีกด้วย ดังนั้นคุณไม่สามารถเพิกเฉยต่อสิ่งเหล่านี้เพียงเพื่อเพิ่มความเร็วของเว็บไซต์ของคุณได้
1. เลือกแพลตฟอร์มการโฮสต์วิดีโอที่มีชื่อเสียง
อันดับแรก คงจะดีไม่น้อยหากคุณโฮสต์หรืออัปโหลดวิดีโอบนแพลตฟอร์มโฮสต์วิดีโอฟรี เช่น YouTube, Vimeo หรือ Wistia แทนที่จะโฮสต์ไว้บนเว็บเซิร์ฟเวอร์ของคุณ ไม่เพียงแต่จะช่วยประหยัดทรัพยากรเซิร์ฟเวอร์ของคุณ แต่ยังช่วยลดภาระและไม่ส่งผลต่อความเร็วของเซิร์ฟเวอร์อีกด้วย
แพลตฟอร์มการโฮสต์วิดีโอเหล่านี้ได้รับการปรับให้เหมาะสมสำหรับการส่งวิดีโอและสามารถรองรับแบนด์วิธที่จำเป็นสำหรับการสตรีมวิดีโอ
หมายเหตุ : นอกเหนือจากแพลตฟอร์มโฮสต์วิดีโอฟรี หากคุณต้องการสร้างเว็บไซต์หลอดวิดีโอของคุณเองโดยใช้ WordPress ไม่มีแพลตฟอร์มโฮสต์วิดีโอส่วนตัวอื่นใดที่สามารถเอาชนะแพลตฟอร์มโฮสต์วิดีโอเฉพาะของ WPOven ในแง่ของเกือบทุกอย่าง
2. ฝังวิดีโอ YouTube โดยไม่มีคุกกี้
คุณอาจแปลกใจที่รู้ว่านอกเหนือจากการฝัง YouTube แบบมาตรฐานแล้ว ยังมีเวอร์ชันพิเศษที่เรียกว่า youtube-nocookie.com อีกด้วย
การฝังวิดีโอ YouTube จากเวอร์ชันมาตรฐานจะมีองค์ประกอบที่ไม่ต้องการอื่นๆ มากมาย เช่น คุกกี้ สคริปต์ ฯลฯ ซึ่งไม่จำเป็น ดังนั้น เพื่อให้มีประสิทธิภาพมากขึ้น YouTube จึงเปิดตัวเวอร์ชัน youtube-nocookie.com ซึ่งเบากว่าและไม่ส่งผลต่อคะแนนความเร็วหน้าเว็บของคุณมากนัก
นี่คือข้อเท็จจริงที่น่าสนใจเกี่ยวกับ Youtube-nocookie.com
- เป็นโดเมนทางเลือกสำหรับการฝังวิดีโอ YouTube
- โดเมนนี้ใช้เพื่อฝังวิดีโอโดยไม่ต้องตั้งค่าคุกกี้เพื่อการติดตาม
- การฝัง YouTube ตามปกติ (youtube.com) อาจตั้งค่าคุกกี้บนเบราว์เซอร์ของผู้ดู
- โดเมน “youtube-nocookie.com” ให้บริการโปรแกรมเล่นแบบฝังโดยไม่ต้องตั้งค่าคุกกี้ใดๆ
- มีประโยชน์สำหรับเว็บไซต์ที่ให้ความสำคัญกับความเป็นส่วนตัวของผู้ใช้และมีเป้าหมายที่จะลดการใช้คุกกี้ให้เหลือน้อยที่สุด
- การใช้ “youtube-nocookie.com” ช่วยให้มั่นใจได้ว่าวิดีโอที่ฝังไว้จะไม่มีส่วนช่วยในการติดตามผู้เยี่ยมชมเว็บไซต์โดยไม่จำเป็น
สิ่งที่คุณต้องทำก็แค่แก้ไข URL ของวิดีโอ YouTube โดยแทนที่ “youtube.com” ด้วย “youtube-nocookie.com” เท่านี้ก็พร้อมใช้งานแล้ว
3. ใช้ปลั๊กอิน LazyLoad
การโหลดแบบ Lazy Loading เป็นหนึ่งในเทคนิคที่ดีที่สุดในการเพิ่มประสิทธิภาพความเร็วเว็บไซต์โดยเพียงแค่เลื่อนองค์ประกอบบางอย่างของเว็บไซต์ออกไป ปลั๊กอินจะชะลอการโหลดองค์ประกอบต่างๆ เช่น รูปภาพหรือวิดีโอ จนกว่าผู้ใช้จะเลื่อนไปที่องค์ประกอบเหล่านั้นหรือเข้ามาดู
นี่คือสิ่งที่เกิดขึ้น:
- ปลั๊กอินการโหลดแบบ Lazy Loading จะสแกนเนื้อหาของหน้าเว็บเมื่อเริ่มต้น
- โดยจะตรวจสอบส่วนที่มองเห็นได้ของเว็บไซต์แก่ผู้ใช้อย่างต่อเนื่อง
- เมื่อองค์ประกอบที่ทำเครื่องหมายสำหรับการโหลดเมื่อจำเป็นกำลังจะเข้าสู่วิวพอร์ตของผู้ใช้ ปลั๊กอินจะทริกเกอร์การโหลด
- เมื่อผู้ใช้เข้าสู่วิวพอร์ต องค์ประกอบต่างๆ จะถูกโหลดแบบไดนามิก ซึ่งมักใช้ JavaScript โดยไม่ต้องโหลดซ้ำทั้งหน้า
- ปลั๊กอินการโหลดแบบ Lazy Loading ใช้ JavaScript เพื่อโหลดเนื้อหาลงในเว็บเพจแบบไดนามิกในขณะที่ผู้ใช้โต้ตอบกับมัน
- ปลั๊กอินจัดลำดับความสำคัญของการโหลดตามตำแหน่งหรือความสำคัญขององค์ประกอบ ทำให้มั่นใจได้ถึงประสบการณ์ผู้ใช้ที่ราบรื่น ในขณะเดียวกันก็ลดเวลาในการโหลดครั้งแรกและการใช้แบนด์วิดท์
หมายเหตุ: วิธีการนี้มีข้อจำกัดบางประการ ปลั๊กอินโหลดแบบ Lazy Load จะไม่ทำงานหากวิดีโอวางอยู่ในครึ่งหน้าแรก แต่จะทำงานได้ดีที่สุดเมื่อวิดีโอปรากฏอยู่ใต้ครึ่งหน้าแรก
อ่าน: 22 วิธีที่ดีที่สุดในการเพิ่มประสิทธิภาพ WordPress
4.เทคนิคซุ้ม
แนวทาง Facade เป็นหนึ่งในวิธีที่ชาญฉลาดในการใช้เทคนิค Lazy Loading ในแนวทางนี้ คุณจะใช้ตัวยึดรูปภาพแบบคงที่ตั้งแต่แรกแทนการใช้วิดีโอ โดยทั่วไปรูปภาพนี้จะมีลักษณะคล้ายกับภาพขนาดย่อของวิดีโอโดยมีปุ่มเล่นซ้อนทับ
เมื่อผู้ใช้คลิกที่ปุ่มซ้อนทับเล่น หน้าต่างป๊อปอัปจะปรากฏขึ้น และวิดีโอจริงจะเริ่มโหลดในหน้าต่างป๊อปอัปเดียวกัน
เพื่อการอ้างอิงและความเข้าใจที่ดีขึ้น นี่คือตัวอย่าง
แนวทางนี้ค่อนข้างมีประสิทธิภาพและไม่สร้างภาระให้กับไซต์ WordPress ของคุณด้วยวิดีโอ YouTube เว้นแต่จะจำเป็น
หากวิธีไลท์บ็อกซ์นี้ไม่เหมาะกับคุณ ให้ใช้ปลั๊กอิน WordPress ยอดนิยมชื่อ ” ปลั๊กอิน LazyLoad “ ทำงานร่วมกับ oEmbed และแทนที่วิดีโอ YouTube และ Vimeo ที่ฝังไว้ด้วยภาพตัวอย่างที่คลิกได้
สรุป
ตอนนี้เรามาสรุปสิ่งที่เราได้กล่าวถึงในโพสต์ข้างต้น ไม่ต้องสงสัยเลยว่าวิดีโอเป็นหนึ่งในวิธีที่ดีที่สุดและมีการโต้ตอบมากที่สุดในการแบ่งปันข้อมูล อย่างไรก็ตาม ไม่มีใครอยากจ่ายราคานี้เพื่อทำให้เว็บไซต์ช้าลง
แต่โชคดีที่มีเคล็ดลับและเทคนิคบางประการที่เราได้กล่าวไปแล้ว ซึ่งสามารถสร้างสิ่งมหัศจรรย์ให้กับเว็บไซต์ของคุณได้โดยไม่กระทบต่อความเร็วและประสิทธิภาพของเว็บไซต์ ดังนั้น ปฏิบัติตามเคล็ดลับเหล่านี้และเพิ่มความเร็วเว็บไซต์ของคุณเพื่อให้ได้คะแนน 100 เพียงลองดูและชนะการแข่งขัน
Rahul Kumar เป็นผู้ชื่นชอบเว็บไซต์และเป็นนักยุทธศาสตร์ด้านเนื้อหาที่เชี่ยวชาญด้าน WordPress และเว็บโฮสติ้ง ด้วยประสบการณ์หลายปีและความมุ่งมั่นในการติดตามแนวโน้มของอุตสาหกรรม เขาจึงสร้างกลยุทธ์ออนไลน์ที่มีประสิทธิภาพที่กระตุ้นการเข้าชม เพิ่มการมีส่วนร่วม และเพิ่ม Conversion ความใส่ใจในรายละเอียดและความสามารถในการสร้างสรรค์เนื้อหาที่น่าสนใจของ Rahul ทำให้เขาเป็นทรัพย์สินที่มีค่าสำหรับแบรนด์ใดๆ ก็ตามที่ต้องการปรับปรุงการนำเสนอตัวตนในโลกออนไลน์