คำถามที่พบบ่อย (FAQ) – Lazy Loading, Infinite Scroll และ Single Page Apps (SPA)

เผยแพร่แล้ว: 2018-06-01
วิธีตั้งค่า Lazy Loading และ Infinite Scroll ด้วยการเสนอราคาส่วนหัวของ PubGuru

โพสต์นี้ได้รับการอัปเดตล่าสุดเมื่อวันที่ 14 กันยายน 2021

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

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

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

เทคนิคทั้งสามนี้มักจะรวมกันเพื่อสร้างประสบการณ์การใช้งานเว็บที่ราบรื่นและรวดเร็วมาก

พร้อมที่จะเชี่ยวชาญพื้นที่โฆษณาของคุณอย่างมืออาชีพแล้วหรือยัง มาเป็นกูรูด้านโฆษณากับ PubGuru University! ในเวลาจำกัด รับสิทธิ์เข้าถึงหลักสูตร School Of AdSense, Ad Exchange และ Google Ad Manager ในราคาเพียง $199! คลิกที่นี่เพื่อลงทะเบียน

ฉันจะรู้ได้อย่างไรว่า Lazy/Infinite/SPA เหมาะกับฉัน

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

ประการที่สอง คุณต้องพิจารณาว่าผู้โฆษณาซื้อโฆษณาในวงจรความคิดเห็น เมื่อคุณเริ่มเปลี่ยนไปใช้โหมด lazy/infinite ผู้เผยแพร่โฆษณาส่วนใหญ่จะเห็นว่า RPM เซสชันลดลงทันที เนื่องจากหน่วยโฆษณาแบบดั้งเดิม โดยเฉพาะหน่วยที่อยู่ด้านล่างของหน้ามีความสามารถในการแสดงตัวโฆษณาต่ำกว่ามาก ประสิทธิภาพของโฆษณานั้นถูกใส่เข้าไปในพื้นที่โฆษณาที่ขี้เกียจ/ไม่สิ้นสุดใหม่ ลูปคำติชมต้องใช้เวลาสำหรับผู้ลงโฆษณาในการปรับเปลี่ยน เราเห็นว่าต้องใช้เวลา 4-8 สัปดาห์ก่อนที่ผู้เผยแพร่โฆษณาจะเริ่มคุ้มทุน หากคุณไม่มีเวลาเพียงพอในวงจรรายได้ในการลงทุน คุณไม่ควรทดสอบการโหลดแบบขี้เกียจ

ประการที่สาม ผู้เผยแพร่โฆษณาบางรายพึ่งพาการค้นหาทั่วไปหรือการเข้าถึงโซเชียลทั่วไปเป็นอย่างมาก เครื่องมือสร้างดัชนีจำนวนมากของเสิร์ชเอ็นจิ้นหลักและโซเชียลเน็ตเวิร์กมีช่วงเวลาที่ยากลำบากในการจัดทำดัชนีเนื้อหาแบบ lazy/infinite/SPA สำหรับผู้เผยแพร่โฆษณาบางราย การเปลี่ยนไปใช้ lazy/infinite/SPA สามารถลดการเข้าชมแบบออร์แกนิกได้ จากที่กล่าวมา Google และ Facebook ค่อนข้างเชี่ยวชาญในการสร้างดัชนี lazy/infinite/SPA อย่างเหมาะสมเมื่อใช้งานอย่างสมบูรณ์ด้วยเฟรมเวิร์กจาวาสคริปต์หลัก ในทางกลับกัน Google และ Facebook รวมความเร็วในการโหลดหน้าเว็บอย่างมากในอัลกอริธึมการเข้าถึงแบบออร์แกนิก และการเร่งความเร็วเพจของคุณอย่างมากอาจส่งผลให้การเข้าชมแบบออร์แกนิกเพิ่มขึ้นอย่างมาก ดังนั้น ให้ความสนใจ — หากการเข้าถึงแบบออร์แกนิกของคุณต้องเสียศูนย์หลังจากเปลี่ยน คุณควรพิจารณาอย่างยิ่งที่จะเปลี่ยนกลับไปใช้การตั้งค่าแบบดั้งเดิม

lazy/infinite/SPA เพิ่มรายได้หรือไม่?

แนวคิดทั่วไปเกี่ยวกับ lazy/infinite/SPA คือผู้ใช้จะได้รับโฆษณา/เนื้อหาเมื่ออยู่ใกล้เท่านั้น สิ่งนี้ช่วยเพิ่มความสามารถในการแสดงตัวโฆษณาและการมีส่วนร่วมกับโฆษณาเหล่านั้นอย่างมาก แต่ลดจำนวนการแสดงโฆษณาที่แท้จริง ผู้ลงโฆษณาส่วนใหญ่จ่ายเบี้ยประกันภัยที่ไม่สมส่วนเพื่อให้ได้ความสามารถในการแสดงตัวโฆษณาที่สูงขึ้น สถิติอุตสาหกรรมแสดงความสามารถในการแสดงตัวโฆษณาเพิ่มขึ้นสองเท่าจากหน่วยความสามารถในการแสดงตัวโฆษณา 35-40% เป็น 70-80% ส่งผลให้รายได้เพิ่มขึ้น 2.4 เท่า นี่เป็นอีกเหตุผลหนึ่งที่ผู้เผยแพร่ต้องการใช้ lazy/infinite/SPA

ด้วย SPA ฉันสามารถรีเฟรชโฆษณาเมื่อผู้ใช้ไปที่เนื้อหาใหม่ได้หรือไม่

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

ฉันควรโหลดแบบ lazy/infinite เมื่อใด และควรโหลดเนื้อหาจำนวนเท่าใด

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

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

เราสามารถโหลดโฆษณาได้กี่รายการในหน้าเดียวด้วย lazy/infinite/SPA

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

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

ฉันสามารถใช้แท็ก หน่วยโฆษณา หรือ PID การเสนอราคาส่วนหัวเดียวกันเพื่อแยกการทดสอบแบบ lazy/infinite/SPA กับการตั้งค่าแบบเดิมได้หรือไม่

ไม่ หากคุณทำเช่นนี้ ผู้ลงโฆษณาจะไม่สามารถแยกความแตกต่างระหว่างสองส่วนของพื้นที่โฆษณาได้ การแสดงโฆษณาบนประสบการณ์ใช้งานโฆษณาแบบสันหลังยาว/ไม่จำกัดมักจะมีความสามารถในการแสดงตัวโฆษณาและ CTR สูงกว่ามาก เนื่องจากมีแนวโน้มที่จะมีผู้เห็นมากขึ้น (จะไม่โหลดจนกว่าผู้ใช้จะปิด) หากไม่ให้ผู้ลงโฆษณาสามารถแยกความแตกต่างของพื้นที่โฆษณาได้ ผู้เผยแพร่จะเห็นรายได้ที่เพิ่มขึ้นอย่างจำกัดหรือเล็กน้อย นี่คือเหตุผลที่คุณต้องมีแท็กโฆษณาที่แตกต่างกัน หน่วยโฆษณาที่แตกต่างกัน และ PID การเสนอราคาส่วนหัวที่แตกต่างกัน หากทดสอบหรือเปลี่ยนไปใช้ lazy/infinite/SPA

ทำไมการดูหน้าเว็บของฉันจึงลดลงด้วย lazy/infinite/SPA

แพลตฟอร์มการวิเคราะห์ส่วนใหญ่ไม่นับการโหลดแบบ lazy/infinite/SPA เป็นการดูหน้าเว็บใหม่ เว้นแต่คุณจะพัฒนาโค้ดเพื่อเริ่มการทำงานของเหตุการณ์ดังกล่าวโดยเฉพาะ ผลลัพธ์คือจำนวนการดูหน้าเว็บของคุณลดลง คุณควรให้ความสนใจกับเซสชันและ RPM ของเซสชันแทน KPI หลักของคุณ

การประมูลการเสนอราคาส่วนหัวสามารถเริ่มต้นและเริ่มต้นใหม่ด้วย lazy/infinite/SPA ได้เร็วเพียงใด

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

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

ด้วยเหตุผลเหล่านี้ การตั้งค่าแบบ lazy/infinite/SPA มักจะมี PID สำหรับการเสนอราคาส่วนหัว 2-6 ชุดสำหรับหน่วยโฆษณาเดียวกัน ดังนั้นจึงสามารถใช้ในหน่วยเปรียบเทียบและอะนาล็อกด้านล่างของหน้าโดยไม่ต้องทำการประมูลใหม่อีกครั้ง

ฉันจะติดตั้งโฆษณาด้วย lazy/infinite/SPA และ PubGuru/MonetizeMore ได้อย่างไร

ขั้นแรก ให้ฝังการกำหนดค่าของคุณบนหน้าตามปกติ:

 <script src="https://m2d.m2.ai/path-to-config.js" type="text/javascript" async></script>

จากนั้น div โฆษณาของคุณไม่ควรอ้างอิงตาม div ID แต่อ้างอิง data-gpt-parent แทน

 <div class="pg-lazy" data-gpt-parent="ลีดเดอร์บอร์ด"></div>

<div class="pg-lazy" data-gpt-parent="right-rail"></div>

<div class="pg-lazy" data-gpt-parent="in-content"></div>

data-gpt-parent ต้องตรงกับหน่วยใดๆ ในการกำหนดค่าตามช่องหรือรหัสหน่วยโฆษณา (โดยมีหรือไม่มีรหัสเครือข่าย GAM) ซึ่งหมายความว่าหากคุณมีหน่วยเป็น “/1234567890/atf-leaderboard” และ div id (slot) เป็น “atf-lb” ในการกำหนดค่า คุณสามารถใช้ค่าใดๆ ต่อไปนี้สำหรับ data-gpt-parent ของคุณ:

  • /1234567890/atf-ลีดเดอร์บอร์ด
  • atf-ลีดเดอร์บอร์ด
  • atf-ปอนด์

เพียงตรวจสอบให้แน่ใจว่ารหัสหน่วยหรือรหัส div (ช่อง) ไม่ซ้ำกันในการกำหนดค่า เมื่อผู้ใช้เลื่อนหรือเปลี่ยนหน้าด้วย lazy/infinite/SPA คุณสามารถอ้างอิงหน่วย divs เดิมต่อไปได้ และโค้ดของเราจะดูแลส่วนที่เหลือเอง ในโค้ดตัวอย่างด้านบน หากผู้เผยแพร่มีสำเนาของหน่วย "ในเนื้อหา" 5 ชุด โค้ดของเราจะรับการตั้งค่าจากหน่วยนั้นสำหรับแต่ละสำเนาเหล่านั้น

สำหรับการสนับสนุนเพิ่มเติมเกี่ยวกับ PubGuru Header Bidding การโหลดแบบ Lazy Loading และการตั้งค่าการเลื่อนแบบไม่จำกัด ลงชื่อสมัครใช้บัญชี Professional ที่ MonetizeMore วันนี้!

ปรับปรุงล่าสุด: 24 ตุลาคม 2019