Open Graph meta etiketleri: sosyal bağlantı önizlemeleri için eksiksiz rehber

Open Graph meta etiketleri, bir HTML sayfasının <head> bölümüne yerleştirdiğiniz <meta property="og:…"> etiketleridir. Birisi bağlantınızı Facebook, LinkedIn, Slack, Discord, WhatsApp ve diğer platformların çoğunda paylaştığında görünen başlığı, açıklamayı ve görseli bu etiketler belirler. Bir kez tanımlayın; neredeyse her ağ, çıplak bir URL yerine zengin bir önizleme oluşturur. X (Twitter) kendi Twitter Card etiketlerini okur, ancak eşleşen etiket eksik olduğunda sizin Open Graph etiketlerinize geri döner; bu nedenle iyi hazırlanmış tek bir etiket kümesi, bir bağlantının gidebileceği hemen her yeri kapsar.

Bu tek protokol; bir başlık, bir özet ve net bir 1200×630 görsel gösteren bir bağlantı ile kimsenin tıklamadığı çıplak bir adres arasındaki farkı yaratır.

Bu rehber, sosyal paylaşım için gereken meta etiketlerinin tamamını adım adım ele alır: zorunlu dört Open Graph etiketi, og:image boyutlandırma kuralları, Twitter Card geri dönüşü, her platformun önizlemeleri nasıl oluşturup önbelleğe aldığı, paylaşımları boş bırakan hatalar ve yayına aldıktan sonra sonucu nasıl hata ayıklayacağınız.

Open Graph meta etiketleri nedir?

Open Graph, başlangıçta Facebook’ta oluşturulan ve ogp.me adresinde belgelenen açık bir protokoldür; herhangi bir web sayfasının kendisini zengin bir nesne olarak tanımlamasına olanak tanır. Bir platform, bağlantınızın ne hakkında olduğunu tahmin etmek yerine birkaç etiketi okur ve bunları bir önizleme kartına dönüştürür.

Söz dizimi, belgenin <head> bölümüne yerleştirilen, bir property özniteliği ve bir content değeri taşıyan sıradan bir HTML meta etiketidir:

<meta property="og:title" content="How Open Graph Tags Work">

property özniteliğine dikkat edin. SEO için kullanılan klasik HTML meta etiketleri (meta description, robots, viewport) name kullanır. Open Graph property kullanır, Twitter Card ise yine name kullanır. O özniteliği doğru yazmak önemlidir; property="og:title" bekleyen bir tarama botu, name="og:title" etiketini okumaz.

Bir bağlantıyı karta dönüştüren hemen her platform Open Graph okur: Facebook, LinkedIn, Slack, Discord, WhatsApp, Pinterest ve Telegram bu dili konuşur. Tek istisna X’tir. Kendi twitter:* etiketlerini tercih eder, ancak bulamadığı her şey için sizin og:* etiketlerinize geri döner; bu yüzden onları nadiren çoğaltmanız gerekir.

Open Graph, klasik SEO meta etiketlerinin yerini almaz; onların yanında yer alır. <title> ve canonical bağlantı hâlâ aramayı yönlendirir; meta description hâlâ arama parçacığınızı biçimlendirir. Open Graph etiketleri sıralamalara dokunmaz; sosyal kartın sahibi onlardır. Eksiksiz bir <head>, genellikle bu üç aileyi birlikte taşır.

Bunları elle yazmak tekrar gerektirir ve fark edilmeden yanlış yapması kolaydır. Open Graph ve Meta Etiketi Oluşturucu tüm bloğu kısa bir formdan oluşturur, canlı olarak önizler ve zorlu ayrıntıları (öznitelik adları, mutlak URL’ler, görsel boyutları) tutarlı tutar; böylece bunları hatırlamak zorunda kalmazsınız.

Gerçekten ihtiyaç duyduğunuz temel Open Graph etiketleri

Open Graph onlarca özellik tanımlar, ancak iyi bir paylaşım için yalnızca birkaçı gerekir. Zorunlu dört etiketle başlayın, bir açıklama ekleyin ve çoğu sayfa için orada durun.

Zorunlu dört etiket: og:title, og:type, og:image, og:url

Protokol uyarınca dört etiket zorunludur. Birini atlarsanız platformlar ya kartı düşürür ya da zayıf bir tahminle doldurur.

<meta property="og:title" content="How Open Graph Tags Work">
<meta property="og:type" content="website">
<meta property="og:image" content="https://example.com/og/cover.png">
<meta property="og:url" content="https://example.com/open-graph-guide">

og:title, karttaki kalın başlıktır. og:type nesneyi sınıflandırır (bununla ilgili ayrıntı aşağıda). og:image önizleme görselidir ve mutlak bir HTTPS URL olmalıdır. og:url sayfanın canonical adresidir; platformlar bunu paylaşımları tekilleştirmek ve etkileşimi bir araya toplamak için kullanır.

og:description ve SEO meta description’dan farkı

og:description, bir paylaşım kartında başlığın altında basılan kısa özettir:

<meta property="og:description" content="A practical guide to og:title, og:image and Twitter Card tags.">

Bu, SEO’daki <meta name="description"> etiketinden farklı bir etikettir ve farklı bir okuyucuya hitap eder. Meta description, bir Google sonuç sayfasında tıklamalar için yarışır ve yaklaşık 155 karaktere göre ölçülür. Open Graph açıklaması ise, alanın daha dar olduğu ve ilk cümlenin ağırlığı taşıdığı bir sosyal kartta okunur. og:description etiketini eklemezseniz çoğu platform meta description’ınıza geri döner; bu nedenle çoğu zaman atlayabilirsiniz. Yalnızca sosyal kancanın arama parçacığından farklı olması gerektiğinde ona özel bir açıklama yazın.

og:type ve neyin kilidini açtığı

og:type, platformlara sayfanızın ne tür bir şey olduğunu söyler. Yaygın değerler website, article, product ve profile şeklindedir. Bir ana sayfa veya açılış sayfası website türündedir; bir blog gönderisi ise article türündedir.

article değerini seçmek, sıradan bir website türünün kullanamayacağı ek özelliklerin ve işlevlerin kilidini açar:

<meta property="og:type" content="article">
<meta property="article:published_time" content="2026-07-16T00:00:00Z">
<meta property="article:author" content="Ada Lovelace">

Bu article:* etiketleri, yayın tarihlerini ve yazar adlarını kartlara aktarır ve sayfayı, yapılandırılmış verileri doğrudan Open Graph işaretlemenizden çeken Pinterest Rich Pins için uygun hale getirir. Gönderilerde og:type değerini article, diğer her şeyde ise website olarak ayarlayın; eşleşen alanlar da onu izler.

Çoğu sayfanın gerçekten kullandığı etiketler için bir başvuru aşağıda:

Etiket	Neyi kontrol eder	Örnek değer
`og:title`	Kartta gösterilen başlık	`How Open Graph Tags Work`
`og:type`	Nesne türü: `website`, `article`, `product`, `profile`	`article`
`og:image`	Önizleme görseli (mutlak HTTPS URL)	`https://example.com/og/cover.png`
`og:url`	Sayfanın canonical URL’si	`https://example.com/open-graph-guide`
`og:description`	Başlığın altındaki özet	`A practical guide to social meta tags.`
`og:site_name`	Sitenin genel adı	`Example`
`og:locale`	İçerik dili ve bölgesi	`en_US`

og:image: boyutlar, oran ve paylaşımları bozan kurallar

Görsel, bir önizlemede insanların ilk gördüğü kısımdır ve çoğu paylaşımın dağıldığı yer de burasıdır. og:image boyutunu ve biçimini doğru yapın; tek bir dosya her yerde çalışır.

1200×630 (1.91:1) evrensel standardı

Önerilen og:image boyutu 1200×630 piksel, yani 1.91:1 en-boy oranıdır. Bu tek görsel Facebook, LinkedIn, Slack, Discord ve X’in summary_large_image kartında doğru şekilde oluşturulur; dolayısıyla her platform için farklı bir dosyaya ihtiyacınız olmaz.

Alt boyut sınırları da önemlidir. Facebook, 200×200’den küçük her görseli yok sayar ve 600×315’in altındaki her şey için sıkışık, kare bir küçük resim gösterir. 1200 pikselden dar olduğunda büyük kartlar bulanık görünmeye başlar. 1200×630’u hedefleyin; her eşiği tek seferde aşarsınız.

og:image:width ve og:image:height neden önemlidir

Bir platform bağlantınızla ilk karşılaştığında görseli henüz indirmemiştir; onu eşzamansız olarak getirir. Boyutları önceden bildirirseniz platform doğru alanı ayırabilir ve kartı hemen yerleştirebilir:

<meta property="og:image" content="https://example.com/og/cover.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:alt" content="Open Graph guide cover with the title in large type">

Bunları atlarsanız, tarama botu yetişene kadar bir sayfanın ilk paylaşımı boş görünebilir. Bunları eklerseniz kart, ilk yapıştırmada doğru olur. og:image:alt etiketi, destekleyen platformlarda görseli ekran okuyucular için tanımlar.

Dosya biçimi ve boyutu

JPG veya PNG kullanın. Her ikisi de her tarama botunda güvenilir biçimde çözümlenir; bir og:image’ın bütün amacı da budur: denetlemediğiniz sunucularda oluşturulabilmesi gerekir. Genel kural olarak dosyayı 1 MB altında, diğerlerinden daha katı olan WhatsApp için ise 300 KB altında tutun. Dışa aktardığınız dosya daha ağırsa, kaliteyi gözle görülür biçimde bozmadan 1 MB altına indirmek için Resim Sıkıştırıcı aracından geçirin.

Burada modern bir biçime yönelmek cazip gelir, ama direnmeniz gereken tek yer burasıdır. Daha yeni biçimler tarayıcılar için bayt tasarrufu sağlar; ancak bazı sosyal tarama botları bunları tutarsız biçimde çözümler, dolayısıyla bir WebP veya AVIF og:image, onu okuyamayan bir platformda boş dönebilir. Bu ödünleşimler WebP vs AVIF vs JPEG rehberinde ele alınıyor; özellikle paylaşım görselleri için JPG veya PNG’de kalın. Platformlar kenarları farklı şekilde kırptığı için logonuzu ve başlığınızı ortalanmış 1080×600 güvenli alanının içinde tutun; böylece önemli hiçbir şey kırpılmaz.

Mutlak HTTPS URL kuralı

og:image ve og:url, göreli yollar değil, tam https://… URL’leri olmalıdır. /cover.png gibi bir yol, düzenleyicinizde ve canlı sayfanızda sorunsuz çözümlenir; ancak URL’nizi getiren bir tarama botunun, onu çözümleyeceği bir temel yoktur, dolayısıyla paylaşım boş döner. Görselin ayrıca herkese açık şekilde erişilebilir olması gerekir: robots.txt tarama botunu engellerse veya dosya kimlik doğrulamanın arkasında yer alırsa, önizleme boş kalır.

Yukarıdaki her şeyi belirleyen bir kısıt daha var: tarama botları JavaScript çalıştırmaz. Facebook, LinkedIn, WhatsApp, Telegram ve Discord ham HTML’inizi getirir ve orada ne varsa onu okur. Bir çerçeve tarafından sayfa yüklendikten sonra istemci tarafında eklenen etiketler onlar için görünmezdir; bu nedenle Open Graph etiketleriniz sunucuda oluşturulan veya statik HTML içinde bulunmalıdır.

Twitter/X Kartları: bir etiket, sonra Open Graph’e geri dönüş

X kendi Twitter Card meta etiketlerini kullanır, ancak Open Graph ile örtüşme, beklediğinizden çok daha az yazmanız anlamına gelir. Pratikte tek bir etiket eklersiniz ve gerisinin geri dönmesine izin verirsiniz.

twitter:card, zorunlu tek Twitter etiketidir

twitter:card mevcut olmadıkça, eksiksiz bir Open Graph etiket kümeniz olsa bile X hiçbir kart oluşturmaz. Bu, zorunlu tek Twitter Card etiketidir:

<meta name="twitter:card" content="summary_large_image">

Değer, düzeni seçer. summary_large_image, 1200×630 bir görsel için oluşturulmuş büyük afiş kartını verir. summary ise metnin yanında küçük, kare bir küçük resim bulunan kompakt bir kart verir:

<meta name="twitter:card" content="summary">

name özniteliğine dikkat edin. Twitter Card etiketleri, Open Graph’in kullandığı property yerine name kullanır.

X, başlık, açıklama ve görsel için og:* etiketlerine nasıl geri döner

Başlık, açıklama ve görsel için X, eşleşen twitter:* etiketi yoksa sizin og:title, og:description ve og:image etiketlerinizi okur. twitter:title veya twitter:image etiketlerini bu yüzden nadiren yazarsınız. twitter:card etiketini ayarlayın, Open Graph etiketlerinizi temiz tutun; X kartı bunlardan bir araya getirir.

Boş twitter:image tuzağı

Geri dönüşün keskin bir tarafı var: boş bir etiket, mevcut sayılır. twitter:image etiketini boş bir değerle yayarsanız, X og:image etiketine geri dönmek yerine o boş değeri kullanır ve kartınız görselini kaybeder.

<!-- Wrong: blocks the fallback and leaves the card imageless -->
<meta name="twitter:image" content="">

<!-- Right: omit the tag entirely and X reads og:image -->

Kural basit: asla boş bir sosyal etiket çıktısı vermeyin. Bir değeriniz yoksa onu dışarıda bırakın.

Slack ve Discord’a özgü ayrıntılar

Slack önce Twitter Card’ı, sonra Open Graph’i okur ve twitter:label ile twitter:data aracılığıyla iki ek alanı gösterebilir:

<meta name="twitter:label1" content="Reading time">
<meta name="twitter:data1" content="11 minutes">
<meta name="twitter:label2" content="Written by">
<meta name="twitter:data2" content="Ada Lovelace">

Bunlar, bir Slack açılımının altında küçük, etiketli ayrıntılar olarak görünür. Discord, Open Graph okur ve başka kimsenin kullanmadığı bir incelik ekler: gömülü içeriğin sol vurgu çubuğunu sayfanızın theme-color değeriyle renklendirir.

<meta name="theme-color" content="#5865F2">

Bağlantı önizlemeleri her platformda nasıl oluşturulur

Aynı etiketler, kimin okuduğuna bağlı olarak farklı sosyal medya bağlantı önizlemeleri üretir. Her platform kendi etiket alt kümesini seçer, kendi zaman aralığı boyunca önbelleğe alır ve bir iki tuhaflık ekler. Bu tablo hızlı başvuru içindir.

Platform	Okuduğu etiketler	Önbellek	Dikkat çeken davranış
Facebook	Open Graph	~30 gün	200×200 altındaki görselleri yok sayar; 600×315 altında küçük bir kare gösterir
LinkedIn	Open Graph	~7 gün	Eskimiş bir önizlemeyi Post Inspector ile temizleyin
X (Twitter)	`twitter:card` + `og:*` etiketlerine geri döner	kısa	`twitter:card` yoksa hiç kart olmaz
Slack	Twitter Card, sonra Open Graph	mesaj başına	`twitter:label`/`twitter:data` etiketlerini ek alan olarak oluşturur
Discord	Open Graph	mesaj başına	Gömülü içeriğin vurgu çubuğu için `theme-color` kullanır
WhatsApp	`og:title` + `og:image`	mesaj başına	Meta verileri üst kısma yakın ister; görseli 300 KB altında tutun
Telegram	Open Graph	mesaj başına	Yalnızca JPEG veya PNG’den güvenilir biçimde oluşturur
Pinterest	Open Graph veya Schema.org	—	Article Rich Pins için `og:type=article` gerekir

Önbellek sütunu yaygın bir sürprizi açıklar: etiketlerinizi düzeltir, yeniden paylaşırsınız ve Facebook haftalarca hâlâ eski başlığı gösterir. Facebook, Open Graph verilerini yaklaşık 30 gün, LinkedIn ise yaklaşık 7 gün tutar; bu nedenle bir düzenleme, önbellek dolana kadar veya bir yenilemeyi zorlayana kadar görünmez. Aşağıdaki hata ayıklayıcılar tam da bunu yapar.

Yaygın Open Graph hataları (ve bunları nasıl yakalarsınız)

Çoğu bozuk önizleme, kısa bir hatalar listesine dayanır. Her biri yerelde iyi görünür ve yalnızca bir tarama botu canlı sayfayı getirdiğinde başarısız olur.

Göreli og:image yolu

Göreli bir yol tarayıcınızda oluşturulur, ancak paylaşıldığında bozulur; çünkü tarama botunun onu çözümleyeceği bir temel URL yoktur.

<!-- Blank when shared -->
<meta property="og:image" content="/cover.png">

<!-- Renders everywhere -->
<meta property="og:image" content="https://example.com/cover.png">

Eksik og:url veya onunla uyuşmayan canonical

og:url olmadan, paylaşım sayıları ve etkileşim URL çeşitleri arasında dağılır (www ile ve olmadan, izleme parametreleriyle, sonda eğik çizgiyle). Sinyallerin bir arada kalması için hem canonical bağlantınızı hem de og:url etiketinizi aynı tek URL’ye yönlendirin.

Görsel çok küçük veya yanlış en-boy oranı

200×200 altındaki bir görsel tamamen yok sayılır ve 1.91:1’den uzak olan biri, planlamadığınız şekillerde kırpılır. 1200×630 yayınlayın; çerçeveleme her platformda öngörülebilir olur.

twitter:card etiketini unutmak

Eksiksiz bir Open Graph etiket kümesi bile, twitter:card olmadan X’te hiç kart üretmez. Bir bağlantının LinkedIn’de harika görünüp X’te hiçbir şey göstermemesinin en yaygın nedeni budur.

Tarama botunun göremediği istemci tarafında oluşturulan etiketler

Tek sayfalık bir uygulama Open Graph etiketlerini yükleme sonrasında eklerse, JavaScript çalıştırmayan tarama botları bunları asla görmez. Etiketleri sunucu tarafında oluşturun veya HTML’i önceden oluşturun.

charset’in ilk 1024 bayttan sonra yerleştirilmesi

<meta charset="utf-8"> bildirimi, belgenin ilk 1024 baytı içinde görünmelidir; aksi halde tarayıcı bunu yok sayar ve başlığınızdaki ve açıklamanızdaki ASCII olmayan karakterleri bozabilir. Onu <head> içinde en başa koyun:

<head>
  <meta charset="utf-8">
  <!-- everything else follows -->
</head>

Open Graph etiketlerinizi nasıl test edip hata ayıklarsınız

Canlı bir URL’ye karşı doğrulamadığınız bir önizlemeye asla güvenmeyin. Üç araç, önemli olan platformları kapsar ve hepsi bir önbellek yenilemesini zorlayabilir.

Facebook Sharing Debugger, canlı URL’nizi getirir, Facebook’un tam olarak neyi ayrıştırdığını gösterir ve eksik veya hatalı biçimlendirilmiş etiketleri listeler. En kullanışlı düğmesi, Facebook’un ~30 günlük önbelleğini istek üzerine yenileyen “Scrape Again”dir; bu, bir ay beklemeden bir düzeltmeyi görünür kılmanın en hızlı yoludur.

LinkedIn Post Inspector

LinkedIn Post Inspector, LinkedIn için aynı işi yapar. Bir URL yapıştırın; sayfayı yeniden getirir ve LinkedIn’in ~7 günlük önbelleğini temizler, böylece güncellenmiş bir başlık veya görsel günler sonra değil, bir sonraki paylaşımınızda görünür.

X kart doğrulaması geliştirici portalına taşındı

X, bağımsız Card Validator aracını kullanımdan kaldırdı. 2026 itibarıyla kart doğrulaması, herkese açık bir URL yerine X geliştirici portalının içinde yer alıyor; bu nedenle çoğu ekip X kartlarını farklı bir şekilde doğrular: X, og:* etiketlerine geri döndüğü için Facebook ve LinkedIn hata ayıklayıcıları X’in okuyacağı etiketleri zaten doğrular ve üçüncü taraf bir önizleme aracı, twitter:card düzeninin kendisi için boşluğu doldurur.

Yayına almadan önce önizleyin

Hata ayıklayıcılar yalnızca zaten canlı olan bir URL’yi inceleyebilir; bu da boş bir görseli keşfetmek için kötü bir andır. Kartı, siz hâlâ düzenlerken önizleyin. Open Graph ve Meta Etiketi Oluşturucu yazdığınız değerlerden Google, Facebook, X, LinkedIn, Slack ve Discord önizlemeleri oluşturur, yanlış bir oranı yakalamak için og:image’ınızın gerçek boyutlarını tarayıcıda okur ve mevcut bir <head> bloğunu içe aktarabilir; böylece bozuk bir paylaşımı, yayına almadan önce teşhis edebilirsiniz.

Hızlı kontrol listesi

Her sayfanın taşıması gereken asgari düzey aşağıda. Kopyalayın, kendi değerlerinizi yerleştirin; her yerde oluşturulan bir önizlemeniz olur:

<meta charset="utf-8">
<title>Your page title</title>
<meta name="description" content="Your 150-character summary.">
<link rel="canonical" href="https://example.com/page">

<meta property="og:title" content="Your page title">
<meta property="og:type" content="website">
<meta property="og:url" content="https://example.com/page">
<meta property="og:image" content="https://example.com/og/page.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:description" content="Your 150-character summary.">

<meta name="twitter:card" content="summary_large_image">

Yayınlamadan önce temel noktaları gözden geçirin: 1200×630 boyutunda mutlak bir HTTPS og:image, canonical’ınızla eşleşen bir og:url, mevcut bir twitter:card ve sunucu tarafında oluşturulan etiketler. Bunu hızlandıran araçların daha kapsamlı bir turunu isterseniz, temel geliştirici araçları rehberi gerisini bir araya getirir. Tüm bloğu tek seferde oluşturup önizlemeye hazır olduğunuzda, Open Graph ve Meta Etiketi Oluşturucu onu yazar, denetler ve her kartı yayına almadan önce gösterir.

Sıkça sorulan sorular

Open Graph ile Twitter Card etiketleri arasındaki fark nedir?

Open Graph, Facebook, LinkedIn, Slack ve daha fazlası tarafından okunan, platformlar arası bir protokoldür; Twitter Card etiketleri (twitter:*) ise X’e özgüdür. Eşleşen twitter:* etiketi eksik olduğunda X sizin OG etiketlerinize geri döner, dolayısıyla genellikle OG artı tek bir twitter:card değerine ihtiyacınız olur.

Open Graph etiketleri Google arama sıralamalarını etkiler mi?

Hayır. Open Graph ve Twitter Card etiketleri Google sıralamalarını etkilemez. Bağlantıların paylaşıldığında nasıl göründüğünü belirler ve sosyal trafiği yönlendirir. Klasik <title> ve canonical etiketleri SEO için önemlidir; meta description parçacığınızı ve tıklama oranınızı biçimlendirir, ancak doğrudan bir sıralama faktörü değildir.

Open Graph etiketleri HTML’de nereye yerleştirilir?

<head> öğesinin içinde, sunucuda oluşturulan veya statik HTML içinde. Facebook, LinkedIn, WhatsApp ve Telegram tarama botları JavaScript çalıştırmaz, bu nedenle istemci tarafında eklenen etiketler görünmez. <meta charset> etiketini en başa koyun ki ilk 1024 baytın içine düşsün.

Tek bir görsel Facebook, X ve LinkedIn için çalışabilir mi?

Evet. Tek bir 1200×630 (1.91:1) görsel Facebook, LinkedIn, Slack, Discord ve X’in summary_large_image kartında doğru şekilde oluşturulur. Onu herkese açık bir URL’de HTTPS üzerinden sunun ve og:image:width/og:image:height değerlerini bildirin ki ilk paylaşım boş olmasın.

Bağlantı önizlemem neden hiç görsel göstermiyor?

Yaygın nedenler: mutlak bir HTTPS URL yerine göreli bir og:image yolu, 200×200 altında bir görsel, X’te eksik bir twitter:card veya tarama botunun çalıştıramadığı JavaScript tarafından eklenen etiketler. Düzelttikten sonra Facebook Sharing Debugger ile yeniden tarama yapın.

Tüm sayfaların kendi Open Graph etiketlerine ihtiyacı var mı?

İdeal olarak evet. Her sayfanın, o belirli sayfayı yansıtan bir og:title, og:description, og:image ve canonical og:url etiketi olmalı ki paylaşılan bağlantılar ilgili önizlemeleri göstersin. Site geneli bir geri dönüş, hiç yoktan iyidir, ancak sayfa başına etiketler çok daha fazla sosyal tıklama kazanır.