Web sitenizin içeriği kullanıcılar için anlaşılabilir olmasına rağmen makineler için aynı şey geçerli değildir. İçeriği makineler için de anlaşılabilir hale getirmek için HTML koduna özel etiketler ekleyerek hangi içeriğin, hangi konu ile alakalı olduğunu belirtmek gerekir. İşte yapısal veri (structured data) bu noktada devreye giriyor.
Web sitenizin içeriği kullanıcılar için anlaşılabilir olmasına rağmen makineler için aynı şey geçerli değildir. İçeriği makineler için de anlaşılabilir hale getirmek için HTML koduna özel etiketler ekleyerek hangi içeriğin, hangi konu ile alakalı olduğunu belirtmek gerekir. İşte yapısal veri (structured data) bu noktada devreye giriyor.
Biraz geçmişe gidelim: Web 2.0
Web 2.0’ın hayatımıza girdiği ilk zamanları hatırlıyor musunuz? O’Reilly Media‘nın 2004 yılının sonlarında gerçekleştirdiği konferansta ilk defa Tim O’Reilly tarafından şöyle özetlenmişti:
“Web 2.0, bilgisayar endüstrisinde internetin bir düzlem olarak ilerlemesiyle bir işletme devrimi ve bu düzlemin kurallarını başarı için anlamaya çalışmaktır. Bu kurallar arasında başlıcası şudur: Ağ etkilerini daha çok insanın kullanabilmesi için programlar kurmak.”
Bu konferans ile aynı tarihlerde W3C (The World Wide Web Consortium) tarafından RDFa (Resource Description Framework in Attributes), kısa bir süre sonra ise Microformats duyuruldu. Burada küçük bir parantez açmalıyım; Microformats’ın kurucularından olan Tantek Çelik, Amerika’da yaşayan Türk asıllı bir bilgisayar uzmanı. Unvan Türkçede biraz tuhaf oluyor, farkındayım. Ancak ismini daha önce duymadıysanız araştırmanızı öneririm. RDFa, Microformats, Microdata ve JSON-LD farklı zamanlarda geliştirilmiş ve genelde aynı işi yapan semantik işaretlemelerdir. Yazıya, popüler olarak kullanılan Microdata ve JSON-LD ile devam edelim.
Bu içerik ücretsiz!
Okumaya devam etmek ve SHERPA Blog okuru olmak için aşağıdakilerden birini seç. Her hafta yenileri eklenen yüzlerce içeriğe ücretsiz ve sınırsız eriş.
Yazının girişinde yapısal verilerin hangi aşamada devreye girdiğinden söz etmiştik: Web içeriğini makineler için anlaşılabilir duruma getirmek için HTML koduna özel etiketler ekleme noktasında kullandığımız yapısal veriler insanlar, kuruluşlar, etkinlikler, yerler, blog yayınları, ürünler, incelemeler, özgeçmişler ve yemek tarifleri gibi alanlarda kullanılmakta. Yapısal verilerin en büyük katkısının SEO alanında olduğu kabul edilir. Fakat yapısal verilerin kullanım amacı öncelikle, bilgisayar haricindeki cihazların veya uygulamaların dahi bu verileri anlamlandırabilmesini ve işleyebilmesini kolaylaştırmaktır. Bir örnekle açıklamak gerekirse: Bir uygulama geliştiriyorsunuz ve amacınız birçok farklı kaynaktan aldığınız içerik aracılığıyla mekanların adreslerini listelemek. Anlamsal veri ile işlenmemiş, birden fazla dil seçeneği olan farklı web sitelerinden birbirinden farklı yazılmış anlamsız HTML yapılarını ve farklı formatlarda yazılmış adresleri çekip öncelikle işlemeniz gerekiyor. Bu içeriği düzgün bir şekilde işleyebilmek ve testlerini yapabilmek için oldukça fazla kod yazmanız ve farklı algoritmalar geliştirmeniz de gerekiyor. Bu tarz bir geliştirme esnasında hem zaman kaybınız hem de bu işin size maliyeti yüksek olacaktır.
Zomato kaynak kodu
Bu uygulamayı bir de tüm sitelerde anlamsal veri ile işlenmiş şekilde düşünelim: Tüm web sitelerini geliştirdiğiniz altyapı ile ziyaret ettiniz ve adres bilgilerini topladınız. Bu adresleri almak için ise adres, sokak, cadde, numara, telefon, posta kodu, il ve ilçe gibi, her web sitesinin HTML’inde önceden aynı şekilde işaretlenmiş içeriği almanız yeterli.
Microdata içinde beş temel özellik barındırır. Bunlar; itemprop, itemscope, itemtype, itemid ve itemref. itemscope ve itemtype, microdata’nin en temel iki özelliğidir.
itemscope: Bu özelliği bir container görevi gören HTML elementine microdata kullanmaya başladığımızı bildirmek için kullanırız.
itemtype: Itemscope ile birlikte aynı HTML elementine eklenerek kullanılır. Itemscope’dan farkı ise schema.org adresi altında bulunan ilgili alanın URL olarak eklenmesidir.
itemprop: Bir maddenin özelliklerini etiketlemek için itemprop özelliğini kullanırız.
itemid: İşaretleme yaptığımız içeriğe benzersiz bir tanımlama yapmak için kullanırız.
itemref: Bir web sitesinde farklı alanlarda yer alan, birbiriyle ilişkili içerikleri ilişkilendirmek için kullanırız.
Makineler için anlamlı içerik üretmek
Aşağıdaki örnek HTML kodunu sherpa.digital web sitesinden aldım. İlk bakışta bizim için anlamlı olan bu içerik makineler için son derece anlamsız.
Şimdi bu adresi makineler için de anlaşılır hale getirecek ufak bir örnek hazırlayalım: Bu kod blogu içinde bir adres olduğunu itemscope ve itemtype özelliklerini kapsayıcı HTML elementi olan adress etiketine ekleyerek tanımlıyoruz.
Şimdi de adresin ek özelliklerini itemprop ile tanımlayalım. Bu ek özellikleri itemtype alanında da verdiğimiz şu link içinden görebilir ve daha fazla örnek inceleyebilirsiniz. itemprop sayesinde adresimize sokak, semt/eyalet, il/bölge ve telefon numaraları ekledik.
Böylece insanlar için anlamlı olan içeriğimiz, makineler için de anlaşılır bir içerik oldu. Bir de yukarıdaki örneği kullanarak iç içe geçmiş örnek hazırlayalım: Bu adresi tek bir kişiye bağlayacağız. Person şemasını kullanarak başlıyoruz. Yani öncelikle bir kişi işaretlemesi yapacağımızı bildiriyoruz ve bu kişiye ait isim, fotoğraf, unvan, adres ve e-posta tanımlamalarını yapıyoruz. Adres işaretlemesini ise yine yukarıdaki örnekte olduğu gibi yapıyoruz. Ancak burada dikkat edilmesi gereken tek bir fark var: Bu adres artık Oğuzcan Şahin’in, yani benim özel adresim olarak işaretleniyor.
Microdata hangi alanlarda kullanılır?
Kullanım alanı çok geniş olmakla birlikte Microdata’nın kullanılabileceği başlıca popüler alanlar schema.org tarafından aşağıdaki gibi listelenmiştir:
Yaratıcı çalışmalar: CreativeWork (yaratıcı çalışma), Book (kitap), Movie (film), MusicRecording (müzik kaydı), Recipe (yemek tarifi), TVSeries (TV dizisi),…vb.
Aramızda, Google’da arama yapıldığında çıkan hızlı sonuçları bilmeyen yoktur sanıyorum. Arama sonuçlarında karşımıza site içi arama bölümü, navigasyon, sitede yer alan birürünün stok durumu, fiyatı, görseli gibi birçok detay bilginin çıkması yine işlenmiş yapısal veriler sayesinde mümkündür.
Daha anlaşılır olması için yine bir örnek hazırlayalım Ünlü aşçı Jamie Oliver‘ın web sitesinden Türk usulü kuskus tarifini JSON-LD formatında hazırlayalım ve Google arama sonuçlarında yapım süresi, fotoğraf ve kalori miktarını gösterelim.
Öncelikle kodumuzu HTML sayfamizin “<head></head>” tagleri arasina ekliyoruz. Script tagleri arasına yazdığımız JSON-LD işaretlememizde neler yaptığımıza bakalım (Burada JSON yapısının anlaşılır olduğunu varsayarak devam ediyorum): Öncelikle @context özelliğiyle schema.org‘u kullanacağımızı bildirdik, @type özelliğiyle de hangi işaretlemeyi yapacağımızı bildiriyoruz. Bu kullanımın microdata karşılığına zaten değinmiştik. (Bknz: itemtype=”Recipe”) İşaretleme tipini belirledikten sonra, bu tipe ait ek özellikleri de yazmamız gerek. Yemek tariflerine ait name, image, author, description, totalTime, datePublished, nutrition özelliklerini; nutrition özelliğinin alt özelliği olarak da calories kullanıyoruz. Hazırladığınız örneğin önizlemesini Google’ın yapısal veri test aracı ile görebilirsiniz. Önemli!: Bu örnekte kullandığımız tarih özelliğinde uluslararası standartlara uymak gerektiğini belirtmekte fayda var. Bu konu hakkında detaylı bilgiye bu ve şu sayfalardan ulaşabilirsiniz.
Google için daha fazlası
Google’ın Gmail, Inbox By Gmail ve Calendar servislerini kullanıyor musunuz? Eğer kullanıyorsanız bir uçak bileti aldığınızda, rezervasyon yaptırdığınızda ya da bir web sitesinde e-bülten aboneliğine kayıt olduğunuzda posta kutunuza gelen e-postayı henüz açmadan hızlı aksiyon almanızı sağlayan küçük butonları ya da özet açıklamaları görmüş olmalısınız. Peki, Google bunları nasıl anlıyor? Cevabı yine schema.org. Gönderilen e-postaları Microdata veya JSON-LD ile Google’ın belirlediği standartlara göre işaretlediğinizde kullanıcıların hayatlarını kolaylaştırabilir ve posta kutularında daha üst sıralarda çıkabilirsiniz. Önemli!: Bu özellikleri kullanabilmek için Google’a kayıt olmak gerekiyor. Buradaki link üzerinden kayıt hakkında bilgi alabilirsiniz.
Gmail için:
RSVP Action: Etkinlikler için
Review Action: Restoranlar, filmler, ürünler ve servisler
One-Click Action: Tek tıklama ile gerçekleştireceğiniz her şey
Go-to Action: Daha karmaşık etkileşimler için
Flight Interactive Cards: Uçuş rezervasyonları için.
Inbox By Gmail
Aşağıda bulunan, kendine has eylemleri haricinde Gmail’in desteklediği tüm eylemleri de desteklemektedir.
Uçuş rezervasyonları için daha detaylı bilgiler
Etkinlikler için daha detaylı bilgiler
Alışveriş için ödemeler ve sipariş durumları
Otel rezervasyonları için daha detaylı bilgiler
Restoranlar için daha detaylı bilgiler
Google Calendar
Uçuş rezervasyonları
Etkinlikler
Otel rezervasyonları
Restoran rezervasyonları
Yapısal veri işleme ile Google’da yapılabilecekler oldukça geniş bir konu olduğu için daha detaylı bilgiyi Google Developers adresinden alabilirsiniz.
Gelecek ve yapısal veri
Microsoft Cortana ya da Apple Siri gibi kişisel asistanlar, giyilebilir cihazlar ve bunun gibi sürekli yetenekleri artan makinelerden ve uygulamalardan beklentilerinizi bir düşünün. Bir sonraki toplantınızı size hatırlatan bir uygulama, acıktığınızda sesli bir komutla en yakın restoranı size öneren bir ürün, tatil için aldığınız uçak biletini ve ona bağlı olarak havalimanına gideceğiniz saati baz alarak trafik durumunu size sunan e-posta kutunuz var. Tüm bu işlemleri yapabilmek, veriyi daha akıllı kullanabilmek için makineler arka tarafta microdata, JSON-LD gibi yapısal verilere ihtiyaç duymakta ve veriyi bu standartlara göre işlemekte. Yukarıda sıralanan deneyimleri bize yaşatabilmek için yapısal veri kullanan, günlük hayatımızın bir parçası haline gelmiş cihaz ve uygulamalardan bazıları ise şöyle:
Microsoft’un kişisel asistanı Cortana
Apple’in kişisel asistanı Siri ve iOS search alt yapısında kullanılan Apple Spotlight
Google Search, Gmail, Gmail by Inbox, Google Calendar
Teknik SEO anlamında okuduğum ya da anlatılanlardan çok farklı ve çok daha yararlı bir yazı. Teşekkürler.