هل تؤثر العلامات المفتوحة على محركات البحث؟

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

كم مرة تُعيد منصات استخراج علامات Open Graph؟

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

هل يمكن استخدام صورة مختلفة على تويتر مقارنةً بالمنصات الأخرى؟

نعم. قم بتعيين قيمة og:image لفيسبوك ولينكدإن وديسكورد وسلاك. ثم قم بتعيين قيمة twitter:image منفصلة لمنصة تويتر/إكس. يمكن أن تشير إلى ملفات مختلفة - وهذا مفيد إذا كنت ترغب في تقطيع مربع لمنصة تويتر وعرض عرض 1200×630 لجميع المحتويات الأخرى.

ما الذي يحدث إذا لم أضف أي علامات OG؟

تُستَخَدَمِ الْمُنْتَجَة لِتَسْتَخْدَمَةِ صَفْحَةِكَ وَتَجْلِبُ الْمُحَوَّلَةَ. فَيُمْكِنُ أَنْ تُسْتَخَدَمَةَ عَلَى تَعْلِيلِ الْمُتَوَسِّلِ مِنْ تَعْلِيلِكَ، وَتَجْلِبَ الْمُتَوَسِّلَ الْمُتَوَسِّلَ كَمُتَوَسِّلَةَ، وَتَخْتَرِي صَورةً عَلَى الْمُتَوَسِّلَ — عَلَى شَكلِ لَوْغو، أَوْ إعلان، أَوْ رُمَز. فَيَكُونُ النَّتِيجَةُ عَلَى شَكلِ خَطَأٍ وَلَا يُمْكِنُ أَنْ تَكُونَ مُتَوَسِّلَةً.

هل تعمل علامات Open Graph على تطبيقات الصفحة الواحدة (SPAs)؟

فقط إذا كانت علامات OG موجودة في HTML المُنشَّر على الخادم. لا تُنفذ JavaScript على المنصات عند استخراج المحتوى — تُقرأ الإجابة المُنشَّرة بالكامل. إذا كان تطبيقك يُنشِّر المحتوى فقط من جانب العميل، فلن تُرى علامات OG في هذا المحتوى. استخدم توليد المحتوى على الخادم (SSR) أو التوليد الثابت لضمان أن تكون العلامات موجودة في تحميل HTML الأولي.

لا تحب الإعلانات؟ يذهب خالية من الإعلانات اليوم 

علامات Open Graph — انتهِ من أن روابطك تبدو سيئة على سلاك

نُشرت في 23 مايو 2026

تُستخدم علامات Open Graph لضبط الصورة والعنوان والوصف التي تظهر عند مشاركة روابط في سلاك، ولينكدإن، وتوتير، وديسكورد. اكتشاف العلامات الست الأساسية، وكيفية تعيين حجم og:image بشكل صحيح، وكيفية اختبار أن معايير عرضك تعمل بشكل صحيح.

علامات Open Graph — توقف عن مظهر روابطك السيء على سلَك 1

إعلان · حذف؟

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

تُحلّل علامات Open Graph. هي مجموعة من <meta> السطور في صفحة <head> التي تخبر سلَك، لينكدإن، تويتر، ديسكورد، وكل منصة أخرى بالضبط ما يجب عرضه عندما يُشار إلى رابطك. إذا أُزيلت هذه العلامات، فإن المنصة تُفترض — بشكل سيء.

ما هي علامات Open Graph؟

Open Graph (OG) هي بروتوكول أُدخلته فيس بوك عام 2010 بحيث يمكن للصفحات الويب التحكم في طريقة عرضها عند مشاركتها على المنصة. كان المفهوم بسيطًا: إضافة بيانات مُهيكلة إلى HTML <head> ويمكن للمنصات استخلاص عنوان، ووصف، وصورة مناسبة بدلًا من التخمين.

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

الستة علامات الأساسية لـ Open Graph

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

<meta property="og:title" content="Your Page Title Here" />
<meta property="og:description" content="One or two sentences that explain what this page is about." />
<meta property="og:image" content="https://yoursite.com/images/og-image.jpg" />
<meta property="og:url" content="https://yoursite.com/your-page/" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="Your Site Name" />

og:title — العنوان المُعرض في المُراجعة. اجعله أقل من 70 حرفًا. لا تنسخ فقط علامة <title> الصفحة — يمكن أن يكون العنوان المُعدّل أكثر تأثيرًا لأنه لا يحتاج إلى اسم الموقع.
og:description — الملخص المكوّن من سطرين تحت العنوان. 150 إلى 200 حرف هو المكان المثالي. اجعله مفيدًا، لا تجعله مبهمًا.
og:image — الصورة المُعرضة في بطاقة المُراجعة. هذه العلامة هي التي تُصنع أو تُدمّر مظهر رابطك. المزيد عن الأبعاد أدناه.
og:url — الرابط المُعيّن للصفحة. استخدم الرابط الكامل مع https://. هذا يمنع ظهور مُراجعة متكررة عندما يُشار إلى نفس المحتوى من خلال روابط مختلفة.
og:type — استخدم website لأغلب الصفحات. استخدم article لأعمدة المدونات، مُرافقًا بـ article:published_time و article:author.
og:site_name — اسم علامة تجارية. تُعرض بعض المنصات هذا الاسم بشكل منفصل عن العنوان، لذا اجعله قصيرًا.

علامات كارت تويتر / إكس

تُستخدم تويتر نظامًا خاصًا يُعرف بـ "كارات تويتر". الجيد: يعود إلى علامات OG إذا كانت علامات كارت تويتر مفقودة. السيء: لا يُظهر تويتر كارات كبيرة إلا إذا قمت بتفعيلها بشكل صريح.

أضف هذه العلامات مع علامات OG:

<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Your Page Title Here" />
<meta name="twitter:description" content="One or two sentences about this page." />
<meta name="twitter:image" content="https://yoursite.com/images/og-image.jpg" />

العلامة المهمة هي twitter:card. ضعها على summary_large_image لتحصل على بطاقة كبيرة. ضعها على summary لتحصل على صورة صغيرة. بدون هذه العلامة، تُستخدم تويتر الافتراضية summary وتصبح صورة OG التي صممت بعناية غير مُعرضة.

og:image — العلامة التي تُؤدي إلى المهمة

إذا كانت هناك علامة واحدة يجب أن تُصاغ بشكل صحيح، فهي og:image. قد يُنقر على مُراجعة مُعدّة بسيطة، لكن مُراجعة تحتوي على صورة مُهملة، مُمَدَّدة، أو غير موجودة لن تُنقر عليها.

المساحات الموصى بها

1200 × 630 بكسل — المعيار العالمي الذي يعمل على فيسبوك، لينكدإن، تويتر، وسلَك
الحد الأدنى: 600 × 315 بكسل — أي شيء أصغر من ذلك، وستُتجاهل الصورة من قبل بعض المنصات
حجم الملف: أقل من 8 ميغابايت — ترفض فيسبوك وغالبية المنصات ملفات أكبر
الصيغة: JPG أو PNG — JPG للصور، PNG للرسومات التي تحتوي على نصوص

احتفظ بالمحتوى المهم بعيدًا عن الحواف

تُقصّف المنصات المختلفة صور OG بشكل مختلف. يُظهر سلَك بطاقة واسعة، يُقصّف لينكدإن إلى مربع في بعض السياقات، ويُفعل التطبيقات المحمولة ما يناسبها. احتفظ بعلامتك، النصوص، والتركيز داخل منطقة آمنة مركّزة — تقريبًا 80% من الصورة — لتفادي أن يُقصَّ من المحتوى المهم.

كيفية إضافة علامات Open Graph إلى موقعك

المواقع المبسطة بالـ HTML

أضف العلامات داخل <head> في HTML، قبل إغلاق </head> العُلامة:

<head>
  <!-- your existing tags -->
  <meta property="og:title" content="Page Title" />
  <meta property="og:description" content="Page description." />
  <meta property="og:image" content="https://yoursite.com/og.jpg" />
  <meta property="og:url" content="https://yoursite.com/page/" />
  <meta property="og:type" content="website" />
  <meta property="og:site_name" content="Site Name" />
  <meta name="twitter:card" content="summary_large_image" />
</head>

WordPress

إذا كنت تستخدم ووردبريس، لا تحتاج إلى تغيير الكود. تُعالج أدوات مثل Yoast SEO، Rank Math، أو All in One SEO علامات OG بشكل تلقائي. بعد التثبيت، ابحث عن قسم "الاجتماعي" في محرر المقال أو الصفحة — يمكنك تعيين عنوان OG مخصص، ووصف، وصورة لكل محتوى بشكل منفصل عن عنوان SEO ووصف الميتا.

تطبيقات Next.js وReact

في Next.js App Router، استخدم المُصدر المدمج metadata الصادر في page.tsx:

export const metadata = {
  openGraph: {
    title: 'Page Title',
    description: 'Page description.',
    images: ['https://yoursite.com/og.jpg'],
    url: 'https://yoursite.com/page/',
    type: 'website',
    siteName: 'Site Name',
  },
  twitter: {
    card: 'summary_large_image',
    title: 'Page Title',
    description: 'Page description.',
    images: ['https://yoursite.com/og.jpg'],
  },
};

كيفية اختبار علامات Open Graph

لا تفترض أن علاماتك تعمل — تُخزن المنصات مُراجعاتها بقوة، وقد تكون مُراجعة قديمة تعود إلى أيام. استخدم الأدوات التالية للتحقق وفرض تجديد:

مُدقق مشاركة فيسبوك — يُظهر ما يقرأه فيسبوك ويسمح لك بمسح المخزن وتحديثه
مُدقق مشاركة لينكدإن — تُخزن لينكدإن بشكل صارم، لذا هذا هو الطريقة الوحيدة لفرض تجديد
مُدقق كارت تويتر — يُظهر كيف ستبدو بطاقة تويتر على تويتر/إكس
مدقق Open Graph — يُمكنك التحقق من علامات OG لأي رابط مباشرة من متصفحك دون تسجيل دخول إلى أي منصة

ال مدقق Open Graph في IO Tools مفيد للإشراف السريع — أدخل أي رابط وستُستخرج جميع علامات OG وكارت تويتر في نظرة واحدة، لذا يمكنك رؤية العلامات المفقودة دون الانتقال بين أدوات المدقق المخصصة لكل منصة.

إذا كنت بحاجة إلى إنشاء علامات OG نظيفة ومُصاغة بشكل صحيح من الصفر، فإن مولد علامة HTML يُنتج العلامة المُصاغة بدقة التي تحتاجها لكل صفحة.

أربعة أخطاء شائعة في علامات Open Graph

استخدام رابط مُستقل للصورة — og:image يجب أن يكون رابطًا مُطلقًا (https://yoursite.com/image.jpg). مثل المُستقل مثل /images/og.jpg يُفشل بشكل سري وستُستبعد الصورة.
صورة واحدة لجميع الصفحات — تُستخدم صورة بديلة للصفحة الرئيسية، لكن المدونات، صفحات المنتجات، وصفحات التسويق كلها تستحق صورها الخاصة. تُفقد الصورة المُعدّة للسياق التي تجعل المراجعات قابلة للنقر.
إهمال twitter:card — بدونها، تُستخدم تويتر صورة صغيرة حتى لو كانت لديك صورة مثالية بحجم 1200×630. أضفها بشكل صريح دائمًا.
نشر التغييرات دون تجديد المخزن — تُخزن المنصات بيانات OG بقوة. بعد تغيير العلامات، استخدم مدقق المنصة لفرض إعادة التسجيل، أو ستستمر المراجعة القديمة في الظهور لعدة أيام.
كتابة وصف يُشبه العنوان — استخدم حقل الوصف لإضافة معلومات ليست موجودة في العنوان: ما سيتعلم القارئ، من هو المستفيد، وما المشكلة التي تحلها.