الأخبار التكنولوجية والاستعراضات والنصائح!

دليل تحسين محركات البحث إلى Angular: كل ما تحتاج إلى معرفته

ستساعدك المقالة التالية: دليل تحسين محركات البحث إلى Angular: كل ما تحتاج إلى معرفته

أهلاً. كبار المسئولين الاقتصاديين التقنية هنا. لقد بدأت العمل مع Angular في عام 2015 من خلال إعادة تصميم موقع التجارة الإلكترونية. لقد كسرت الكثير ولكن أصلحت أكثر.

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

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

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

هيا لنبدأ مع الأساسيات

المواقع مصنوعة من التعليمات البرمجية. الكود مكتوب باللغات. ثلاث لغات تشكل غالبية المواقع.

يقوم HTML بإنشاء المحتوى. يقوم CSS بإنشاء التخطيط والتصميم والمؤثرات المرئية.

يمكن لهاتين اللغتين صياغة صفحات مسطحة جذابة من الناحية الجمالية، وعملية – ولكنها مملة في الغالب.

أدخل JavaScript (JS)، وهو إصدار ويب من كود البرمجة.

باستخدام JavaScript، يمكن لمواقع الويب تخصيص تجارب المستخدم التفاعلية. يذهب الناس إلى مواقع جذابة. JS تصنع مواقع جذابة.

Angular هو تطور لجافا سكريبت

Angular هي وسيلة لتوسيع نطاق JS لبناء المواقع. باستخدام Angular، يتم إرسال عشرات الأسطر من HTML المسطحة من الخادم الخاص بك وتنفيذ تجارب مستخدم تفاعلية مخصصة.

تم إنشاء ما يقرب من مليون موقع باستخدامه. معدلات التبني تنمو بسرعة.

إذا لم تكن قد عملت على Angular أو أي إطار عمل JavaScript آخر، فمن المحتمل أن تفعل ذلك قريباً.

لكي يتمكن محرك البحث من فهم مواقع Angular، يجب عليه عرض JavaScript

لكي تتمكن محركات البحث من تجربة المحتوى Angular، فإنها تحتاج إلى تنفيذ JavaScript. لا تستطيع العديد من محركات البحث عرض JavaScript.

لا تُصب بالذعر.

إذا كان سوقك يهيمن عليه بشكل أساسي Baidu أو Yandex أو Naver أو أي محرك بحث آخر لا يقوم بالعرض، فانتقل إلى قسم العرض.

جوجل بوت <3s جافا سكريبت

لا حقا. إنهم يحبونها لأن البشر يحبون التجارب التفاعلية الغنية!

… ولأن 95% من المواقع استخدامه.

تعد فهرسة المحتوى الذي تم إنشاؤه بواسطة JS عملاً جيدًا عندما يعتمد نموذجك على كونه الفهرس الأكثر ثقة لمحتوى الويب.

هذا لا يعني أنها كانت علاقة مثالية تاريخياً. لقد تأثر محترفو تحسين محركات البحث (SEO) بقدرات Googlebot والتزامه بالزحف إلى JS.

أدى عدم الوضوح إلى تحذيرات من أن Angular يمكن أن تقضي على مُحسنات محركات البحث الخاصة بك.

في الإدخال/الإخراج 2018، تحدث فريق مشرفي المواقع بصراحة عن المشكلات التي واجهها Google عند فهرسة Angular ومحتوى JS الآخر. كان بعض محترفي تحسين محركات البحث غاضبين، وكان البعض الآخر غاضبًا، وكان البعض الآخر… متحمسًا بشكل غير معقول؟

أنا أقف بجانب هذا الإثارة. تم تمثيل البحث. (في العام السابق، واجهت بعض الاستجابات المربكة لوجود أشخاص متخصصين في تحسين محركات البحث (SEO) في مؤتمر للمطورين. اتجه نحو قلب تحسين محركات البحث الفني.)

كان المطورون.

ثم اعتلى جون مولر وتوم غريناواي المسرح لمعالجة مفهوم خاطئ كبير في مجتمع البحث: كيف يعمل البحث.

الزحف والفهرس والرتبة – سهل كواحد، ثلاثة، أربعة!

حتى مؤتمر مطوري Google لعام 2018، عمل متخصصو تحسين محركات البحث (SEO) وفقًا للفرضية الأساسية المتمثلة في أن عملية Googlebot تعمل في ثلاث خطوات: الزحف والفهرس والتصنيف.

حتى أبريل 2019، عكست موارد جوجل الخاصة عملية بسيطة من ثلاث خطوات.

تكمن في هذه العملية المبسطة مجموعة متنوعة من الافتراضات الخفية:

  • يعرض Googlebot JS أثناء الزحف.
  • تعتمد الفهرسة على المحتوى المقدم.
  • تحدث هذه الإجراءات في وقت واحد في تسلسل واحد.
  • Googlebot هو برنامج سحري ويقوم بكل الأشياء على الفور!

ها هي المشكلة. لقد أغفلنا التقديم.

العرض هو العملية التي يتم فيها جلب وتنفيذ البرامج النصية التي تم استدعاؤها في تحليل HTML الأولي.

نحن نسمي مخرجات تحليل HTML الأولي وجافا سكريبت DOM (نموذج كائن المستند).

إذا كان الموقع يستخدم JavaScript، فسيكون HTML مختلفًا عن DOM.

HTML الأولي (قبل تنفيذ JavaScript)

DOM (بعد تنفيذ JavaScript)

يمكن أن تكون طريقتا العرض لصفحة واحدة مختلفتين تمامًا. كان HTML الأولي مكونًا من 16 سطرًا فقط. بعد تنفيذ JavaScript، يصبح DOM مليئًا بالمحتوى الغني.

يمكنك مشاهدة تحليل HTML الأولي من خلال عرض مصدر الصفحة. لرؤية DOM، افتح أدوات المطور في متصفحك وانقر فوق فحص. وبدلاً من ذلك، استخدم اختصار لوحة المفاتيح Cmd+shift+I.

موجتان من الفهرسة

نظرًا لافتراضات العملية المكونة من ثلاث خطوات وتأثيرها على الأداء العضوي، أوضح فريق مشرفي المواقع في Google أن هناك مرحلتين للفهرسة.

تقوم الموجة الأولى بفهرسة الصفحة بناءً على HTML الأولي فقط (المعروف أيضًا باسم عرض مصدر الصفحة).

الفهارس الثانية تعتمد على DOM.

يريد Googlebot أن يحب جافا سكريبت ولكنه يحتاج في بعض الأحيان إلى مساعدتك في فهمها

جافا سكريبت هو أغلى الموارد على موقعك.

يمكن أن يستغرق 1 ميجابايت من النص 5 ثوانٍ عند اتصال 3G. يمكن أن تبلغ تكلفة تحميل صفحة بحجم 1.5 ميغابايت 0.19 دولارًا أمريكيًا. (لا، ​​حقًا. اختبر صفحاتك على ما هي تكلفة موقعي؟)

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

وهذا يعني أن المحتوى الذي تم إنشاؤه بواسطة JavaScript لا يكتشفه Googlebot إلا بعد توفر الموارد.

الديون التقنية لـ Googlebot جعلت تحسين محركات البحث أمرًا صعبًا

جزء من الحياة الرقمية هو العمل مع ما لديك. غالبًا ما نتخذ حلولاً سهلة يمكننا العمل عليها الآن بدلاً من النهج الأفضل الذي قد يستغرق وقتًا أطول.

ذروة هذه الاختصارات هي ديون التكنولوجيا. في كثير من الأحيان، يجب تنظيف ديون التكنولوجيا قبل تنفيذ تغييرات كبيرة.

كانت خدمة عرض الويب (WRS) إحدى أكبر العوائق أمام فهم Google للكثير من محتوى الويب الغني. كان أحد المكونات الأساسية لزاحف الويب هو استخدام إصدار Chrome الذي تم إصداره في عام 2015. (إذا كنت تعتقد أنه ليس كذلك، فابحث عن هاتفك القديم – الهاتف الذي قمت بالترقية منه قبل ستة أشهر – واستخدمه للساعة التالية. )

بالنسبة لمحترفي ومطوري تحسين محركات البحث (SEO)، كان هذا يعني دفع قواعد التعليمات البرمجية المليئة بالحشو المتعدد إلى التعديل التحديثي ES6 وظائف لES5. إذا لم تكن على دراية بهذه الأمور، فتهانينا! لقد اخترت العصر الذهبي لبدء تحسين مواقع Angular!

محرك العرض الجديد لـ Googlebot

اعتلى مارتن سبليت، محامي مطور Search Console، المسرح بتقديم المهندس زوي كليفورد في وقت سابق من هذا الشهر في Google I/O للإعلان عن ذلك Googlebot دائم الخضرة.

يستخدم زاحف الويب V8 كمحرك العرض وWebAssembly. اعتبارًا من مايو 2019، يعمل بنظام Chrome 74 وسيستمر التحديث لمدة أسبوع أو نحو ذلك من إصدار الإصدارات الجديدة.

يمكن الآن للترقية الهائلة لبرنامج زاحف الويب المحبوب لدينا تقديم أكثر من 1000 ميزة جديدة. يمكنك اختبار توافق الميزات الخاصة بك مع هل بإمكاني استخدم.

توقع حدوث تأخير في فهرسة المحتوى المعروض

وقد ألمح موظفو Google إلى أن مستقبل Googlebot سيجمع بين الزحف والعرض. نحن لم نصل إلى هناك بعد. لا يزال الزحف والعرض عمليتين منفصلتين.

لا يزال هناك تأخير…ولكن هناك أكثر من 1000 ميزة جديدة مدعومة الآن!

— مارتن سبليت @ 🇨🇭🏡 (@g33konaut) 7 مايو 2019

الآن بعد أن أصبح بإمكان Googlebot التعامل مع Angular بشكل أفضل، فلنتحدث عن كيفية التغلب عليها.

تحسين الزحف لـ Angular

تعرف على الإصدار الخاص بك

سيكون لإصدار Angular الذي تعمل عليه تأثير كبير في قدرتك على التحسين – أو على الأقل تحديد التوقعات.

يشار إلى الإصدار 1 باسم AngularJS.

بالنسبة للإصدار 2، تمت إعادة كتابة إطار العمل بالكامل. ولهذا السبب تتم الإشارة إلى كل شيء بعد الإصدار 1 بالمصطلح الشامل Angular (أي تم قطع JS).

الإصدار مهم (نظرًا لأن برامج Angular غير متوافقة مع الإصدارات السابقة)، لذا اسأل الفريق الذي تعمل معه عن الإصدار الذي يتم استخدامه.

أعط كل أصل عنوان URL فريدًا

يتم استخدام Angular بشكل متكرر كجزء من تطبيق صفحة واحدة (SPA).

تسمح تطبيقات الصفحة الواحدة بتحديث المحتوى الموجود على الصفحة دون تقديم طلب صفحة مرة أخرى إلى الخادم.

تتم تعبئة طلبات المحتوى الجديد باستخدام استدعاءات JavaScript وXML (AJAX) غير المتزامنة. قد يعني عدم تحميل صفحة جديدة أن عنوان URL المرئي في المتصفح لا يمثل المحتوى المعروض على الشاشة.

هذه مشكلة تحسين محركات البحث (SEO) لأن محركات البحث تريد فهرسة المحتوى الموجود على عنوان معروف. إذا كان المحتوى الخاص بك موجودًا فقط على URI، فإنه لا يميل أيضًا إلى التصنيف.

قطعة صغيرة من التعليمات البرمجية المعروفة باسم حالة الدفع () يقوم بتحديث عنوان URL عند طلب محتوى جديد.

تقدم Google مختبرًا للبرمجة لـ تحسين تطبيقات الصفحة الواحدة (SPA) في البحث.

تتبع التحليلات لتطبيقات الصفحة الواحدة باستخدام مشاهدات الصفحة الافتراضية

إذا قام موقع الويب الخاص بك بتحميل محتوى الصفحة ديناميكيًا وقام بتحديث عنوان URL للمستند، فستحتاج إلى إرسال مشاهدات إضافية للصفحة لتتبع “مرات مشاهدة الصفحة الافتراضية” هذه.

عندما يقوم تطبيقك بتحميل المحتوى ديناميكيًا ويقوم بتحديث عنوان URL في شريط العناوين، يجب أيضًا تحديث البيانات المخزنة على جهاز التتبع الخاص بك.

يمتلك طاقم Google Analytics وثائق شاملة حول مشاهدات الصفحات الافتراضية للمنتجعات الصحية، والذي يتضمن إضافة علامة يدوية لإرسال المعلومات إلى خادم التتبع الخاص بك، عند تحميل محتوى جديد.

اكتشف المحتوى الخاص بك في فهرسة الموجة الأولى من خلال عرض عناصر البطل الخاصة بك على جانب الخادم

تبحث محركات البحث عن مطابقة الصفحات لغرض معين.

إذا كان استعلامي يهدف إلى إجراء معاملات، فإن عناصر مثل اسم المنتج والسعر والتوفر تكون ضرورية للإجابة على نيتي.

يُعرف هذا المحتوى بعناصر البطل الخاصة بك.

ومن خلال عرض هذه العناصر على جانب الخادم، يمكنك إخبار Google بالهدف الذي تتطابق معه صفحتك في الموجة الأولى من الفهرسة – دون انتظار عرض JavaScript.

بالإضافة إلى العناصر البطلة، استخدم SSR من أجل:

  • البيانات المنظمة (يقوم Sam Vloeberghs بإنشاء ملف برنامج تعليمي مفيد)
  • عنوان الصفحة
  • ميتا الوصف
  • علامة HTML، بما في ذلك:
  • شروح التاريخ

لا تناقض نفسك بين HTML وDOM

تعلمنا أساسيات تحسين محركات البحث (SEO) البساطة.

تحصل الصفحات على عنوان واحد. وصف ميتا واحد. مجموعة واحدة من توجيهات الروبوتات.

باستخدام Angular، يمكنك إرسال بيانات تعريف وتوجيهات مختلفة بتنسيق HTML مقارنةً بـ DOM.

يعمل أصدقاؤنا الآليون على التعليمات البرمجية للقيام بالأشياء بترتيب محدد. إذا قمت بوضع توجيه noindex في HTML، فلن يقوم Googlebot بتنفيذ البرنامج النصي للعثور على ملف فِهرِس علامة في DOM لأنك طلبت منه عدم عرض DOM.

لا تقم بتقسيم ترميز البيانات المنظمة بين HTML وDOM

باستخدام Angular، يمكنك عرض ترميز Schema.org إما بتنسيق HTML (المفضل) أو DOM.

سيعمل أي منهما ولكن من المهم جدًا أن يكون الترميز الكامل في مكان واحد – إما HTML أو DOM.

إذا قمت بتقسيم الاثنين عن طريق عرض جزء من العلامات في HTML ونشر السمات DOM، فسيتم رؤية المكونات المنفصلة كمجموعات مختلفة من العلامات.

ولن يكتمل أي منهما. ترميز البيانات المنظمة صالح أم لا. لا يوجد “جزئي”. أقصى جهد.

يمكن أن تؤدي الموارد البطيئة أو المحظورة إلى جعل المحتوى غير قابل للاكتشاف

لن يتم أخذ الموارد البطيئة أو المحظورة في الاعتبار عند تحديد كيفية اكتشاف المحتوى الخاص بك. سوف تظهر الموارد البطيئة كـ .

يجب إكمال طلب البرنامج النصي خلال 4 ثوانٍ تقريبًا. سيتم الإشارة إلى الموارد المحظورة على هذا النحو في مخرجات الأداة.

دعم التحميل المرقّم للتمرير اللانهائي

يمكن أن يكون ترقيم الصفحات على الهاتف المحمول محبطًا.

ليس عليك الاختيار بين سهولة الاستخدام وزحف Googlebot. بدلاً من ذلك، استخدم نقاط فحص History API – عناوين URL التي تسمح للمستخدم (أو الروبوت) بالعودة إلى نفس المكان.

وفقا لجوجل:

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

لدعم التحميل المرقّم، قم بتوفير رابط فريد لكل قسم يمكن للمستخدمين مشاركته وتحميله مباشرة. نوصي باستخدام History API لتحديث عنوان URL عندما يتم تحميل المحتوى ديناميكيًا.

اعرف المزيد مع Google الجديد جارٍ التحميل ببطء وثائق المطور.

لا تنتظر الأذونات أو الأحداث أو التفاعلات لعرض المحتوى

مراقب التفاعل> أحداث التمرير

هل تستخدم أحداث التمرير للتحميل البطيء؟

لن يتمكن Googlebot من رؤيته. بدلاً من ذلك، استخدم Googlebot المتوافق مع Googlebot مراقب التقاطع لمعرفة متى يكون أحد المكونات في إطار العرض.

استخدم CSS Toggle Visibility للنقر للتحميل

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

قم بتحميل المحتوى بتنسيق HTML أو DOM واعرضه باستخدام وظائف CSS.

لن تحصل أبدًا على هذا الإذن

إذا طلب موقعك الحصول على أذونات، فسيرفض Googlebot ذلك. يتضمن ذلك تحديد الموقع الجغرافي والإشعارات والدفع والعديد من العناصر الأخرى المدرجة في القائمة تسجيل إذن W3C.

تحتوي الروابط القابلة للزحف على علامات ربط مع سمات Href

يعتمد مفهوم برامج زحف الويب على اكتشاف المحتوى عن طريق اتباع الروابط. يحتاج المحتوى Angular الخاص بك إلى روابط مع ل زار الصفات التي يجب اكتشافها.

سيتم الزحف إليه
لم يتم الزحف إليها
لم يتم الزحف إليها
لم يتم الزحف إليها

لا تقوم Google باختيار الصور المضمنة في أنماط CSS.

تتضمن خيارات تضمين الصور المتقدمة استخدام <الصورة> و com.srcset للصور المستجيبة.

جوجل توصية يكون:

…أن تقوم دائمًا بتوفير عنصر img كعنصر احتياطي مع سمة src عند استخدام علامة الصورة باستخدام التنسيق التالي:
<صورة>
<نوع المصدر = "image/svg+xml" srcset = "https://www.searchenginejournal.com/pyramid.svg">
<نوع المصدر = "image/webp" srcset = "https://www.searchenginejournal.com/pyramid.webp">

استخدم الأنماط المضمنة للأعلى Fold محتوى

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

قم بتحسين مسار العرض المهم عن طريق تضمين CSS المهم في، مما يسمح بعرض المحتوى الموجود في الجزء العلوي في المتصفح دون انتظار تحميل بقية CSS.

تعرف على المزيد حول كيفية تقليل حظر عرض CSS على أساسيات الويب.

تقديم الأمثل

إن حب Googlebot لا يتعلق بما إذا كان الموقع يستخدم جافا سكريبت أم لا. يتعلق الأمر بكيفية عرض JavaScript.

خيارات وتقنيات العرض وفيرة بقدر ما هي مربكة.

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

العرض من جانب العميل (CSR)

تقوم CSR ببناء الصفحة في متصفح المستخدم. HTML الأولي عبارة عن غلاف فقر الدم. لا يمكن للمستخدم المشاهدة والتفاعل إلا بعد جلب حزمة JavaScript الرئيسية وعرضها.

تصنيف قابلية الاكتشاف: 👾

تقييم الأداء: ⭐️

العرض من جانب الخادم (SSR)

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

تصنيف قابلية الاكتشاف: 👾👾👾

تقييم الأداء: ⭐️⭐️

الإنجاز الملحوظ: 🌏 مثالي لمحركات البحث التي لا تعرض العرض

العرض الديناميكي

حل مؤقت لإخفاء الهوية (ولكن ليس إخفاء الهوية) مربك للغاية لبرامج زحف محركات البحث. تتطلب هذه التقنية توفر عروض CSR وSSR وتحديد أي منها سيتم عرضه بناءً على وكيل المستخدم.

تقنيات مثل أداة العرض المسبق مفتوحة المصدر رندرترون لا يزال من الممكن أن يكون مفيدًا جدًا لعملك.

تصنيف قابلية الزحف: 👾👾👾

تقييم الأداء: ⭐️

تصنيف الاستدامة: ⚰️

إذا لم تقم بالفعل بتنفيذ العرض الديناميكي، فمن المحتمل أن يكون هذا الخيار قد تجاوز تاريخه الأفضل.

العرض المسبق

تصنيف قابلية الزحف: 👾👾👾👾

تقييم الأداء: ⭐️⭐️⭐️

ينشئ HTML في وقت الإنشاء ويخزنه للعرض عند الطلب. تحسين FCP وعدم وجود حمل SSR.

يعمل فقط مع المحتوى الثابت – وليس مع المحتوى الذي يهدف إلى التغيير (فكر في التخصيص واختبار A/B).

تذكروا أيها الأطفال، خدمة العرض المسبق المدفوعة الخاصة بكم هي ملككم.

كف الوجه اليوم: إذا كنت تستخدم React، فلا تستخدم طرفًا ثالثًا للعرض من جانب الخادم. إذا تعطلت أو تعطلت بطاقتك الائتمانية (على سبيل المثال أدناه)، فسيتم إدراج موقعك في SERPs.

المضيف الذاتي https://t.co/7xAiWkW7XW لصداع أقل. pic.twitter.com/jkN3eMAvs0

– ˗ˏˋ جيسي هانلي ˎˊ˗ (@ جيسيثانلي) 21 أغسطس 2018

العرض المختلط (العرض من جانب الخادم مع الترطيب)

نحن نريد سرعة SSR، ولكننا نريد تفاعل المسؤولية الاجتماعية للشركات. الحل: SSR + الترطيب.

يبدو أن تقديم الترطيب التدريجي هو طريق المستقبل. يسمح بتقسيم التعليمات البرمجية على مستوى المكون.

يمكن للمواقع تأجيل عرض المكونات حتى تصبح مرئية للمستخدم أو تتطلب التفاعل. يحتوي Angular Universal على محلول ترطيب مدمج: ngExpressEngine.

تصنيف قابلية الزحف: 👾👾👾👾

تقييم الأداء: ⭐️⭐️⭐️⭐️

تحسين تغطية الفهرس

الاختبار باستخدام أدوات الطرف الأول

كابوس تحسين محركات البحث الفني هو الحصول على إصدار تعليمات برمجية لحثك وتحقيقه. من المفترض أن تؤدي ترقيات Googlebot إلى تخفيف مشكلة polyfill وغيرها من المشكلات المرهقة.

أفضل طريقة لمعرفة ذلك هي استخدام أدوات Google للاختبار. يوفر Search Console URL Inspector عرضًا كاملاً مع تمرير لقطة الشاشة.

يُرجع اختبار التوافق مع الأجهزة المحمولة والنتائج الغنية أيضًا DOM ولكن لن يتم تمرير لقطة الشاشة. يمكنك حتى اختبار جدار الحماية والبنيات المستضافة محليًا.

قريبًا: تحديثات وكيل مستخدم Googlebot

سيظل وكيل مستخدم Googlebot كما هو – في الوقت الحالي.

يمكننا أن نتوقع انتقال أدوات Search Console إلى عرض الإصدار الثامن.

يمكننا أن نتوقع رؤية تغير وكلاء مستخدم Googlebot بمجرد اكتمال الترحيل.

سيمنحنا هذا رؤية أفضل حول إصدار Chrome Googlebot الذي يستخدمه.

مخطوطات ذاكرة التخزين المؤقت بكفاءة

يتم احتساب المكالمات إلى البرامج النصية ضمن ميزانية الزحف الخاصة بك.

إذا كنت تستخدم نفس النصوص البرمجية في صفحات متعددة، فإن إعدادات انتهاء صلاحية ذاكرة التخزين المؤقت تتيح لـ Googlebot طلب النص البرمجي مرة واحدة واستخدامه في الصفحات ذات الصلة. بمجرد انتهاء صلاحية ذاكرة التخزين المؤقت، سيطلب Google البرنامج النصي مرة أخرى.

احصل على أقصى استفادة من البرامج النصية الخاصة بك باستخدام الإصدار. باستخدام الإصدار، يمكنك تعيين تاريخ انتهاء صلاحية طويل للبرنامج النصي الخاص بك. مرحبًا Google، يمكنك استخدام /myscript.js?v=1 للعام القادم!

عندما يتضمن إصدار التعليمات البرمجية تغييرًا في حزمة البرامج النصية تلك، سيقوم موقع الويب الخاص بي بتحديث حزمة JavaScript التي تشير إليها. مرحبًا Google، استخدم /myscript.js?v=2 لعرض هذه الصفحة!

يمكن أن يؤدي إصدار الحزمة إلى التخفيف من مشكلات العرض بعد الإصدار

إذا حاول زاحف الويب عرض صفحتك ولكنه يستخدم برنامجًا نصيًا قديمًا، فقد يتم عرض الصفحة بشكل غير صحيح.

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

إذا كانت المكالمات غير المتزامنة تحتوي على Uris فريد، فاستخدم توجيهات X-Robots Noindex

لدي صفحة ويب تقوم بتحميل 3 أجزاء من المحتوى بشكل غير متزامن. تحتوي كل استدعاءات AJAX هذه على عنوان URI فريد:

https://example.com/ajax/meet-my-cat-cta

https://example.com/ajax/random-cat-picture-generator

https://example.com/ajax/featured-bean-toes

في كل مرة يطلب Googlebot صفحتي على الويب، فإنه يحصل على 4 عناوين URL. إنها ليست فعالة جدًا في استخدام الموارد.

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

يمكن أن تكون النتائج فعالة للغاية. من الواضح أن https://example.com/ajax/random-cat-picture-generator?cat=tank&&pose=bellyrubs جزء من تجربة شخصية رائعة لك، للمستخدم.

كل مجموعة معلمات هي عنوان URL فريد. يتعامل Googlebot مع عناوين URL الفريدة باعتبارها صفحات فريدة (ما لم يُقال خلاف ذلك).

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

مكالمات أجاكس ومؤشر التضخم

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

ستبدو حالة الفهرس الخاص بك مثل السفينة الدوارة – ارتفاع صارخ في عدد الصفحات – يتبعه انخفاض مثير للقلق عندما يقوم Googlebot بإزالة الصفحات من فهرسه.

لتجنب ذلك، أضف توجيهات X-Robots noindex إلى معرفات URI التي تقوم بتحميل المحتوى بشكل غير متزامن إلى الصفحة. سيؤدي هذا إلى إنشاء إشارات فنية أكثر وضوحًا وجعل موارد Googlebot التي يتم إنفاقها على فهم موقعي أكثر فعالية.

اصنع حليفًا جديدًا للمطورين

يعد المطورون من أفضل الحلفاء الذين يمكن أن يتمتعوا بـ SEO. يدرك مشرفو المواقع في Google هذا الأمر وقاموا بإنشاء سلسلة ويب جديدة تركز على تغييرات التعليمات البرمجية اللازمة لإنشاء موقع قابل للاكتشاف.

هل تبحث عن مكان للبدء؟ الدفع اجعل تطبيقات الويب Angular قابلة للاكتشاف و مختبر كود تحسين محركات البحث (SEO) للمطورين.

دس آند رول يا أصدقائي

باختصار، مفاتيح تحسين محركات البحث لـ Angular هي:

  • معرفة الفرق بين HTML وDOM.
  • تسليم المحتوى في الوقت والمكان المناسبين.
  • عناوين URL متسقة وفريدة وقابلة للزحف.
  • كن على دراية بقابلية فهرسة موارد البرنامج النصي وحجمها ووقت الاستجابة وسياسات التخزين المؤقت.

هذا هو الجزء الذي نعمل فيه معًا لجعل موقع الجميع موجودًا على قيد الحياة وبصحة جيدة.

أفضل طريقة لتعلم Angular هي التدريب العملي، لذا إذا كنت تقرأ هذا، فابق هادئًا وتذكر المثل الرقمي القديم:

المزيد من الموارد: