4 أهم النصائح لتحسين تدقيق أساسيات الويب

لا توجد قاعدة صارمة وسريعة لكيفية تدقيق Core Web Vitals ، خاصة مع مجموعة متنوعة من أدوات الطرف الثالث التي يجب مراعاتها. نقوم بتفصيل بعض أهم نصائح تدقيق السرعة لدينا لتضمينها في تدفقات العمل الخاصة بك ، والتي ستغطي:

• تجربة الصفحة و Google Search Console
• عيوب PageSpeed ​​Insights
• أدوات تدقيق الطرف الثالث الموصى بها
• فهم مخططات الشلال

1. ابدأ سير عمل تدقيق "أساسيات الويب الأساسية" باستخدام Search Console

عند تدقيق موقع ويب لمعرفة سرعة الموقع ومشكلات Core Web Vitals ، نوصي دائمًا ببدء عملية استكشاف الأخطاء وإصلاحها من خلال مراجعة قسم "Experience" في Search Console - بشرط أن يكون الوصول متاحًا. تعمل Search Console على تجميع بيانات المستخدم (الميدانية) الحقيقية من تقرير Chrome UX ، لذا فهذه طريقة سهلة لفهم أي مشكلات LCP أو CLS أو FID تؤثر على تجربة المستخدم لديك ، وفي النهاية إمكانية ترتيب الموقع.

انتقل إلى "تجربة الصفحة"> "أساسيات الويب الأساسية" ، وسيعرض الرسم البياني المعروض عدد عناوين URL التي تم تصنيفها على أنها "جيدة" أو "بحاجة إلى تحسين" أو "ضعيفة" لموقع الويب. فمثلا:

انظر إلى الرسم البياني أدناه حول التوقيتات والمقاييس من Google على عتبات Core Web Vitals أعلاه.

من هنا ، يمكننا تقييم ما إذا كانت غالبية عناوين URL مصنفة على أنها جيدة أم لا ، وبالتالي اجتياز جميع المقاييس الأساسية الثلاثة لأهمية الويب ، أو ما إذا كانت معظم الصفحات "ضعيفة" أو "بحاجة إلى تحسين" ، مما يشير إلى وجود بعض المشكلات الفنية المعلقة التي تحتاج إلى حل من أجل تمريرها.

نصيحة مفيدة: تحتاج الصفحات إلى اجتياز جميع عناصر الويب الحيوية الثلاثة للانتقال إلى الحالة "جيدة" ، ولا يكفي أن تكون غالبية عناوين URL الخاصة بالموقع في نطاق "بحاجة إلى تحسين".

يمكنك بعد ذلك التعمق في كل قسم لاكتشاف عناوين URL المحددة التي تتأثر بمشكلات السرعة وتحتاج إلى التدقيق. يتم تجميعها حسب تلك المتشابهة على مستوى القالب. لذلك ، بدلاً من محاولة تدقيق جميع الأنواع المختلفة لعناوين URL التي قد يحتوي عليها الموقع - على سبيل المثال الصفحة الرئيسية وصفحات الفئات وصفحات المنتج ومنشورات المدونة وما إلى ذلك ، قد تتمحور المشكلات التي يواجهها المستخدمون الحقيقيون عند زيارة موقع الويب حول 1 أو 2 فقط من هذه ، مما يعني أنه يمكنك تركيز جهودك فقط على هذه القوالب ، والتي يمكن أن توفر الكثير من الوقت.

2. استخدم PageSpeed ​​Insights باعتدال

على الرغم من أن PageSpeed ​​Insights (PSI) هي أداة مجانية مفيدة من Google تقدم نظرة عامة على المستوى الأعلى للفرص المحتملة لإصلاح المشكلات ، إلا أنها حقًا طريقة كسولة لمراجعة سرعة الموقع إذا تم استخدامها بشكل منفصل. لقد رأينا العديد من مُحسنات محركات البحث يأخذون التوصيات ، وأحيانًا كلمة بكلمة ، ويقدمونها مرة أخرى إلى مطوري العملاء أو الفريق التقني دون فهم سببها أو أي سياق وراءها.

لسوء الحظ ، يمكن أن يؤدي هذا غالبًا إلى طرح المزيد من الأسئلة عليك ، خاصةً إذا لم تكن تتعمق أكثر في الفرص والتوصيات التي ستطرحها الأداة.

على سبيل المثال ، سمعنا جميعًا عن التوصية بـ "إزالة موارد حظر العرض" لتسريع تحميل عنصر LCP ، ولكن ما يحدث عندما يكون هذا المورد مهمًا في الرسم الأول ، مثل البرنامج النصي لملف تعريف الارتباط أو الأصول المتضررة هي موارد طرف ثالث؟ من المحتمل أن يقوم المطورون بإلغاء هذا الأمر مباشرة ، حيث لن يكون هناك الكثير مما يمكنهم فعله - لذلك من المهم حقًا أن يتم أخذ أي توصيات فنية مأخوذة من PSI بضغطة زر والتحقيق فيها بشكل أكبر قبل إعادة الإرسال مرة أخرى إلى المطورين.

من المفيد أيضًا معرفة أن PSI تستخدم جهازًا مقلدًا (Moto G4) مع Lighthouse ، ولكن يمكن أن تختلف المشكلات بشكل كبير اعتمادًا على الجهاز الذي يستخدمه المستخدمون الحقيقيون بشكل متكرر ، كما هو الحال مع اختبار "المعمل". قد يعني ذلك غالبًا أن PSI لن تعرض مشكلات أو فرصًا للاختبار على هذا الجهاز المحدد ، على الرغم من أنك تعلم أن هناك مشكلة للمستخدمين الحقيقيين للموقع من تقرير Chrome UX.

لذلك نوصي دائمًا باستخدام PSI جنبًا إلى جنب مع أدوات اختبار السرعة الأخرى حيث يمكن ضبط تكوين الجهاز والاتصال وفقًا لذلك.

3. اكتشف أدوات تدقيق السرعة البديلة

إلى جانب استخدام PageSpeed ​​وأدوات Google الأخرى ، نوصي أيضًا باستكشاف أدوات اختبار السرعة المجانية والمجانية الأخرى ، مثل WebPageTest (WPT) أو GTMetrix.

يحتوي WebPageTest على مجموعة من الميزات المفيدة وخيارات التكوين التي تساعد في اختبار السرعة على مستوى الصفحة. يتيح لك التكوين المتقدم ضبط إعدادات الاختبار المهمة ، مثل المتصفح ونوع الجهاز ، بالإضافة إلى موقع الاختبار. يتيح لك هذا ضبط التدقيق الخاص بك ، خاصةً إذا كنت تعرف مكان وجود غالبية مستخدمي الموقع ، بالإضافة إلى نوع أجهزتهم ، مما يعني أنك لا تعتمد فقط على جهاز محاكاة Google المُعد مسبقًا.

هنا ، يمكنك أيضًا ضبط إعدادات الاتصال من اتصال 3G Fast الافتراضي ، وكذلك حظر عناوين URL معينة إذا كنت ترغب في اختبار زيادات الأداء للبرامج النصية المزعجة. هناك الكثير من خيارات التكوين الأخرى التي لم نقم بإدراجها لاستكشافها ، ولكن ما سبق هو تلك التي وجدناها مفيدة للغاية عند تدقيق أساسيات الويب الحيوية.

بمجرد تشغيل الاختبار ، انتقل إلى علامة التبويب "أساسيات الويب الأساسية" للحصول على تحليل تفصيلي للأداء لكل مقياس بما في ذلك أشرطة الأفلام ، والجداول الزمنية للفيديو ، والمخططات الانحدارية ، بالإضافة إلى تقسيم دقيق للعنصر الذي أدى إلى بدء الحدث - وكلها قابلة للتصدير في مجموعة من التنسيقات ، والأفضل من ذلك كله ، أنها مجانية!

يُعد عرض شريط الأفلام مفيدًا بشكل خاص في فهم النقطة التي تظهر عند تحميل الصفحة بشكل مرئي ، مما يساعد في تحديد أولويات الأصول التي يمكن تحميلها بشكل أسرع. سيتم عرضه بوضوح شديد إذا كانت هناك تحولات بصرية كبيرة للمساعدة في تحديد العناصر التي تسببها.

تتمتع GTMetrix بميزات مشابهة لـ WebPageTest ، ومع ذلك ، فإن الكثير من الخيارات المتقدمة المجانية في WPT متاحة فقط في الحزم المدفوعة.

4. تعرف على مخططات الشلال

بعبارات أساسية ، يعد المخطط الانحداري مخططًا زمنيًا لوقت طلب الملفات أو الأصول ، والمدة التي استغرقتها للتنزيل ومتى تكون مرئية على الصفحة.

قد يبدو النظر إلى مخطط الشلال أمرًا شاقًا بعض الشيء منذ البداية ، حيث يوجد الكثير من الصفوف المختلفة وأطوال الأشرطة والألوان التي تعني أشياء مختلفة - ولكن لا يتم تأجيلها! يعد قضاء الوقت في التعرف على المخططات الانحدارية وفهمها من أهم المهارات التي يجب أن يتمتع بها مُحسنات محركات البحث الفنية للتدقيق السريع.

إذا كنت معتادًا على استخدام WebPageTest لتدقيق مؤشرات الويب الحيوية ، فسنجد أن مخططاتها الانحدارية أكثر سهولة في الاستخدام. يوفر WebPageTest مفتاحًا مرمزًا بالألوان أعلى الرسم البياني يشير إلى معلومات الاتصال وأنواع الموارد المطلوبة وأحداث أخرى مثل تنفيذ JS. كما تعرض أيضًا موارد حظر العرض بشكل مرئي ، بالإضافة إلى تمييز الموارد المطلوبة التي لها استجابة 3xx أو 4xx.

نصيحة مفيدة: انتبه إلى الظل الفاتح والظلام للأشرطة الأفقية على الشلال ، يشير الظل الفاتح إلى أن المورد قد طلب من قبل المتصفح ، بينما يشير الظل الداكن إلى أنه يتم تنزيل المورد .

بشكل عام ، يساعد هذا في اكتساب فهم أعمق لمشاكل الأداء على الموقع ، وبالتالي يجعل توصياتك لإصلاحها أكثر قابلية للتنفيذ. نوصي بمقالة Matt Hobbs التفصيلية حول كيفية قراءة مخطط الشلال لمعرفة المزيد.

إذا كنت تبحث عن مشورة الخبراء بشأن حل مشكلات الأداء على موقع الويب الخاص بك ، فيرجى الاتصال بنا أو زيارة صفحة خدمات تحسين محركات البحث الفنية للحصول على مزيد من المعلومات حول كيفية مساعدة Semetrical.