środa, 2 października 2013

microdata ,itemscope ,itemtype

 Jak oznaczyć zawartość za pomocą microdata 

1.Co to jest microdata:

Kiedy czytasz strone bądz wstęp do niej wisz o czy jest w zasadzie . Ale wyszukiwarki  mają ograniczoną wiedzę o tym,nie wiedzą o czym się dyskutuje na tych stronach.

 Dodając dodatkowe znaczniki w kodzie HTML swojej strony internetowej które mówią: "Hej wyszukiwarka", informacja ta opisuje ten szczególny film, lub miejsca, lub osoby lub wideo"-możesz pomóc wyszukiwarkom  i innych aplikacjiom w lepszym zrozumieniu treści strony i wyświetlić go w użyteczny, sposób. microdata jest to zestaw znaczników, wprowadzony z HTML5, który pozwala to zrobić.

itemscope oraz itemtype

Zacznijmy od konkretnego przykładu. Wyobraź sobie, masz stronę o avatar-fil strony z linkiem do treści filmu, informacje o reżyser, i tak dalej. Kod HTML może wyglądać następująco:
<div>
  <h1> Avatar </ h1>
  <span> Reżyseria: James Cameron (ur. 16 sierpnia 1954) </ span>
  <span> Science fiction </ span>
  <a href="../movies/avatar-theatrical-trailer.html"> Trailer </ a>
 </ Div>
Aby rozpocząć, zidentyfikować fragment strony, który jest "o" Avatar film. Aby to zrobić, należy dodać element itemscope do HTML, który otacza informacje na temat przedmiotu poszukiwań, tak:
<div itemscope>
   <h1> Avatar </ h1>
   <span> Reżyseria: James Cameron (ur. 16 sierpnia 1954) </ span>
   <span> Science fiction </ span>
   <a href="../movies/avatar-theatrical-trailer.html"> Trailer </ a>
 </ Div>
Dodając itemscope , użytkownik określa, że HTML zawarte w <div>...</div> blok o konkretnej pozycji.Ale to nie wszystko, co przydatne do określenia, że ??istnieje element który chcemy pokazać przeglądarce Możemy jeszcze zaznaczyć, jakiego rodzaju jest to element. Można określić typ elementu za pomocą itemtype atrybut natychmiast po itemscope
<div itemscope itemtype="http://schema.org/Movie">
   <h1> Avatar </ h1>
   <span> Reżyseria: James Cameron (ur. 16 sierpnia 1954) </ span>
   <span> Science fiction </ span>
   <a href="../movies/avatar-theatrical-trailer.html"> Trailer </ a>
 </ Div> 
Określa, że element zawarty w div jest w rzeczywistości filmem, w rozumieniu schema.org hierarchii typów. Typy elementów są dostarczane jako adresy URL, w tym przypadku http://schema.org/Movie .

itemprop

Jakie dodatkowe informacje możemy dać wyszukiwarce dane o filmie  Avatar ? Filmy mają ciekawe właściwości, takie jak aktorzy, reżyser, ocena. Do oznaczania właściwości "towaru", należy użyć itemprop atrybut. Na przykład, aby określić dyrektora filmu, dodajemy itemprop="director" do elementu otaczającego reżysera nazwę. (Jest pełna lista wszystkich właściwości można skojarzyć z  http://schema.org/Movie).
<div itemscope itemtype ="http://schema.org/Movie">
  <h1 itemprop="name">Avatar</h1>
  <span>Director: <span itemprop="director">James Cameron</span> (born August 16, 1954)</span>
  <span itemprop="genre">Science fiction</span>
  <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">Trailer</a>
</div>
Należy pamiętać, że dodaliśmy dodatkowe <span>...</span> znaczniki do mocowania itemprop atrybuty do odpowiedniego tekstu na stronie. <span> ,tagi  są renderowane przez przeglądarkę internetową, więc to wygodny element HTML do korzystania z itemprop .

Wyszukiwarki mogą teraz zrozumieć nie tylko to http://www.avatarmovie.com mają tu  adres URL, ale również, że jest to adres URL do większego zbioru o science-fiction Avatar , który został wyreżyserowany przez Jamesa Camerona.

Embedded items osadzone elementy

Czasami wartość właściwość pozycja może  być inna pozycja z własnego zbioru właściwości. Na przykład, możemy określić, że reżyser tego filmu jest to element typu osoby i osoba ta może mieć właściwości inne np "name i birthDate"  (imię data urodzenia). Aby określić, np. wartość nieruchomości to kolejny element, możesz rozpocząć nowy itemscope natychmiast po odpowiednim itemprop .
<div itemscope ItemType ="http://schema.org/Movie">
   <H1 itemprop = "nazwa" &g; Avatar </ h1>
   <div itemprop="director" itemscope itemtype="http://schema.org/Person">
   Reżyseria: James Cameron <span itemprop="name"> </ span> (ur. <span itemprop="birthDate"> 16 sierpnia 1954) </ span>
   </ Div>
   <span itemprop="genre"> Science fiction </ span>
   <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer"> Trailer </ a>
 </ Div>

schema.org types and properties  rodzaje schema.org i właściwości.

Nie wszystkie strony internetowe są o filmach i losach jednostki, oprócz filmów i Osób typów  schema.org opisuje wiele innych typów elementów, z których każdy ma swój własny zestaw właściwości, które mogą być używane do opisania pozycji.
Najszerszy typ elementu to Thing , który ma cztery właściwości: name , description , url, image .
Tutaj mamy link do pełnej listy wszystkich elementów  LINK
I konkretny  przykład zastosowania LINK
Oto kilka uwag o których warto pamiętać podczas dodawania znaczników schema.org na swoich stronach internetowych:

Im więcej typów tym lepiej, z wyjątkiem ukrytego tekstu. Ogólnie rzecz biorąc, im więcej treści można oznaczyć, tym lepiej. Jednak co do zasady, należy oznaczyć tylko treści, które są widoczne dla osób odwiedzających stronę internetową, a nie treści w ukrytych div lub innych ukrytych elementach strony.
Podczas przeglądania typy schema.org, można zauważyć, że wiele właściwości mają typ "expected types". "Oczekiwano typów". Oznacza to, że do np.wartość nieruchomości może być osadzony element doatkowy bardziej szczegółowy

 Ale to nie wymóg, to dobrze jest to tylko zwykły tekst lub adres URL. Ponadto, gdy oczekiwany typ jest określony, to również dobrze osadzić element, który jest rodzajem pochodnym (dzieckiem) oczekiwanego typu. Na przykład, jeśli oczekiwany jest typ miejsca, to jest również porządane , aby osadzić jakie to miejsce.
Korzystanie z właściwości url. Niektóre strony internetowe są o określonej pozycji. Na przykład, możesz mieć stronę internetową o jednej osobie, który można oznaczyć za pomocą typ elementu Person (osoba). Inne strony posiada zbiór elementów opisanych na nich. Na przykład, witryna firma może mieć pracowników
z życiorysami na konkretnych stronach ,wtedy podajemy  z linkiem do strony z profilem dla każdej osoby.

Na stronach takich jak np o wielu przedmiotach, należy oznaczyć każdą pozycję oddzielnie i dodać właściwość url do linku do odpowiedniej strony dla każdego elementu,np.
<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>

 Testowanie znaczników

należy również sprawdzić swoje znaczniki schema.org upewnić się, że jest realizowany prawidłowo. Google udostępnia narzędzie, które można wykorzystać do testowania znaczników i zidentyfikować ewentualne błędy.{jcomments on}

Brak komentarzy:

Prześlij komentarz

lubię to

Popularne posty