وسوم Open Graph هي وسوم HTML وصفية (meta tags) تخبر منصات التواصل الاجتماعي وتطبيقات المراسلة بكيفية عرض المعاينة عند مشاركة رابط صفحة ما، إذ تحدد العنوان والوصف والصورة والنوع التي ينبغي أن تظهر، بدلاً من أي شيء قد تخمّنه المنصة بنفسها. وقد طوّرت Facebook بروتوكول Open Graph في الأصل، وتقرؤه اليوم تقريباً جميع منصات التواصل الاجتماعي وتطبيقات المراسلة الكبرى، ما يجعله الطريقة المعيارية التي يتحكم بها تاجر التجزئة في مظهر صفحات منتجاته عند مشاركتها أو تثبيتها أو الإحالة إليها من خارج موقعه. وفي التجارة الإلكترونية، يصنع ضبط وسوم Open Graph جيداً الفارق بين رابط منتج مُشارَك يعرض صورة جذابة وسعراً، وبين صورة مصغّرة عامة أو معطوبة.
لماذا تهم وسوم Open Graph الصفحات المعتمدة على خلاصة المنتجات
تتم مشاركة صفحات المنتجات باستمرار، سواء عبر التوصيات الشفهية من العملاء، أو روابط التسويق بالعمولة، أو منشورات المؤثرين، أو إعلانات التواصل الاجتماعي المدفوعة، وتُعرض كل مشاركة من هذه المشاركات استناداً إلى وسوم Open Graph لا إلى محتوى الصفحة الفعلي الذي سيراه الزائر عند النقر. وقد تعرض صفحة منتج لم تُضبط وسومها بشكل صحيح شعاراً مشوّهاً، أو وصفاً مقتطعاً أو غير ذي صلة، أو لا تعرض أي صورة على الإطلاق، مما يضعف نسبة النقر إلى الظهور (CTR) في مشاركة تمثل لولا ذلك توزيعاً مجانياً عالي النية الشرائية. ولأن صفحات المنتجات تُنشأ عادةً بكميات كبيرة من الكتالوج نفسه الذي يغذّي خلاصة المنتجات الخاصة بالتسوق، يمكن اشتقاق قيم Open Graph مباشرةً من البيانات الوصفية الحالية للمنتج عبر قوالب، بدلاً من كتابتها يدوياً لكل SKU، وهو ما يجعلها من أكثر المكاسب القابلة للتوسّع المتاحة للكتالوجات الكبيرة.
كيف تعمل وسوم Open Graph
توجد وسوم Open Graph داخل العنصر <head> في صفحة الويب على شكل عناصر <meta property="og:...">، حيث تغطي الوسوم og:title وog:description وog:image وog:url حقول المعاينة الأساسية التي تقرؤها معظم المنصات. وفي كتالوج المنتجات، تُطابق هذه القيم عادةً سمات الخلاصة التي تتم صيانتها أصلاً لـ Shopping وMeta Catalog؛ فالعنوان والوصف والصورة الرئيسية المستخدمة في الخلاصة نفسها يمكن أن تملأ وسوم Open Graph المقابلة، مما يحافظ على اتساق السطحين دون الحاجة إلى كتابة نصوص منفصلة. وتقوم المنصات ومحركات البحث بشكل متزايد بمقارنة هذا الترميز المنظّم مع رسم المعرفة البياني الأوسع للكيانات لفهم ما تمثله الصفحة، ما يعني أن اتساق بيانات Open Graph يعزز فهم الآلة للمنتج بما يتجاوز معاينة التواصل الاجتماعي الفورية. ولأن هذه الوسوم تتحكم في سلوك الرابط أينما جرت مشاركته، فهي أيضاً جزء هادئ لكنه مهم من توزيع المحتوى الفعّال، حيث قد يظهر المنتج نفسه عبر عدة مواقع شريكة أو مواقع تجميع.
مثال
<item>
<g:id>SKU-10234</g:id>
<g:title>Organic Cotton Crewneck Sweater - Charcoal, M</g:title>
<g:description>Soft, breathable organic cotton crewneck in charcoal.</g:description>
<g:image_link>https://example-shop.com/img/org-sweater-charcoal.jpg</g:image_link>
</item><!-- Open Graph tags on the corresponding product page, templated from the feed -->
<meta property="og:title" content="Organic Cotton Crewneck Sweater - Charcoal, M">
<meta property="og:description" content="Soft, breathable organic cotton crewneck in charcoal.">
<meta property="og:image" content="https://example-shop.com/img/org-sweater-charcoal.jpg">
<meta property="og:type" content="product">مفاهيم ذات صلة
لأن قيم Open Graph تعكس عن قرب البيانات الوصفية الحالية للمنتج، فمن الأفضل صيانتها عبر قالب لا كمهمة يدوية، وهي تسهم في مدى اتساق فهم هوية المنتج عبر رسم المعرفة البياني الأوسع للكيانات. كما أنها عامل تمكين هادئ لـتوزيع المحتوى، إذ تضمن أن يبدو المنتج ويُقرأ بالشكل نفسه أينما انتهى المطاف بمشاركة رابطه.
