• 0

Microdata Nedir?

1 ay önce , Okuma süresi 2 dakika.

HTML standartları olan MicroData hakkında detaylı bilgiler içeren bir makale ile karşınızdayım.
Microdata Nedir?

Microdata, web sayfalarındaki zengin meta verileri açıklamak için WHATWG tarafından oluşturulan bir HTML standardıdır . Bu zengin meta veriler, web sayfasının içeriğini daha iyi anlamak için arama motorları veya diğer bilgisayar sistemleri tarafından kullanılabilir.

Mikro veriler itemscopeitemprop ve itemtype dahil olmak üzere bir dizi öznitelikten oluşur. Aşağıda, Microdata kullanan temel bir web sayfası örneği bulunmaktadır.

<html>
  <head>
    <title>What is Microdata?</title>
  </head>
  <body itemscope itemtype="https://schema.org/WebPage">
    <article itemscope itemtype="http://schema.org/Article" itemprop="mainEntity">
      <meta itemprop="url" content="https://brandvantage.co/blog/what-is-microdata">
      <meta itemprop="image" content="https://brandvantage.co/blog/2020/images/what-is-microdata-cover.png">
      <h1 itemprop="name headline">What is Microdata?</h1>
      <time itemprop="datePublished" datetime="2020-09-20">20th of September, 2020</time>
      <div itemprop="articleBody">
        Hello and welcome to this example!
      </div>
    </article>
  </body>
</html>

"itemprop" Attribute

Nitelik verileri için bir ad-değer çifti tanımlar. Mülkle ilişkili değer şunlardan türetilebilir:

  • Etiketin iç metin içeriği
  • content attribute, (tanımlanmışsa)
  • src attribute(için imgaudiovideoiframevb etiketleri)
  • href attribute(için linkveya aetiketleri)
  • value attribute(için dataveya meteretiketleri)
  • datetime (İçin attribute time etiketleri)

Bir öğe özelliği, itemscope attribute kullanımı yoluyla bir grup ad-değer çifti de içerebilir. Ek olarak, itemprop öznitelik üzerindeki değer birden çok özelliğe atıfta bulunabilir.

itemprop'u yukarıdaki örnekte birkaç farklı olarak kullanımını görebilirsiniz.

Özellikleri Birlikte Gruplama

<article itemscope itemtype="http://schema.org/Article" itemprop="mainEntity">

itemscope Burada öznitelik kullanımıyla , "mainEntity" özelliği, diğer ad-değer çiftlerini birlikte gruplandırıyor.

Bir "content" özelliğinden alınan değer;

<meta itemprop="url" content="https://brandvantage.co/blog/what-is-microdata">
<meta itemprop="image" content="https://brandvantage.co/blog/2020/images/what-is-microdata-cover.png">

Bu örnekte de content öznitelikten tanımlanan iki özelliğimiz ("url" ve "image") taglarını görebilirsiniz.

Aynı Anda İki Özelliği Ayarlama;

<h1 itemprop="name headline">What is Microdata?</h1>

Burada iç metinden değerle ( "name" ve "headline") aynı anda iki özelliklerini kullandığını görebilirsiniz. 
itemprop özniteliğini (attribute)'i tarih saat içindeki metinin özelliği gibi niteliklerle kullanabilirsiniz. 

"itemtype" Attribute

Özelliklerin değerlerinin ayarlanmasına yardımcı olurken , hangi özelliklerin bekleneceğini tanımlayan bir yöntem olmadan, kullanışlılık sorgulanabilir. Bu itemtype, kelimeyi tanımlayan bir URL aracılığıyla kullanılan özelliklere bağlantı vererek devreye giriyor.

Google, Microsoft, Yahoo ve Yandex arasında ortak bir girişim olan Schema.org , yaygın olarak kullanılan bir özniteliktir. Schema.org gibi paylaşılan bir kelime haznesi, verileri kullanmak isteyen veya buna ihtiyaç duyan üçüncü taraflar için birlikte çalışabilirliği kolaylaştırır. Bununla birlikte, sizi diğer kelimeleri kullanmaktan ve hatta kendi sözcüklerinizi oluşturmaktan alıkoyan hiçbir şey yoktur. Üçüncü bir taraf kelime dağarcığınızı anlamazsa, meta verileriniz işlenip kullanılmayabilir.

Yukarıdaki HTML sayfa kodlarında aşağıdaki iki satır kod dikkatini çekmiştir. 

  <body itemscope itemtype="https://schema.org/WebPage">
    <article itemscope itemtype="http://schema.org/Article" itemprop="mainEntity">

Burada itemscope attribute yukarıda zaten tanımlamıştık ancak ikinci attribute olan itemtype az önce de bahsettiğimiz gibi Shema.org standartlarını sayfa içeriğine tanımlayan değerler almaktadır. 

SEO'ya katkısı son zamanlarda trend haline gelen microdata örneklerini sayısız çoğaltabiliriz. Bunun için aşağıda vereceğim kaynaklara da bakmanızda yararlar olacaktır. 

#html