← Blog

טעויות נפוצות עם תגיות Open Graph

אפילו מפתחים מנוסים עושים את הטעויות האלה בתג OG. להלן הנפוצים ביותר - וכיצד לתקן כל אחד מהם.

בדוק את התגיות של OG שלך לאיתור טעויות

השתמש ב-Proovd - הדבק כתובת URL וראה מיד איך היא נראית ב-X, LinkedIn, Slack, Discord, WhatsApp ו-Reddit.

תשובה מהירה

  • שימוש בכתובות URL יחסיות עבור og:image - פלטפורמות לא יכולות להביא אותן
  • חסר תג twitter:card — X לא יציג את הכרטיס שלך
  • תמונה קטנה מדי עבור הפלטפורמה - LinkedIn צריך 1200×627 מינימום
  • לא מנקה את המטמון לאחר עדכונים - פלטפורמות מאחסנות תגיות OG במשך ימים

טעות 1: שימוש בכתובות URL יחסיות עבור og:image

זוהי הטעות הנפוצה ביותר. מפתחים כותבים:

✗ לא נכון

<meta property="og:image" content="/images/preview.jpg" />

הסורקים של הפלטפורמות לא יכולים לפתור כתובות אתרים יחסיות. הם צריכים כתובת URL מוחלטת:

✓ נכון

<meta property="og:image" content="https://yoursite.com/images/preview.jpg" />

השתמש תמיד ב-https:// בכתובת ה-og:image שלך. זה משפיע על כל פלטפורמה - X, LinkedIn, Discord, Slack, WhatsApp ו-Reddit.

טעות 2: חסר תג twitter:card

מפתחים רבים מגדירים רק Open Graph תגיות ומדלגים על Twitter Card תגיות. X/Twitter מעדיף twitter:card וייתכן שלא יציג את הכרטיס שלך כראוי בלעדיו.

✗ לא שלם

<meta property="og:image" content="https://yoursite.com/image.jpg" />

✓ הושלם

<meta property="og:image" content="https://yoursite.com/image.jpg" /> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:image" content="https://yoursite.com/image.jpg" />

הגדר גם og:image וגם twitter:image לכיסוי מלא. עיין במדריך שלנו Open Graph לעומת Twitter Card לפרטים.

טעות 3: תמונה קטנה מדי עבור הפלטפורמה

לכל פלטפורמה יש גדלי תמונה מינימליים שונים. תמונה שעובדת על Discord (300×300 מינימום) עשויה שלא לעבוד על LinkedIn (1200×627 מינימום).

Platform Minimum Recommended
X / Twitter800 × 4181200 × 628
LinkedIn1200 × 6271200 × 627
Discord300 × 3001200 × 630
WhatsApp300 × 1571200 × 630
Reddit120 × 1201200 × 628

השימוש ב-1200 × 630 כגודל הסטנדרטי שלך מכסה את כל הפלטפורמות. עיין במדריך Open Graph שלנו לגודל תמונה לפירוט המלא.

טעות 4: לא מנקה את המטמון לאחר עדכונים

אתה מעדכן את תגיות OG. הפלטפורמות עדיין מציגות את התצוגה המקדימה הישנה. הבעיה: פלטפורמות מאחסנות תגיות OG ואינן מביאות אותן מחדש באופן אוטומטי.

לאחר עדכון התגים שלך, עליך לנקות את המטמון של כל פלטפורמה:

עיין במדריך כיצד לנקות Open Graph מטמון שלנו להדרכה המלאה של פלטפורמה אחר פלטפורמה.

טעות 5: חסר og:description או טקסט קטום

חלק מהמפתחים מגדירים og:title וog:image אך מדלגים על og:description. אחרים כותבים תיאורים ארוכים מדי ונקטעים.

שיטות עבודה מומלצות:

טעות 6: לא מגדיר og:url

ללא og:url, פלטפורמות עשויות להשתמש בכתובת האתר השגויה בתצוגה המקדימה (למשל, כתובת URL עם פרמטרי מעקב). הגדר תמיד את כתובת האתר הקנונית:

✓ נכון

<meta property="og:url" content="https://yoursite.com/your-page" />

טעות 7: שימוש בסוג MIME שגוי של תמונה

אם השרת שלך מחזיר את הכותרת השגויה מסוג Content-Type עבור התמונה שלך (למשל, משרת PNG עם image/jpeg), חלק מהפלטפורמות ידחו אותה. ודא ששרת התמונות שלך מחזיר את סוג ה-MIME הנכון:

LinkedIn מחמיר במיוחד לגבי אימות סוג MIME.

טעות 8: דפים דינמיים ללא תגיות OG ייחודיות

אם יש לך SPA או אתר דינמי שבו כל דף חולק את אותם תגיות OG (בדרך כלל תגיות דף הבית), הפלטפורמות יציגו את אותה תצוגה מקדימה עבור כל עמוד. כל עמוד זקוק לכותרת, תיאור ותמונה ייחודיים משלו.

בNext.js, השתמש בgenerateMetadata(). ב-WordPress, השתמש בהגדרות Yoast/RankMath לכל עמוד. ב-HTML רגיל, הגדר תגים בנפרד בכל עמוד.

רשימת רשימת תיקון מהירה

  1. השתמש בכתובות URL מוחלטות (https://...) עבור כל og:image הנתיבים
  2. הגדר גם את התגים og: וגם twitter:
  3. השתמש בתמונות של 1200×630 פיקסלים להתאמה אוניברסלית
  4. נקה מטמון פלטפורמה לאחר עדכון התגים
  5. הגדר תגיות OG ייחודיות לכל עמוד
  6. כלול og:description (150-160 תווים)
  7. הגדר את og:url לכתובת האתר הקנונית
  8. ודא שסוג MIME תואם לפורמט התמונה בפועל
  9. בדוק עם Proovd כדי לתפוס את כל הטעויות בבת אחת

שאלות נפוצות

מהי הטעות Open Graph הנפוצה ביותר?

שימוש בכתובת URL יחסית עבור og:image במקום כתובת URL מוחלטת שמתחילה ב-https://. פלטפורמות אינן יכולות להביא כתובות URL יחסיות, כך שהתמונה לעולם לא תופיע בתצוגה המקדימה.

מדוע תמונת OG שלי עובדת על פלטפורמה אחת אך לא אחרת?

לכל פלטפורמה דרישות גודל תמונה שונות. LinkedIn דורש 1200x627 מינימום, X דורש 800x418, וDiscord מקבל 300x300 מינימום. תמונה שעובדת על פלטפורמה אחת עשויה להיות קטנה מדי עבור אחרת.

איך אני בודק אם בתגיות OG שלי יש שגיאות?

השתמש ב- Proovd כדי להדביק כתובת אתר כלשהי ולראות בדיוק כיצד היא מוצגת בכל שש הפלטפורמות בבת אחת.

בדוק את התגיות של OG שלך לאיתור טעויות

השתמש ב-Proovd — הדבק כתובת URL וראה את התצוגה המקדימה ב-X, LinkedIn, Slack, Discord, WhatsApp ו-Reddit.