Open Graph (Facebook – X) Meta Etiketleri Nedir & Nasıl Kullanılır?

» » Open Graph (Facebook – X) Meta Etiketleri Nedir & Nasıl Kullanılır?

2 dakikada okuyabilirsiniz

open-graph

Sosyal medyada içeriğinizin paylaşılması o içeriğin paylaşılmaya değer olduğuna dair Google’a bilgi verebilir. İşte bu yüzden paylaşılan içeriklerinizin sosyal medyada daha iyi görünümle yer alması paylaşımın tıklanma oranına bile etki edebilir. İşte bunu open graph dediğimiz meta tagları ile yapabilirsiniz.

Çok derinlere inmeden bahsedecek olursam Facebook 2010 yılında Open Graph’ı tanıttı. Daha sonradan da internete bu meta taglar yayılmaya başladı.

Open Graph Nedir?

Sosyal medyada (Facebok, X gibi) URL paylaşıldığında ilgili URL’ye ait description, article published date, title ve resimler gibi ek bilgilerin gözüktüğü meta taglara open graph kodları diyebiliriz.

Sosyal medya dönüşümlerinizi arttırmak istiyorsanız bence kesinlikle bu meta tagları sayfalarınıza yerleştirin ve olabildiğince detay vermeye çalışın. Open graph doğrudan SEO performansını etkilemez, sadece sosyal medyada sayfalarınızın daha iyi performans göstermesini sağlar.

open-graph-nedir
Open graph kullanım örneği.
  • 1 numara: Image
  • 2 numara: Title
  • 3 numara: Description kısmını göstermektedir.

Open Graph Meta Etiketleri

<meta property=”og:locale” content=”tr_TR”/>
<meta property=”og:title” content=”Samet ÖZSÜLEYMAN”,
<meta property=”product:plural_title” content=”Samet ÖZSÜLEYMAN” />
<meta property=”og:description” content=”Description yazısı.”/>
<meta property=”og:url” content=”https://www.sametozsuleyman.com.tr/open-graph”/>
<meta property=”og:site_name” content=”Samet ÖZSÜLEYMAN”/>
<meta property=”og:image” content=”https://www.sametozsuleyman.com.tr/open-graph. jpg”/>
<meta property=”og:price:amount” content=”34.9″/>
<meta property=”og:price: currency” content=”TRY”/>
<meta property=”og:type” content=”product”/>

open-graph-kodlari
Open graph kodları ve kullanımı.

Etiketleri <head> tagları arasında yerleştirebilirsiniz.

og:title

Sayfanın başlığını belirtir ve title meta tagıyla aynı işlevi görür. 100 karakterden uzun yazmamaya dikkat edebilirsiniz.

og:url

Paylaşılan sayfanın URL’sini gösterir.

og:type

Paylaşılan URL’nin tipi nedir onu belirtiyorsunuz. Örneğin;

  • Article,
  • Website,
  • Blog,
  • Movie,
  • Game,
  • Hotel gibi.

Tüm type listesi için buraya bakabilirsiniz.

og:description

HTML meta description gibi içeriğin bir özetini gösterir. Ortalama 200-250 karakter aralığında burayı tutabilirsiniz. Daha fazla olursa Facebook bunu kesecektir.

og:image

Dönüşüm oranını belkide en çok etkileyen unsur resimdir. Bu yüzden Facebook’ta göstermek istediğiniz resmi burada belirleyebilirsiniz. Bunu belirtmezseniz linkiniz paylaşıldığında Facebook ya otomatik resim çekecektir ya da resim göstermeyecektir.

1200*627 pixel ve 1-2 MB sınırlarında kalmayı düşünebilirsiniz.

Yukarda belirttiğim taglar dışında price veya videolara özel birçok meta tag bulunuyor.

Open Graph Kodlarını Test Etme

Eklediğiniz open graph kodlarını Facebook Debugger sayfasından test edebilirsiniz.

open-graph-test-sonucu
Test sonuçlarını görebilir ve hataları gidermeye odaklanabilirsiniz.

x (Twitter) Kartları

Facebook’un yanı sıra Twitter’da da URL’lerin daha iyi görünümü olması için twitter kartları ekleyebilirsiniz.

twitter:card, twitter:title, twitter:description, twitter:url ve twitter:image kodları da eklemek isteyebilirsiniz. Tüm bu kodların detayına Twitter’dan ulaşabilirsiniz.

Örnek X kart kullanımı;

<meta name=”twitter:card” content=”summary_large_image”/>
<meta name=”twitter:site” content=”@sametozsuleyman”/>
<meta name=”twitter:creator” content=”@sametozsuleyman”/>
<meta name-“twitter:title” content=”Samet Özsüleyman”/>
<meta name=”twitter:description” content=”Twitter description içerigi.”/>
<meta name=”twitter:image” content=”https://sametozsuleyman.com.tr/seo.jpg”/>

Twitter kartlarını ise Validator sayfasından doğrulayabilirsiniz. WordPress’te Yoast SEO & All in One SEO gibi eklentilerin panelde yazı içerisinde sosyal meydada kullanılacak içeriği düzenleme özelliği de bulunuyor:

og-etiketleri
WordPress og etiketlerinin kullanım alanı.

Google Open Graph Etiketlerini Kullanıyor mu?

Evet, Google og:title meta etiketini SERP’te title belirlerken kullandığını açıkladı.

Faydalı Kaynak:

Neil Patel

Samet Özsüleyman Samet Özsüleyman, ZEO'da SEO Manager olarak çalışmaktadır. Aynı zamanda İstatistikçi olan Samet; sıcak çikolatayı, yapısal verileri ve tarihi çok sevip, strateji oyunlarına bayılır. Ayrıca Tayland'ı çok sevmektedir :)
Samet Özsüleyman Samet Özsüleyman, ZEO'da SEO Manager olarak çalışmaktadır. Aynı zamanda İstatistikçi olan Samet; sıcak çikolatayı, yapısal verileri ve tarihi çok sevip, strateji oyunlarına bayılır. Ayrıca Tayland'ı çok sevmektedir :)

4 Replies to “Open Graph (Facebook – X) Meta Etiketleri Nedir & Nasıl Kullanılır?”

  1. Merhaba Samet bey, Sorunumu çözdüm. Üstteki yorumu blogunuzdan bu yorumla birlikte güvenlik ve kişisel problemlerim nedeniyle kaldırırsanız şahsım adına teşekkür ederim. 😉 iyi yayınlar diliyorum.

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir