Giriş schema.org

Herhangi bir web yöneticisi HTML işaretlemesine çok aşinadır. Genellikle HTML etiketleri, tarayıcıya etiketin içine alınmış bilgilerin nasıl görüntüleneceğini söyler. Örneğin, etiketi <h1>Resmi</h1> "Avatar" dizesinin birinci düzey başlık biçiminde görüntülenmesi gerektiği anlamına gelir. Ancak HTML etiketi, bu satırın anlamsal anlamı hakkında herhangi bir bilgi sağlamaz: "Avatar", son derece başarılı bir 3D filme veya kullanıcı profilindeki bir resme atıfta bulunabilir. Bu, arama motorlarının kullanıcının sorgusuna uygun bilgileri bulma görevini zorlaştırmaktadır.

Schema.org Web yöneticilerinin sayfaları en yaygın arama motorlarının anlayabileceği şekilde işaretleyebilecekleri halka açık bir sözlük sağlar (Yandex, Google, Microsoft ve Yahoo!).

Sözlük schema.org ile birlikte kullanılır mikro verilerle (microdata formatı). Uzun vadeli hedef, desteklenen anlamsal biçimlendirme biçimlerinin listesini genişletmek olsa da, başlangıçta kullanılan mikro verilerdir. Bu kılavuz sizi mikro verilerle tanıştıracak ve schema.org ve sitelerinizin sayfalarına hemen işaretleme ekleyebileceksiniz.

Mikro verileri kullanarak içerik nasıl işaretlenir

Mikro veriler ne için?

Sitenizin sayfalarının içeriği, onları okuyan kişiler için açıktır, ancak arama motorlarının bunun ne hakkında olduğunu belirlemesi zordur. Sayfalarınızın HTML koduna özel etiketler ekleyerek, "Hey, arama motoru, işte burada böyle bir film (yer, kişi, video) anlatılıyor" diyorsunuz. Bunu yaparak, arama motorlarının ve diğer uygulamaların içeriğinizi daha iyi anlamasına ve uygun, faydalı bir şekilde görüntülemesine yardımcı oluyorsunuz. HTML5'TE ortaya çıkan bir dizi etiket olan mikro veriler, tam olarak bunu yapmanıza izin verir.

itemscope ve itemtype

Somut bir örnekle başlayalım. Diyelim ki Avatar filmi hakkında bir sayfamız var — fragmana bir bağlantı, yönetmenle ilgili bilgiler vb. HTML kodu şöyle görünebilir:

<div>
    <h1>Resmi</h1>
    <span> Yönetmen: James Cameron (d. 2008 16 Ağustos 1954) </span>
    <span> Kurgu </span> 
    <a href="../movies/avatar-theatrical-trailer.html">Fragman</a>
</div>

Her şeyden önce, sayfanın hangi bölümünün doğrudan Avatar filmine ayrıldığını belirtmeniz gerekir. Bunu yapmak için özniteliği ekleyeceğiz itemscope Bu bilgilerin kapsandığı HTML etiketine:

<div **itemscope**>
    <h1>Resmi</h1>
    <span> Yönetmen: James Cameron (d. 2008 16 Ağustos 1954) </span>
    <span> Kurgu </span>
    <a href="../movies/avatar-theatrical-trailer.html">Fragman</a>
</div>

Ekleyerek itemscope, böylece bloğun içerdiği HTML kodunun <div>...</div>, bazı varlıkları tanımlar.

Şimdiye kadar, bunun bir varlıkla ilgili olduğunu yeni duyurduk, ancak bu varlığın ne olduğunu açıklamadık. Varlık türünü belirtmek için özniteliği ekleyelim itemtype hemen ardından itemscope.

<div itemscope **itemtype="http://schema.org/Movie"**>
    <h1>Resmi</h1>
    <span> Yönetmen: James Cameron (d. 2008 16 Ağustos 1954) </span>
    <span> Kurgu </span>
    <a href="../movies/avatar-theatrical-trailer.html">Fragman</a>
</div>

Bununla, açıklaması etikette yer alan varlığın ne olduğunu açıklığa kavuşturuyoruz <div>, bir filmi temsil eder (tür hiyerarşisindeki Film türü schema.org ). Tür adları, bizim durumumuzda URL biçimindedir http://schema.org/Movie.

itemprop

Arama motorlarına Avatar filmi hakkında hangi ek bilgileri sağlayabilirim? Film hakkında birçok ilginç bilgi bildirilebilir: oyuncu kadrosu, yönetmen, derecelendirme. Bir varlığın özelliklerini işaretlemek için öznitelik kullanılır itemprop. Örneğin, filmin yönetmenini belirtmek için özniteliği ekleyeceğiz itemprop="director" Yönetmenin adını içeren HTML etiketine. (Film için ayarlayabileceğiniz özelliklerin tam listesi için lütfen aşağıdaki sayfaya bakın http://schema.org/Movie).

<div itemscope itemtype="http://schema.org/Movie">
    <h1 **itemprop="name"**>Avatar</h1>
    <span> Yönetmen:
        <span** itemprop="director"**>James cameron </span>
        (doğmuş. 16 Ağustos 1954) </span>
    <span **itemprop="genre"**>Kurgu </span>
    <a href="../movies/avatar-theatrical-trailer.html" **itemprop="trailer"**>Fragman</a>
</div>

Lütfen ek bir etiket eklediğimizi unutmayın <span>...</span> özniteliğini bağlamak için itemprop sayfadaki ilgili metne. Etiket <span> Sayfanın tarayıcıda görüntülenmesini etkilemez, bu nedenle sayfanın tarayıcıyla birlikte kullanılması uygundur. itemprop.

Artık arama motorları yalnızca neyin ne olduğunu anlayamayacak http://www.avatarmovie.com — Bu bir referanstır, ancak aynı zamanda James Cameron'ın yönettiği fantastik film Avatar'ın fragmanına bir referanstır.

İç içe geçmiş varlıklar

Bazen bir özelliğin değeri, kendi özelliklerine sahip bir varlık olabilir. Örneğin, bir filmin yönetmeni, özelliklere sahip Kişi türüne sahip bir varlık olarak tanımlanabilir name (isim) ve birthDate (doğum tarihi). Bir özelliğin değerinin bir varlığı temsil ettiğini belirtmek için bir öznitelik eklemeniz gerekir itemscope uygun olandan hemen sonra itemprop.

<div itemscope itemtype="http://schema.org/Movie">
    <h1 itemprop="name">Avatar</h1>
    <div **itemprop="director" itemscope itemtype="http://schema.org/Person "**>Yönetmen:
        <span itemprop="name">James Cameron tarafından </span>
        (doğmuş. <span itemprop="birthDate">16 Ağustos 1954) </span>
    </div>
    <span itemprop="genre">Kurgu </span>
    <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">Fragman</a>
</div>

Sözlük nasıl kullanılır schema.org

Türleri ve özellikleri schema.org

Bölümde belirtilen Film ve Kişi türleri dışında Mikro verileri kullanarak içerik nasıl işaretlenir, schema.org, her biri için bir dizi özelliğin tanımlandığı çok çeşitli varlık türlerini tanımlar.

En genelleştirilmiş varlık türü, Thing Dört özelliği olan (bir şey): name (başlık), description (açıklama), url (bağlantı) ve image (resim). Daha özelleşmiş, özel türler, daha çok yönlü olanlarla ortak özelliklere sahiptir. Örneğin, Place (yer) özel bir Şey durumudur ve LocalBusiness (yerel firma), Place'in özel bir durumudur. Özel türler, üst türün özelliklerini devralır. (Ayrıca, LocalBusiness türü hem özel bir Yer durumu hem de özel bir Organizasyon durumudur, bu nedenle her iki üst türün özelliklerini devralır.)

İşte bazı popüler varlık türlerinin bir listesi:

• Yaratıcı eserler: CreativeWork (yaratıcı çalışma), Book (kitap), Movie (film), MusicRecording (müzik kaydı), Recipe (tarif), TVSeries (televizyon dizisi)...

• Gömülü metin dışı nesneler: AudioObject (ses), ImageObject (resim), VideoObject (video)

• Event (etkinlik)

• Organization (organizasyon)

• Person (insan)

• Place (yer), LocalBusiness (yerel firma), Restaurant (restoran)...

• Product (ürün), Offer (teklif), AggregateOffer (özet cümle)

Ayrıca bakınız varlık türlerinin tam listesi aynı sayfada.

Beklenen türler, metin ve URL'ler

Sayfaları kullanarak işaretlemek schema.org, aşağıdaki önerilere uyun:

• Ne kadar büyükse o kadar iyidir — gizli metin hariç. Ne kadar çok içerik işaretlerseniz o kadar iyidir. Ancak genel bir kural olarak, yalnızca site ziyaretçilerinin görebileceği içerik işaretlenmeli, gizli etiketlerin içeriği işaretlenmemelidir <div> ve diğer gizli sayfa öğelerinin

• Beklenen türler veya metin. Türlere göz atmak schema.org, birçok özelliğin beklenen türlere sahip olduğunu fark edeceksiniz. Bu, özelliğin değerinin iç içe geçmiş bir varlık olabileceği anlamına gelir (bkz. İç içe geçmiş varlıklar). Ancak, iç içe geçmiş bir varlık eklemek gerekli değildir: yalnızca metin veya URL kullanmak kabul edilebilir.

  Ayrıca beklenen tür yerine bir alt tür de kullanılabilir. Örneğin, bir özellik için beklenen Yer türü belirtilmişse, LocalBusiness türünde iç içe geçmiş bir varlık ekleyebilirsiniz.

• Özelliğin kullanımı url. Bazı sayfalar yalnızca bir varlığın tanımına ayrılmıştır. Örneğin, Kişi varlık türü kullanılarak işaretlenebilen belirli bir kişinin kişisel sayfası. Diğerleri — bir dizi varlığa. Örneğin, şirketinizin web sitesinde, her birinin profiline bağlantılar içeren bir çalışan listesi vardır. Bu tür toplama sayfaları için, her bir varlığı ayrı ayrı işaretlemeniz gerekir (bu durumda, Kişi türüne sahip bir varlık dizisi elde edersiniz) ve bir özellik eklemeniz gerekir url her varlık için ilgili sayfaya bir bağlantıya, örneğin:

  <div itemscope itemtype="http://schema.org/Person">
      <a href="alice.html" itemprop="url">alice Jones</a>
  </div>
  <div itemscope itemtype="http://schema.org/Person">
      <a href="bob.html" itemprop="url">Bob Smith</a>
  </div>
  

İşaretlemeyi test etme

Tıpkı bir web sayfasının düzenindeki değişiklikleri kontrol etmek için tarayıcının ve kodu test etmek için derleyicinin gerekli olması gibi, işaretlemeyi schema.org ayrıca test edilmelidir. İnternette işaretlemenin doğruluğunu kontrol edebileceğiniz ve hataları tanımlayabileceğiniz birkaç araç vardır: Mikro işaretleme doğrulayıcı Yandex'den, Rich Snippets Testing Tool Google'dan, Structured Data Linter.

İsteğe bağlı: bilgilerin makine tarafından okunabilir versiyonu

Birçok sayfa yalnızca öznitelikler kullanılarak işaretlenebilir itemscope, itemtype ve itemprop bölümünde açıklanmıştır Mikro verileri kullanarak içerik nasıl işaretlenir türleri ve özellikleriyle birlikte schema.org bölümünde açıklanan Sözlük nasıl kullanılır schema.org.

Bununla birlikte, bazı durumlarda, bir robotun bir varlığın özelliğini kesin olarak yorumlaması zordur. Bu bölüm, bilgilerin makine tarafından okunabilir bir sürümünün sayfa işaretlemesine nasıl ekleneceğini açıklamaktadır.

Tarihler, saatler ve süre: etiketi kullanın <time> özniteliği ile datetime

Robotlar her zaman tarih ve saati doğru anlamayı başaramazlar. Örneğin, "04/01/11" 11 Ocak 2004, 4 Ocak 2011 mi yoksa 1 Nisan 2011 mi? Kesin bir tarih belirlemek için etiketi kullanın <time> öznitelikle birlikte datetime. Özniteliğin değeri datetime — formattaki tarih YYYY-MM-DD. Aşağıdaki HTML kodu, tarihi kesin olarak 1 Nisan 2011 olarak tanımlar.:

<time datetime="2011-04-01">**04/01/11**</time>

Günün saati şu biçimde belirlenir: hh:mm veya hh:mm:ss, ön eki ile T. Saat, tarihle birlikte belirtilebilir:

<time datetime="2011-05-08T19:30">**8 Mayıs, 19:30**</time>

Bağlam içinde bir örnek düşünün: 8 Mayıs 2011'de gerçekleşecek konserle ilgili bilgileri içeren HTML kodu Etkinlik türü işaretlemesi etkinliğin adını, açıklamasını ve tarihini içerir.

<div itemscope itemtype="http://schema.org/Event">
    <div itemprop="name">Spinal Tap</div>
    <span itemprop="description">Tüm zamanların en gürültülü müzik gruplarından biri unutulmaz iki gecelik bir gösteri için yeniden bir araya gelecek.</span> Konser gerçekleşecek
    **<time itemprop="startDate" datetime="2011-05-08T19:30">**8 Mayıs 19:30'da**</time>**
</div>

Süre etiketi kullanılarak benzer şekilde açıklanmaktadır <time> ve özniteliğinin datetime. Özniteliğin değerinden önce bir önek gelir P (ingilizceden. period). Örneğin, tarifte pişirme süresinin bir buçuk saat olduğunu aşağıdaki gibi belirtebilirsiniz:

<time itemprop="cookTime" datetime="PT1H30M">**1 ½ saat**</time>

H saat sayısını belirtir ve M — Dakika sayısı.

Tarih, saat ve süre formatları standarda uygundur ISO 8601.

Standart sayfalara numaralandırma ve bağlantılar: etiketi kullanın link özniteliği ile href

• Numaralandırmalar

  Bazı özelliklerin sınırlı sayıda olası değeri vardır. Programcılar onlara numaralandırma diyorlar. Örneğin, bir çevrimiçi mağaza bir varlık türü kullanabilir Offer ürün teklifinin ayrıntılı bir açıklaması için. Mülkiyet availability (varlık) genellikle birkaç olası anlamdan birine sahiptir: In stock (stokta), Out of stock (eksik), Pre-order Numaralandırılan özelliklerin değerleri, varlık türlerine benzer şekilde URL olarak belirtilebilir schema.org.

  İşte Teklif türünde bir varlık olarak işaretlenen ve uygun özelliklere sahip bir ürün teklifi:

  <div itemscope itemtype="http://schema.org/Offer">
      <span itemprop="name">Blend-O-Matic</span> <span itemprop="price">$19.95</span>
      <span itemprop="availability">Şimdi satışta!</span>
  </div> 
  

  Ve işte kullanılarak işaretlenmiş aynı cümle <link> ve href, bu da özelliğin izin verilen değerlerinden birini benzersiz bir şekilde belirtmeyi mümkün kılar availability:

  <div itemscope itemtype="http://schema.org/Offer">
      <span itemprop="name">Blend-O-Matic</span>
      <span itemprop="price">$19.95</span>
      <link itemprop="availability" href="http://schema.org/InStock "/> Satışta!
  </div>
  

  Schema.org Bir özelliğin sınırlı bir dizi tipik değere sahip olduğu durumlarda, az sayıda özellik için olası değerlerin bir listesini sağlar. Yani, bir özellik için olası değerler availability listelenmiştir ItemAvailability.

• Kanonik sayfalara bağlantılar

  Bağlantılar genellikle bir etiket kullanılarak oluşturulur <a>. Örneğin, Çavdardaki Catchless kitabının Wikipedia sayfasına aşağıdaki köprü:

  <div itemscope itemtype="http://schema.org/Book">
      <span itemprop="name">Çavdardaki uçurumun </span> üzerinde Yazar
      <span itemprop="author">Jerome Salinger </span>
      <a itemprop="url" href="http://en.wikipedia.org/wiki/The_Catcher_in_the_Rye ">Wikipedia sayfası</a>
  </div> 
  

  Gördüğünüz gibi, öznitelik itemprop="url" Aynı varlığı tanımlayan başka bir sitenin (bu durumda Wikipedia) sayfasına bağlantı vermek için kullanabilirsiniz. Üçüncü taraf sitelere bağlantılar, arama motorlarının sayfanızın neyle ilgili olduğunu daha iyi anlamasına yardımcı olur.

  Ziyaretçilerin görebileceği bir bağlantı eklemek istemiyorsanız etiketi kullanın <link> aşağıdaki gibi:

  <div itemscope itemtype="http://schema.org/Book">
      <span itemprop="name">Çavdardaki uçurumun üzerinde </span>
      <link itemprop="url" href="http://en.wikipedia.org/wiki/The_Catcher_in_the_Rye " /> Yazar <span itemprop="author">Jerome Salinger </span>
  </div> 
  

Eksik veya örtük bilgiler: Etiketi kullanın <meta> özniteliği ile content

Bazen sayfada görüntülenme şekli nedeniyle önemli bilgiler işaretlenemez. Örneğin, bilgiler şekilde (5 üzerinden 4 yıldız derecelendirmesinin resmi) veya bir Flash nesnesinde (örneğin, bir videonun uzunluğu) sunulur veya ima edilir, ancak sayfada açıkça belirtilmez (örneğin, fiyatın para birimi).

Bu gibi durumlarda etiketi kullanabilirsiniz <meta> özniteliği ile content. Aşağıdaki örnekte, resim 5 üzerinden 4 yıldız derecelendirmesini göstermektedir:

<div itemscope itemtype="http://schema.org/Offer">
    <span itemprop="name">Blend-O-Matic</span>
    <span itemprop="price">$19.95</span>
    <img src="four-stars.jpg" /> 25 puan
</div>

Ve işte sıralamayla ilgili işaretli bilgilerle aynı örnek.

<div itemscope itemtype="http://schema.org/Offer">
    <span itemprop="name">Blend-O-Matic</span>
    <span itemprop="price">$19.95</span>
    <div **itemprop="reviews" itemscope itemtype="http://schema.org/AggregateRating"**>
        **<img src="four-stars.jpg" />**** <meta itemprop="ratingValue" content="4" />**** <meta itemprop="bestRating" content="5" />**
        <span **itemprop="ratingCount"**>25 </span> puan
    </div>
</div>

Bu teknik kötüye kullanılmamalıdır. Etiketi kullan <meta> özniteliği ile content sadece başka türlü işaretlenemeyen bilgiler için.

Genişleme schema.org

Çoğu site ve kuruluşun genişletilmesi gerekmeyecektir schema.org. Yine de schema.org Mevcut varlık türleri için özellikler ve alt türler ekleme olanağı sağlar. Bununla ilgileniyorsanız, şuna bir göz atın: genişletme mekanizmasıyla schema.org.