WC
WEB CREATOR AIالحقيبة التدريبية

ربط الصفحات وتسريع الموقع وتجهيزه لمحركات البحث (Next.js & SEO)

كيف يظهر موقعك في بحث جوجل وكيف تظهر بطاقته الترحيبية عند مشاركة الرابط في واتساب؟

0 / 2 أنشطة مكتملة (0%)
ماذا ستتعلم وتنجز في هذه الجلسة؟ (اضغط للعرض)▼
  • تحقيق نتيجة 95+ في مؤشرات أداء Google Lighthouse
أنشطة الجلسة بالترتيب (اختر النشاط):
النشاط 1 من 2قيد التنفيذ
25 دقيقة تقريبًا

النشاط 01: إعداد وسوم الميتا ومشاركة السوشيال ميديا (Metadata & OpenGraph)

اجعل رابط موقعك يظهر بصورة جذابة وعنوان أنيق عند مشاركته في واتساب وتويتر ولينكد إن

1. ما المطلوب في هذا النشاط؟

أكتب كائن metadata في Next.js متضمناً العنوان، الوصف، الكلمات المفتاحية، وصورة المعاينة openGraph image.

ما الفائدة العملية من هذا النشاط؟

الروابط التي تظهر بدون صورة أو وصف تبدو كروابط مشبوهة ويتجاهلها الناس، بينما البطاقة الأنيقة تضاعف النقرات 5 أضعاف.

2. خطوات التنفيذ خطوة بخطوة:

1

صدّر كائن metadata في app/layout.tsx أو app/page.tsx.

2

حدد title جذاب ووصف description دقيق لا يتجاوز 160 حرفاً.

3

حدد openGraph مع رابط صورة مقاس 1200x630 بكسل.

3. كيف تعرف أن النتيجة جاهزة؟

معاينة تواصل اجتماعي احترافية تظهر صورة وعنوان الموقع فور لصق الرابط.

📄 قالب البداية أو الكود المساعد (اضغط للعرض أو النسخ)▼
template
export const metadata: Metadata = {
  title: 'برجر زون | أفضل وجبات سريعة في المدينة',
  description: 'اطلب ألذ شطائر البرجر الطازجة مع توصيل سريع حتى باب بيتك خلال 20 دقيقة.',
  openGraph: {
    title: 'برجر زون | طعم لا يقاوم',
    description: 'خصم 20% على طلبك الأول عبر الموقع الرسمي.',
    url: 'https://burgerzone.dev',
    images: [{ url: '/banner.jpg', width: 1200, height: 630 }],
    locale: 'ar_SA',
  },
};
تلميحات مساعدة (1)▼
  • • 💡 استخدم موقع opengraph.xyz لفحص بطاقة المعاينة والتأكد من ظهورها في كل الشبكات.

4. مساحة الحل وتسليم النتيجة عبر واتساب

اكتب إجابتك أو الكود أو رابط عملك في الصندوق أدناه. تُحفظ مسودتك تلقائيًا في متصفحك، وعند الضغط على «إرسال النتيجة عبر واتساب» سيتم حفظ الإجابة في سجل تقدمك وفتح رسالة واتساب جاهزة لإرسالها للمدرب (+90 538 201 50 72).

0 حرف•تم الحفظ التلقائي في المتصفح
* اكتب إجابتك أولًا لتفعيل أزرار الحفظ والإرسال