فاحص Open Graph

التالي

الصق شيفرة HTML لصفحتك (يكفي جزء <head> وحده) وسيحلّل هذا الفاحص كل وسم meta من نوع og: وtwitter: يعثر عليه، ثم يخبرك أيّ الوسوم الستة الأساسية موجود، وأيها مفقود، والقيمة الدقيقة لكل واحد منها. ولأنه يقرأ الشيفرة التي تلصقها بدل جلب رابط مباشر، فإنه يعمل أيضا على خوادم التجهيز و localhost والصفحات المحمية بتسجيل الدخول، حيث لا يصل أي زاحف على الإنترنت.

كيف يقرأ الفاحص وسومك

  1. 1

    افتح مصدر الصفحة

    اضغط Ctrl+U (أو Cmd+Option+U على macOS) لرؤية شيفرة HTML الخام التي تستقبلها زواحف الشبكات الاجتماعية فعليا.

  2. 2

    انسخ قسم الرأس

    حدّد من `<head>` إلى `</head>`. لا حاجة إلى `<body>`، مع أن لصق الصفحة كاملة لا يضر.

  3. 3

    الصقه في الفاحص

    يُحلَّل كل وسم `<meta>` أثناء الكتابة. لا يُجلب أي رابط: يُفحص فقط ما تلصقه من شيفرة.

  4. 4

    اقرأ قائمة التحقق

    تتحول ستة فحوص إلى أخضر أو أحمر: og:title و og:description و og:type و og:url و og:image و twitter:card.

  5. 5

    راجع القيم المكتشفة

    يُدرَج كل وسم og: و twitter: مع محتواه، لتبرز الأخطاء المطبعية والقيم الفارغة ومسارات الصور النسبية.

وسوم Open Graph التي يبحث عنها الفاحص

الوسم الغرض ضمن قائمة التحقق؟
og:title عنوان البطاقة نعم، مطلوب
og:description عنوان فرعي للبطاقة نعم، مطلوب
og:type website أو article أو video إلخ نعم، مطلوب
og:url الرابط المعياري نعم، مطلوب
og:image رابط صورة المعاينة نعم، مطلوب
og:site_name سطر العلامة التجارية فوق العنوان يُدرَج عند وجوده
og:locale en_US أو es_ES إلخ يُدرَج عند وجوده

يُدرَج أيضا أي وسم og: آخر في شيفرتك، حتى وإن لم يكن ضمن قائمة التحقق.

وسوم Twitter Card

يرجع X (Twitter) إلى Open Graph عند غياب وسومه الخاصة، لذا لا يوجد ضمن قائمة التحقق سوى twitter:card. أما البقية فتُدرَج كلما عثر عليها الفاحص.

الوسم الغرض
twitter:card summary أو summary_large_image إلخ
twitter:site معرّف @ للحساب الناشر
twitter:creator معرّف @ للمؤلف
twitter:title يتجاوز og:title
twitter:description يتجاوز og:description
twitter:image يتجاوز og:image

مواصفة الصورة التي تعمل في كل مكان

يؤكّد الفاحص أن og:image معلَن، لكنه لا ينزّل الملف أبدا، لذا تحقق مما يلي يدويا:

  • الأبعاد: 1200 x 630 بكسل (Facebook و LinkedIn وبطاقات Twitter الكبيرة).
  • نسبة الأبعاد: 1.91:1 لـ summary_large_image.
  • حجم الملف: أقل من 5 ميغابايت، ويفضّل أقل من 1 ميغابايت كي لا تنقضي مهلة الزاحف.
  • الصيغة: JPG أو PNG. أما WebP و AVIF فلا يزال دعمهما غير متسق.
  • رابط مطلق: استخدم دائما العنوان الكامل https://...، لا مسارا نسبيا للبروتوكول أو نسبيا للجذر.

المشكلات الشائعة التي يكشفها التقرير

  • لا وجود لـ og:image. أكثر الأعطال شيوعا على الإطلاق. دون صورة تتدهور البطاقة إلى رابط أزرق بلا تنسيق.
  • وسم موجود لكنه فارغ. يعرض الفاحص كل قيمة، فيسهل التقاط og:title لا يحمل أي محتوى بعده.
  • مسار صورة نسبي. يجب أن يكون og:image رابطا مطلقا؛ مسار مثل /img/card.jpg يكسر الكشط.
  • عدم تطابق og:url. حين يختلف og:url عن الرابط المعياري الحقيقي، قد ترفض المنصات كشط الصفحة.
  • وسوم يحقنها JavaScript. لا تظهر أبدا في view-source، لذا لا تظهر هنا أيضا، ولن يراها معظم الزواحف.
  • بطاقة قديمة على Facebook. ليست مشكلة في الشيفرة: يخزّن Facebook عمليات الكشط مؤقتا. افرض التحديث من Sharing Debugger الخاص به.

الأسئلة الشائعة

لأن لصق الشيفرة يُظهر بالضبط ما يراه الزاحف الاجتماعي في الاستجابة الخام، ويعمل على صفحات لا يصل إليها أي زاحف: خوادم التجهيز و localhost والشبكات الداخلية وكل ما هو محمي بتسجيل الدخول. افتح صفحتك، واضغط Ctrl+U، وانسخ المصدر، والصقه هنا.

ليس حتما. يرجع X إلى وسوم Open Graph عند غياب وسوم twitter، ولهذا لا يوجد ضمن قائمة التحقق سوى twitter:card. أضف البقية فقط عندما تريد عنوانا أو وصفا أو صورة على X تختلف عما على سائر المنصات.

يعرض المفتّش الـ DOM بعد تشغيل JavaScript، بينما تقرأ الزواحف الاجتماعية استجابة HTML الخام. استخدم view-source (عبر Ctrl+U) لا المفتّش، والصق ذلك. وإن كان الوسم موجودا في الـ DOM فقط، فأضف ترسيما في الخادم أو خدمة عرض مسبق كي تراه الزواحف.

1200 x 630 بكسل بصيغة JPG أو PNG. إنه الحجم الموصى به لبطاقات Facebook و LinkedIn الكبيرة، ومقبول لدى X، ويتمدد بنظافة في Slack و Discord وسائر تطبيقات كشف الروابط. يؤكّد الفاحص أن og:image معلَن، لكنه لا يفتح الملف، فتحقق من الأبعاد بنفسك.

يخزّن Facebook نتائج الكشط مؤقتا حتى 30 يوما. الصق الرابط في Sharing Debugger على developers.facebook.com/tools/debug وأعد كشطه لإبطال الكاش.

أدوات ذات صلة

الأداة متاحة بلغات أخرى