شهد الموقع الإلكتروني الذي أُعيد إطلاقه أيضًا زيادة في إمكانية عرض الإعلانات بنسبة تزيد عن %75، وانخفاضًا في معدّلات الارتداد بنسبة %50، وزيادة في عدد مشاهدات الصفحة بنسبة %27.
عندما أعلنت Google عن مبادرة "مؤشرات أداء الويب الأساسية"، أدركت دار النشر الألمانية Netzwelt بسرعة إمكانات هذه المقاييس الجديدة في تحسين تجربة الصفحة وزيادة الأرباح من الإعلانات. وبدأت الشركة رحلة لإعادة إطلاق موقعها الإلكتروني، مع تطبيق أفضل الممارسات الشائعة لتحسين الأداء وتحسين علامات الإعلانات ومواضعها في الوقت نفسه. أثبت الالتزام بتوفير تجربة مستخدم رائعة وصفحات سريعة التحميل أنّه مسار يؤدي إلى تحسين التفاعل وإيرادات الإعلانات معًا، ويعود ذلك إلى زيادة عدد مشاهدات الصفحة على الويب بنسبة %27 وزيادة إمكانية عرض الإعلانات بنسبة تزيد عن %75 وزيادة إيرادات الإعلانات بنسبة %18.
27%
زيادة في عدد مشاهدات الصفحة
18%
زيادة في أرباح الإعلانات
75%
إمكانية عرض الإعلانات
التحدي
مثل العديد من الناشرين الآخرين للأخبار، واجهت شركة Netzwelt صعوبة في إيجاد التوازن الصحيح بين تحسين تجربة المستخدم وسرعة الصفحة مع الحفاظ على ارتفاع أرباح الإعلانات. وفيما يلي التحديات الرئيسية التي واجهوها:
- ارتفاع متغيّرات التصميم التراكمية (CLS) بسبب تغييرات التصميم التي تسبّبها الإعلانات، خاصةً من الخانات الإعلانية متعددة الأحجام والملصقات الإعلانية العلوية
- ظهور سرعة عرض أكبر جزء من المحتوى على الصفحة (LCP) بعد وقت متأخر بسبب أنّ الإعلانات هي أكبر جزء من المحتوى المرئي أو بسبب استغراقها لسعة النطاق من تحميل الصورة الرئيسية
- ارتفاع مهلة الاستجابة لأوّل إدخال (FID) بسبب JavaScript التابع لجهة خارجية والمطلوب للإعلانات، وعروض الأسعار في عنوان الصفحة، وأغراض أخرى
- الآثار الجانبية على "مؤشرات أداء الويب الأساسية" الناتجة عن مربّعات حوار طلب الموافقة التي تتحكّم فيها جهات خارجية، التي تسبّبت أيضًا في حدوث تغييرات في التصميم وقد يتم رصدها على أنّها عمليات عرض متأخرة لأكبر محتوى مرئي
تحسين موقع إلكتروني إخباري وفقًا لمؤشرات Core Web Vitals
عندما بدأت شركة Netzwelt العمل على "مؤشرات أداء الويب الأساسية"، لاحظت سريعًا أنّ تحسين "مؤشرات أداء الويب الأساسية" لا يؤثر سلبًا في الإعلان، بل يمكن استخدامه كفرصة لتحسين إمكانية عرض الإعلان. لذلك، عمل فريق Netzwelt على تحسين "مؤشرات أداء الويب الأساسية" لرفع إمكانية عرض الإعلانات إلى أكثر من% 75 من أجل جذب إعلانات ذات قيمة أعلى (المتوسط العالمي للإعلانات الصورية هو أقل من%50).
تحسين مقياس CLS
غالبًا ما يتم تحميل الإعلانات متأخرًا (أحيانًا عن قصد من خلال التحميل البطيء)، ولا يُعرف حجمها الفعلي غالبًا مسبقًا بسبب مواضع الإعلانات المتعدّدة الأحجام والمتغيرة.
يمكن تقسيم المشكلة إلى قسمَين: الإعلانات فوق وتحت الفاصل.
يمكن أن تؤدي الإعلانات فوق مستوى العرض إلى حدوث قفزات كبيرة في التنسيق بسبب تحميلها متأخرًا وبأحجام غير معروفة. يمكن أن يؤدي حظر أكبر مساحة قد يحتاجها المعلِنون إلى تجربة مستخدم سيئة، في حين أنّ طلب أحجام ثابتة من المعلِنين قد يؤدي إلى تقليل أرباح الإعلانات. حلّت شركة Netzwelt هذه المشكلة من خلال جعل الإعلان العلوي ثابتًا وإزالة بعض أحجام إعلانات البانر الأكبر المسموح بها. ويتجنّب الإعلان الذي يظهر على سطح الفيديو بدء عمليات تغيير التصميم للإعلانات ذات الأحجام المختلفة. على الرغم من أنّ الأحجام المؤهّلة المنخفضة تؤثر في مبيعات الإعلانات، إلا أنّ إمكانية العرض الأفضل تعوض ذلك بسهولة.
ساعدت البيانات السابقة واختبارات أ/ب Netzwelt في العثور على الحجم المناسب وموضع الإعلان المناسب للأجهزة وأحجام الشاشات المختلفة، وقواعد وسائط CSS المستخدَمة لحجز المساحة.
توفّر الإعلانات في الجزء السفلي غير المرئي من الصفحة مجالًا للتحسين بشكل كبير:
- إنّ إعلان البانر الذي لا يظهر ولكن يتم تحميله يتسبب في انخفاض إمكانية عرض الإعلان ويزيد من سوء تجربة الصفحة.
- يمكن أن يؤدي إعلان البانر الذي يتم تحميله في الوقت الذي ينتقل فيه المستخدم فوقه إلى حدوث قفزات إضافية في المحتوى.
للحفاظ على تجربة صفحة جيدة وإمكانية عرض عالية للإعلانات، نفّذت شركة Netzwelt ميزة "التحميل البطيء" ومساحة محجوزة لحجم الحد الأدنى المشترَك. في منطقة متعددة الأحجام، يتم حجز ارتفاع 250 بكسل لإعلانات البانر المطلوبة بحجم 300×250 إلى 300×600. وقد أدّى ذلك إلى إيقاف تغييرات التنسيق في الأحجام الأصغر وخفضها بشكل كبير في إعلانات البانر الأكبر حجمًا. هذا النهج ليس مثاليًا، ولكنه بداية وحل وسط جيد.
لتحسين الأداء بشكلٍ أكبر، استخدَمت Netzwelt Intersection Observer وNetwork Information API للتحكّم في مواضع الإعلانات والحدّ من تغييرات التنسيق. يتم استخدام مواضع إعلانات واستراتيجيات تحميل بطيء مختلفة استنادًا إلى موضع التمرير وجودة الاتصال بالشبكة، وقد يتم تغيير الإعلانات من أحجام متعدّدة إلى أحجام ثابتة. ويتمثل هدف الخوارزمية دائمًا في زيادة إمكانية عرض الإعلان إلى أقصى حدّ مع تقليل متغيّرات التصميم إلى أدنى حدّ. تستخدِم المتصفّحات التي لا تتوافق مع NetworkInfo API قيمة وكيل تستند إلى مزيج من نوع الشبكة المستمَد من الجهاز وعنوان IP. تعمل استراتيجية التحميل التكيُّفي هذه على تقليل CLS بشكل خاص للمستخدمين الذين لديهم اتصالات إنترنت بطيئة.
تحسين مهلة الاستجابة لأوّل إدخال (FID)
قد يبدو أنّ "وقت استجابة الإدخال الأول" يشكّل مشكلة لجهات نشر الأخبار، لأنّ الإعلانات غالبًا ما تتضمّن العديد من مكتبات JavaScript الإضافية. ويبدو أنّ هناك تأثيرًا سلبيًا عند الاطّلاع على بيانات المختبر، مثل Lighthouse. ومع ذلك، عند الاطّلاع على بيانات الحقل في موسوعة الويب لعام 2020، تستجيب العديد من المواقع الإلكترونية بسرعة كافية. ويعود جزء من ذلك إلى تحميل JavaScript للإعلانات في وقت متأخر (بعد الإدخال الأول)، أو ميزة التخزين المؤقت بشكل جيد (على سبيل المثال، معالجة تخزين رموز v8 مؤقتًا)، أو تحسينها جيدًا من قِبل مورّدي الإعلانات. يحرص أدوات تتبُّع مدى إمكانية العرض لدى المورّدين على تجنُّب المهام الطويلة، حتى إذا كان مجموع وقت التشغيل طويلاً، فإنّ إجمالي وقت الحظر (TBT) وFID لا يتأثّران. على الرغم من أنّ مقياس "التفاعل الأولي للمستخدم" لم يكن يشكّل مشكلة كبيرة لشركة Netzwelt، كان لا يزال هناك بعض التحسينات التي يمكن إجراؤها:
- تقليل النصوص البرمجية للإعلانات ومقدّميها، مع التركيز على حزمة واحدة إن أمكن
- تحميل جميع النصوص البرمجية باستخدام defer أو async
- استخدام webpack أو تقنيات مشابهة لإزالة المحتوى غير الضروري وإزالة الحِزم
- استخدام قواعد CSS بسيطة مثل BEM
- تجنُّب المهام التي تستغرق وقتًا طويلاً واستخدام نمط الخمول إلى أن تصبح المهام عاجلة
- استخدام RequestAnimationFrame حيثما يتأثّر التنسيق
تحسين سرعة LCP
يمكن أن يتأثّر مقياس "سرعة عرض أكبر جزء من المحتوى على الصفحة" بالإعلانات بطريقتين: بشكل صريح من خلال التعرّف على إعلان على أنّه أكبر جزء من المحتوى المعروض، وبطريقة غير مباشرة من خلال ازدحام عرض النطاق للشبكة أو التأثير في المسار الحرج لكي لا يتم تحميل أكبر جزء من المحتوى المعروض (مثل الصورة الرئيسية) بشكلٍ سريع بما يكفي.
سبق أن أزالت Netzwelt الإعلانات المستطيلة المتوسطة من أعلى خانات الإعلانات أثناء تحسين CLS. وقد نتج عن ذلك ميزة إضافية تتمثل في عدم اتّخاذ الإعلانات للمساحة الأكبر.
تتّبع Netzwelt سياسة صارمة تمنح الأولوية للمحتوى على الإعلانات. منحت شركة Netzwelt الأولوية للصور الرئيسية والخطوط المستخدَمة في الجزء العلوي من الصفحة، وفعّلت المسار الحرج ليحظى بالأولوية على النصوص البرمجية للإعلانات والإعلانات. وقد ساعدت هذه الأولوية في عدم تأثُّر مقياس LCP بالإعلانات.
بالإضافة إلى هذه التحسينات، اتّبعت Netzwelt أفضل الممارسات الأخرى التالية:
- فصل ملف CSS عن مسار العرض المهم ووضعه في العنوان
- يتم تحميل أهم الخطوط والنصوص البرمجية والصور مسبقًا.
- تجنّبت استخدام أسلوب "التحميل الكسول" للصور في الجزء المرئي من الصفحة.
- تم استخدام
font-display="swap".
الموافقة على "اللائحة العامّة لحماية البيانات" و"مؤشرات أداء الويب الأساسية"
غالبًا ما تؤثّر مربّعات حوار طلب الموافقة سلبًا في "مؤشرات أداء الويب الأساسية". كما هو الحال مع الإعلانات، هناك طريقتان يمكن أن يؤثّر بهما مربّع حوار الموافقة في "مؤشرات أداء الويب الأساسية":
- بشكل صريح إذا تم رصده على أنّه أكبر عملية رسم أو إذا كان يتسبب في تغييرات في التنسيق
- بشكل ضمني، من خلال سرقة معدل نقل البيانات من أكبر عملية رسم فعلية، أو حظر المسار الحرج إلى أكبر عملية رسم، أو تأخير عرض الإعلانات إلى أن يتم الحصول على الموافقة، ما قد يؤدي بدوره إلى حدوث تغييرات في التنسيق.
تتعامل شركة Netzwelt مع مزوّد موافقة تابع لجهة خارجية، والذي نفّذ أيضًا تحسينات. أولاً، حرصت شركة Netzwelt على تجنُّب الأخطاء البسيطة:
- يتم تحميل نصوص Consent البرمجية بشكل غير متزامن، وذلك لتجنّب حظر الموارد الأساسية.
- يتم تنسيق الموافقة بحيث لا تكون العناصر الكبيرة مؤهّلة لتكون أكبر عنصر ضمن مقياس LCP.
- يستخدم تراكب طلب الموافقة الرمز
position: fixedلتجنّب حدوث تغييرات. - على الرغم من أنّ الإعلانات لا تظهر إلا بعد منح الموافقة، يتم الحفاظ على مساحة بيضاء كافية مسبقًا لتجنّب تغييرات التنسيق عند تحميل الإعلانات.
- التأكّد من أنّ عرض مربّع حوار الموافقة وموضعه لا يؤديان إلى تغييرات في التنسيق من بين المشاكل التي تم رصدها وحلّها هنا، خيار قفل الانتقال للأعلى أو للأسفل الذي يوفّره مقدّم الخدمة، والذي كان يوقف الانتقال للأعلى أو للأسفل أثناء عرض طلب الموافقة من خلال نقل المحتوى الرئيسي للمقالة عند الانتقال للأعلى أو للأسفل، ما كان يؤدي إلى تغييرات في التنسيق.
بعد هذا العمل، ظلّ هناك اختلافات كبيرة بين CLS في الحقل والمختبر. على الرغم من أنّ قيمة CLS في المختبر كانت قريبة من الصفر، كانت قيم الحقول أعلى بكثير من الحدود المسموح بها. بعد التحقيق في المشكلة، تبيّن أنّ السبب هو تغييرات التنسيق ضمن إطار iframe الخاص بالموافقة، التي لا يتم تسجيلها بشكل صحيح حاليًا إلا في بيانات الحقول. يواصل فريق Netzwelt العمل مع مقدّم الموافقة التابع للجهة الخارجية لتحسين هذه المشكلة.
نماذج الاشتراك في خدمة الأخبار ومؤشرات Core Web Vitals
يعتمد ناشرو الأخبار نماذج الاشتراكات لتمويل الصحافة. يرتبط هذا النموذج بمؤشرات أداء الويب الأساسية لأنّ المستخدمين لن يشتركوا في المواقع الإلكترونية التي توفّر تجربة سيئة. بالإضافة إلى ذلك، لا يتوقّع المشتركون رؤية إعلانات في المحتوى المدفوع، ولكن قد يؤدي إخفاء الإعلانات إلى تغييرات في التنسيق. يجب أن يتحقّق الموقع الإلكتروني ممّا إذا كان المستخدمون مؤهّلين لعرض المحتوى وما إذا كان سيتم عرض الإعلانات. وقد تؤدي عمليات التحقّق هذه إلى زيادة وقت الاستجابة، ما يؤدي إلى تغييرات في المحتوى أو تجربة سيئة للمستخدم.
يستخدم Netzwelt نموذجًا يتيح للمستخدمين مشاهدة المحتوى مجانًا في جميع الأوقات، ولكن لن تظهر الإعلانات للمشتركين. لقد حقّقوا في طرق مختلفة لطلب الأذونات وتخزينها من أجل تقليل أوقات الاستجابة وعمليات تغيير التنسيق.
كان الاستعلام الأولي عن الإذن يتسبب دائمًا في حدوث تأخيرات، وبالتالي، إذا استغرق الاستعلام عن الأذونات وقتًا طويلاً جدًا، سيعرض الموقع الإلكتروني آخر حالة محفوظة في ذاكرة التخزين المؤقت. بالنسبة إلى المشتركين الجدد، يعني ذلك أنّ هناك خطرًا بسيطًا بأن يرى المستخدم المدفوع الإعلانات مرة واحدة. قد يلاحظ المستخدمون الذين أنهوا للتو اشتراكًا تحميلًا واحدًا بدون إعلانات قبل تعديل الأذونات المخزّنة على الجهاز. بعد معرفة الأذونات، يتم تخزينها محليًا باستخدام LocalStorage API، لتجنُّب حدوث تأخيرات إضافية وتغييرات في التنسيق أثناء التنقّل في المستقبل.
نتائج التحسين
تتحدّث نتائج تحسينات Netzwelt عن نفسها. وحصدت هذه المواقع درجات لا مثيل لها في "إحصاءات PageSpeed" بين ناشري الأخبار في جميع أنحاء العالم:
أدّت التحسينات إلى تحسين تجربة الصفحة، ولكن تم إجراؤها مع وضع النشاط التجاري في الاعتبار، ما أدّى إلى تحسين تجربة الإعلان، وإمكانية ظهور الإعلان، وزيادة الأرباح. بعد إعادة إطلاق الصفحة المحسّنة، شهدت شركة Netzwelt زيادة في التكلفة لكل ألف ظهور بنسبة تتراوح بين %20 و%30، مع إمكانية عرض الإعلانات بنسبة تزيد عن %75. ومع ذلك، تفترض شركة Netzwelt أنّ الزيادة الإجمالية في الأرباح ستكون أعلى. زادت الزيارات منذ إعادة الإطلاق، ويعود السبب على الأرجح إلى زيادة تفاعل المستخدمين وانخفاض معدّلات الارتداد بسبب تحسين تجربة المستخدم. من الصعب تحديد هذه التأثيرات وربطها بإعادة الإطلاق، لأنّ عدد الزيارات يتفاوت بشكل طبيعي، وهناك أيضًا تأثيرات من الوباء العالمي. هذه التأثيرات غير المباشرة هي أحد الأسباب التي تدفع Netzwelt إلى مراجعة جميع الأرقام دائمًا عند مراجعة موقعها الإلكتروني، وليس فقط تكلفة الألف ظهور، التي قد تكون مضلِّلة. توفّر مؤشرات أداء الويب الأساسية ومقاييس تجربة المستخدم، بالاشتراك مع جميع المقاييس ذات الصلة بالإعلانات، الصورة الحقيقية.
نظرة على المستقبل
تعتقد شركة Netzwelt أنّ الاستهداف السياقي من خلال المحتوى، بالإضافة إلى تجربة المستخدم الجيدة وتجربة الصفحة (بما في ذلك إمكانية عرض الإعلانات)، هو مفتاح النجاح بصفتك ناشر أخبار في المستقبل الذي لن تتوفّر فيه ملفات تعريف الارتباط التابعة لجهات خارجية.
لذلك، لا تقتصر شركة Netzwelt على تحسين مؤشرات Core Web Vitals، بل تبذل قصارى جهدها من خلال تنفيذ العديد من إمكانات الويب الحديثة، مثل التطبيقات المتوافقة مع الويب (PWA) والمحتوى بلا إنترنت والوضع الداكن وWeb Share API وTrusted Web Activities (TWA) باستخدام واجهة برمجة التطبيقات الجديدة Digital Goods API.