Open Graph Meta Etiketleri - Bilmeniz Gerekenler

Sosyal medya gönderilerinizin fark edilmesini ister misiniz?

Her gün 4 milyondan fazla blog yazısı yazıldığı için çalışmalarınızı sosyal ağlarda paylaşmak çok önemlidir. Open Graph, daha geniş bir kitleye ulaşmak için en önemli bileşenlerden biridir.

Herkes Open Graph'ın önemini bilmiyor. Peki nedir bu? Fark edilmenize nasıl yardımcı olabilir?

Open Graph Nedir?

“Open Graph meta tags, tıpkı meta descriptions ve başlıklar gibi, sosyal medyada paylaşıldığında URL'lerin nasıl yazılacağını yönetir.”

Facebook'un web siteleri arasında sosyal bilgileri standartlaştırma amaçlı Open Graph projesi sayesinde, sosyal ağ sitelerinde sayfa içeriğini tanımlamak daha kolaydır.

Bu etiketler, bir web sayfasının head bölümünde sayfanın başlığı, açıklaması ve öne çıkan görseli gibi bilgileri sosyal ağ hizmetlerine sağlar. Bu süreç, gösterilen bilgilerin tutarlılığını ve doğruluğunu korur.

Neden Open Graph Kullanmalısınız?

Open Graph, çeşitli sosyal ağlarda desteklenmektedir, örneğin:

• Facebook;
• Twitter/X;
• Pinterest;
• Viber;
• Telegram;
• WhatsApp.

Google'a göre, protokol “Önerilen İçerik Blokları”nı iyileştiriyor.

Open Graph kullanılmazsa ne olur?

Facebook önizlemede ne göstereceğinden emin olmadığı için bulduğu herhangi bir görseli kullanabilir (hatta bir reklam banner'ını veya başlığınızdan bir şeyi alabilir).

Sonuç olarak, Facebook önizlemenin hangi bölümlerini göstereceğini belirleyemez.

• Open Graph, sosyal medya ile ilgili web siteleri için önizlemeler oluşturur.
• Open Graph etiketleri, kişilerin sosyal akışlarda materyal bulmasına yardımcı olur, bu da sağlar artan site ziyaretleri.

Ziyaretçiler web sitenizin sayfasında aşağı kaydırdıkça, materyaliniz ne kadar yukarıda görünürse o kadar çok dikkat çeker. Bu, kullanıcıların tıklamadan önce bir önizleme almasını sağlar.

OG etiketlerini kullanarak insanların Facebook ve diğer sosyal medya platformlarında materyalinizi bulmasına yardımcı olun.

OG meta elementleri, protokolü kullanan sitelerde URL'ler özel konuşmalarda paylaşıldığında snippet'ler oluşturmak için kullanılır.

Open Graph protokolünün işletmeniz için önemi

Bu tür bir etkileşim, Facebook'un Open Graph protokolü ile basitleştirilmiştir. Open Graph işaretlemesi, önizleme verilerini düzenleme ve izleme yöntemidir. Kendi sosyal ağlarınız dışındaki sosyal ağlarda materyalinizin nasıl görüntülendiği üzerinde tam kontrol sahibi olmanızı sağlar.

Entegrasyonu kolaylaştırmak için, Facebook'un standart özellik setini paylaşan zengin grafik nesneleri oluşturuldu. Facebook, harici kaynaklardan gelen bilgi akışı üzerinde kontrole sahiptir (veya beğenilenler vb.). Bu bilgiler, bir web sitesinin başlığından geçerken Open Graph meta etiketleri tarafından sağlanır.

Birçok kişi bir sayfaya sosyal medya aracılığıyla eriştiği için Open Graph etiketleri her zamankinden daha önemlidir. Arama iyileştirildiğinde CTR artabilir. Open Graph, sosyal medya paylaşım sürecini kolaylaştırır. Open Graph, sosyal ağ sitelerinde geniş çapta desteklenmektedir. Twitter/X'in Open Graph etiketleri iyi bir örnektir; Twitter/X, Open Graph'ı destekler.

Peki bu tam olarak ne anlama geliyor?

Sunucu tarafı içeriğinizi Open Graph kullanarak etiketlemeye neden zahmet edesiniz ki? Ek etiketlerin web sitenizin performansını artırma ve daha fazla ziyaretçi çekme potansiyeli var mı? İşte Open Graph'ın büyük bir fark yaratabileceğine inanmamızın bazı nedenleri.

En önde gelen sosyal ağlar Open Graph etiketlerini kullanır

Eğer HTML öğrenmeye zamanınız yoksa, bunun yerine Facebook Open Graph etiketlerini kullanabilirsiniz. Bu etiketleri, tüm ana sosyal ağ sitelerinde görünen adları, açıklamaları ve fotoğrafları kişiselleştirmek için kullanabilirsiniz.

Open Graph etiketleri gerçekten sosyal medya içindir

Open Graph, sosyal ağ içinde bilgi örneklerini görüntülemek için tasarlanmıştır. Bilgiyi sadece bir web sayfasını paylaşmanın ötesinde yollarla düzenler.

Optimize edilmiş görseli öne çıkarın

Sosyal önizlemenizde hangi görselin görünmesi gerektiğini belirtmek için Open Graph etiketlerini kullanabilirsiniz. Varsayılan seçeneği seçmek zorunda değilsiniz. Blog yazınıza veya web sitenize giden bağlantılar iyi görünüyorsa, insanlar tıklamaya daha yatkın olurlar.

Bu, sosyal önizlemelerle ilgili, arama önizlemeleriyle değil

Hem arama motoru optimizasyonu hem de sosyal medya pazarlaması çok önemlidir, ancak farklı gereksinimleri vardır. Open Graph bileşenleri eski bir SEO sorununu çözdü: sosyal ağ gönderilerinin önizlemelerinin çekici olmayan başlık ve açıklamalara sahip olması gerçeğini.

İçeriğin arama motorları ve sosyal ağlar için optimize edilmesi için sayfa başlığı, meta descriptions ve open graph başlığı, açıklaması, URL ve görsel etiketlerinin tümü benzersiz olmalıdır.

Materyaliniz üzerinde kontrol sahibisiniz

Materyalinizi kendiniz yayınlasanız da başkası yayınlasa da, sosyal medyada nasıl görüneceği üzerinde tam kontrole sahipsiniz.

Her sosyal medya gönderisini kişiselleştirseniz bile, müşterilerinizin çoğu önizlemeyi göz ardı edecektir. Open Graph etiketleriniz olabilecek en iyi şekildeyse, materyalinizi paylaşmayı seçen ziyaretçiler bunu iyi seçilmiş bir görsel, başlık ve açıklama ile yapacaktır. Bu çok önemlidir çünkü işletmeniz hakkında yayılan bilgiler üzerinde tam kontrole sahipsiniz.

Open Graph etiket türleri

og:title, og:image, og:type ve og:url gibi Open Graph etiketleri, sosyal ağ platformlarının bilgilerinizi görüntülemesini sağlar. Bu kritik etiketleri kullanmanız gerekir, ancak başkalarını da kullanabilirsiniz.

og:image, og:url, og:title ve og:description bileşenlerine bağlantılar içeren bir Facebook ekran görüntüsü.

og:site_name

og:site_name etiketi, içeriğinizin bulunabileceği alanı içermelidir. Sonuç olarak, meta başlıkta yer alacak olan marka adını değiştirir (ve bu nedenle og:title tag).

og:site_name etiketi sitenizin veya markanızın adını içermeliyken, og:title etiketi makalenizin başlığını içermelidir.

og:site_name Kodu <meta property="og:site_name" content="Your Site Name" />

Tüm web sitenizde aynı site adı etiketini kullanın.

og:title

og:title etiketi, sayfanın başlığını ayarlamak için önerilir. SEO'da meta başlıkların nasıl kullanıldığına benzer. Mevcut bir meta başlık kullanırken, og:title alanını markanıza veya web sitenize özel herhangi bir içerikten arındırdığınızdan emin olun.

og:title Kodu <meta property="og:title" content="Title" />

Bu etiket, bir kullanıcının Facebook, Twitter/X veya başka bir sosyal ağ sitesinde paylaşmak isteyebileceği web sitenizin herhangi bir sayfasında görünmelidir.

Başlığı 40 ila 50 karakter uzunluğunda tutun; aksi takdirde kesilecektir.

Daha fazla kişinin web sitenizi ziyaret etmesini istiyorsanız, başlık sadece açıklamakla kalmamalıdır.

Arama motoru meta başlıklarından farklı olarak, alan adınızı veya sizi tanımlamak için kullanılabilecek başka herhangi bir bilgiyi eklememelisiniz.

og:type

Gönderilen materyalin türünü belirtmek için og:type etiketini kullanın. Bu, sosyal ağ sitesine bir blog yazısı, web sayfası, video veya ses dosyası gibi paylaştığınız içeriğin türünü bildirir.

og:type Kodu <meta property="og:type" content="article" />

Blog yazıları gibi açıklama gerektiren bilgiler için makale nesne türünü kullanın.

Web sitesi türünü web sitesinin diğer sayfalarına ekleyin.

Hem metin hem de ses veya video içeren bir dosyayı aktarmak istiyorsanız doğru dosya biçimini kullanmalısınız. Bu sayfa tüm Nesne Kategorilerinin bir listesini içerir.

og:locale

og:locale etiketi, aktarılan materyalin yazıldığı dil hakkında bilgi sağlar. Sosyal ağ sitesi kullanıcıları, web sitelerinde yayınlanan içeriğin birden çok dilde görülebileceği konusunda bilgilendirilmelidir.

og:locale Kodu <meta property="og:locale" content="en_GB" />

Facebook, og:locale etiketi olmayan her şeyin Amerikan İngilizcesi ile yazıldığını varsaydığı için, Amerika Birleşik Devletleri'nde tamamen İngilizce materyalden oluşan bir web sitesi işletiyorsanız, bu etiketi (en_US) göz ardı etmekte özgürsünüz.

Sağladığınız içerik Amerikan İngilizcesi dışında bir dilde yazılmışsa, doğru OG etiketini kullandığınızdan emin olun.

og:url

İçeriği nerede yayınlamak istediğinizi belirtmek için sadece og:url etiketini kullanın.

og:url Kodu <meta property="og:url" content="https://www.yourdomain.com/title.html" />

Bu etiket, sayfanın canonical URL'sini sağlamalıdır.

og:description

Bir og:description etiketine dahil edilen ifade, okuyucuları bir web sitesini ziyaret etmeye teşvik etmek için kısa, karmaşık olmayan ve mümkün olduğunca ilgi çekici olmalıdır.

Bu etiket, arama motorları tarafından kullanılan bir etikete benzediği için, ilgili olduğu sürece bilgiyi yeniden kullanmakta özgürsünüz.

og:description Kodu <meta property="og:description" content="Your description." />

Açıklamanızı 50 ila 100 karakter uzunluğunda tutabilirseniz faydalı olacaktır. Facebook gönderileri en fazla iki ila dört kelime arasında olmalıdır; dört kelimeden uzun gönderilerin silinme olasılığı daha yüksektir.

Sağladığınız materyale en çok tıklama ve dikkat çekmek için, verdiğiniz açıklama mümkün olduğunca ayrıntılı ve ikna edici olmalıdır.

og:image

Sosyal alıntıda kullanılacak görselin URL'sini og:image elementi ile belirtin. İnsanların web sitenize tıklama olasılığını artırmak için hem ilgi çekici hem de makalenin içeriğiyle doğrudan ilgili bir görsel kullanın.

Bu OG elementi, görsel schema markup gibi işlev görür ve arama motorları tarafından zengin sonuçlar sağlamak için kullanılır.

og:image Kodu <meta property="og:image" content="https://yourdomain.com/wp-content/uploads/your-image.png" />

Web sitenizin paylaşılabilir sayfalarının görsel arama motoru optimizasyonunda daha üst sıralarda yer almasını istiyorsanız, markanıza uygun yenilikçi fotoğraflar kullanın. Bir sayfanın sık sık paylaşılması olası olmasa bile, gelecekte birisi paylaşırsa logonuzla markalamak akıllıca bir fikirdir.

Pikselli veya düşük kaliteli görünmemek için orijinal görselinizin 1.91:1 en boy oranına ve en az 1200'e 630 piksel çözünürlüğe sahip olması gerekir.

og:image:width ve og:image:height etiketleri, daha önce paylaşılan görsellerin düzgün görünmesini sağlar. Bunları otomatik olarak eklemek için henüz yapmadıysanız WordPress sitenize Yoast'ı kurun. Henüz yapmadıysanız, işte kod:

<meta property="og:image:width" content="1200" /> <meta property="og:image:height" content="630" />

WordPress'e Open Graph Ekleme

WordPress'e OG etiketleri eklemek, Yoast SEO eklentisi ile bunu başarmanın en kolay, en yaygın ve en basit yoludur. Siteniz arama motorlarının kolayca bulabileceği şekilde ayarlanmışsa bu eklenti zaten yüklü olmalıdır.

Open Graph'ın eklenmesi gereken sayfayı veya makaleyi Yoast SEO'nun “sosyal” seçeneğini kullanarak güncelleyin.

Facebook akordeonundaki og:image, og:title ve og:description kutularını doldurun.

Yoast, og:url etiketinizi, Twitter/X Kartınızı ve görsel boyutlarınızı sizin için yapılandıracaktır. Yoast'a belirli bir görsel kullanmasını söylemezseniz, gönderinin ana görselini kullanacaktır.

Web siteniz paylaşıldığında, varsayılan olarak hiçbir görsel görüntülenmez. Bunu, tüm sitenin bir ekran görüntüsünü sağlayarak değiştirebilirsiniz. Bu hata, bir görsel URL'sinin og:image etiketinden yoksun olması durumunda meydana gelir.

Yoast'ın ana ayarlar sayfasında, site genelindeki og:image'ı seçebilirsiniz.

WordPress blogunuza OG etiketleri eklemek gerçekten çok kolay. Sadece şuraya gitmeniz yeterli:

WordPress Kenar Çubuğu : Yoast>Sosyal>Facebook.

Anahtarı açın ve ardından mevcut görseli kaydedin. Bir logo seçmeniz gerektiğine inanıyoruz. Aynı şeyi Twitter/X ve Pinterest için de yapabilirsiniz.

Open Graph'ı Manuel Olarak Ekleme

Kodlamayı biliyorsanız ve önceki sistemlerden birini kullanmıyorsanız, OG etiketlerini yüklemek basittir.

Aşağıdaki içeriği web sitenize kopyalayıp yapıştırabilirsiniz, ancak lütfen ihtiyaçlarınıza göre düzenleyin.

<meta property="og:site_name" content="INSERT SITE NAME" /> <meta property="og:title" content="INSERT TITLE" /> <meta property="og:description" content="INSERT DESCRIPTION" /> <meta property="og:url" content="INSERT URL" /> <meta property="og:type" content="INSERT TYPE" /> <meta property="og:image" content="INSERT IMAGE URL" /> <meta property="og:image:width" content="1280" /> <meta property="og:image:height" content="640" /> <meta property="twitter:card" content="summary_large_image" /> <meta property="twitter:image" content="INSERT IMAGE URL" />

Open Graph meta etiketlerinizi test etme

Web sitenize bir Open Graph'ı nasıl dahil edeceğinizi anladığınızı varsayalım.

Web siteniz doğru şekilde sınıflandırılmışsa, sosyal medyada paylaşıldığında mükemmel görünmelidir. Çalışmanızı her zaman halka sunmadan önce test edin.

Bir URL'yi paylaşmadan önce, OG etiketlerinizin doğru şekilde çekildiğini ve gösterildiğini iki kez kontrol edin.

Bu araçlar OG etiketlerinizi test etmek için faydalı olabilir:

• Pinterest Rich Pins Validator
• Twitter/X Card Validator
• Facebook Sharing Debugger
• LinkedIn Post Inspector

Orijinal meta etiketleri almak için bu hizmetlerden herhangi birine bir URL girmeniz yeterlidir. Paylaştığınızda, başkalarına nasıl görüneceği hakkında bir fikir edineceksiniz.

Devam etmeden önce önizlemenin görselini, başlığını ve açıklamasını inceleyin. İhtiyaç duymadığınız etiketler hakkında uyarılar alabilirsiniz, bunları ekleyebilir veya göz ardı edebilirsiniz.

URL testi başarısız olursa, farklı bir etiketle tekrar denemelisiniz. Her aracın çalışır durumda olduğunu URL'sini ziyaret ederek kontrol edin. Bittiğinde bunun hakkında konuşabilirsiniz.

Karar

Sosyal medyada paylaştıklarınız üzerinde kontrol sahibi olmak çok önemlidir. Open Graph'ta zengin öğeler gösterildiğinde trafik ve dönüşüm oranları artar. Tek bir blog yazısından başlayın. Sonucu gördüğünüzde, gelecekteki sonraki gönderilerinizde Open Graph etiketlerini uygulamak çok daha kolay olacaktır.

Sıkça sorulan sorular