SCHEMA.ORG – Структурирани данни и речници

Всички уебмастъри и разработчици са наясно с множеството HTML тагове използвани за означаването на отделните обекти в страниците, по които работят. С развитието на интернет и експоненциалното нарастване на броя на сайтовете, както и тяхното съдържание, търсещите машини започват да създават все по-сложни алгоритми, по които да определят дали един определен елемент трябва да бъде включен в определен списък или не, въпреки че името на елемента е също от съществена важност.

За пример един стандартен h2 таг:

<h2> Речник  </h2>

може да означава, че съдържанието под него е описание на това какво е речник или пък може да значи, че следва речник на определени елементи, но дори и тогава няма яснота точно на какви елементи.

Страниците имат съдържание, което един потребител може да разбере при прочитане и да реши дали е това, което той търси. Търсещите машини са по-ограничени в това отношение и често имат нужда от разяснения, за да решат дали определена страница е резултат, който отговаря на вашето търсене или не. Schema.org обединява множество записи в колекция от речници, предназначени да дадат конкретен отговор на това, какво точно представлява описания елемент и как съответно следва да бъде индексиран и съответно намерен.

Схемата се разработва и съответно се разпознава от основните търсещи машини Google, Microsoft, Yahoo и Yandex. Данните в съдържанието на страниците могат да бъдат маркирани с някой от форматите  Microdata, RDFa, и JSON-LD  и по този начин да се окаже вида им, връзките между тях и действията, които се извършват. Преди за започнем да маркираме отделните елементи в страниците си трябва да познаваме поне основно отделните речници, които ги описват, както и въпросните формати определящи как да бъдат описани.

Microdata

Микродата представлява колекция от тагове в HTML среда , предназначени да се вградят в съдържанието на страниците като се добавят към съответните елементи, които те описват. По този начин уебмастъра може да маркира съдържанието си директно в процеса на въвеждането му, а търсещите машини да могат да извлекат данните така, че да могат те да ги разберат и съответно да дадат по-точни резултати на потребителите си.

Пример:

<div itemscope itemtype=“http://schema.org/Person“>
<span itemprop=“name“>Никола Минков</span>
<span itemprop=“jobTitle“>СЕО  експерт</span>
<span itemprop=“email“>info@serpact.com</span>
<p itemprop=„address“ itemscope itemtype=“http://schema.org/PostalAddress“>Адрес:
<span itemprop=“streetAddress“>Д. Благоев 7</span>
<span itemprop=“addressLocality“>Свиленград</span>
<span itemprop=“addressRegion“>България</span>
</p>
</div>

Въпросната маркировка описва един индивид и дава съответно някои данни за него – име, адрес, имейл, позиция. Това далеч не е всичко, което може да се каже за Никола Минков, но това са данни, с които искаме търсещите машини да разполагат, така че евентуално, ако някой иска да го намери през тях, да може да се свърже с него, те да са на разположение. Подадени по този начин машините са наясно, че това са точно данните за връзка, които трябва да бъдат подадени при едно такова търсене.

Основните тагове в Микродата маркирането са както следва:

• itemscope – създава елемент и указва, че всички поделементи, които го съставят, са информация за него.
• itemtype – Валиден интернет адрес на речника описващ съответния елемент, чрез който търсещите машини да могат да определят точния му вид и предназначение.
• itemid – указва уникален идентификатор за един елемент
• itemprop – показва, че съдържанието на тага, към който е придаден, описва свойството на елемента описано от него ( <span itemprop=“name“>Никола Минков</span> )
• itemref – указва, че описаното свойство не е част от елемента описан с itemscope.

Ще забележите в описания пример, че имаме два елемента описани с  itemscope – човек и адрес. Адреса сам по себе си не би означавал нищо особено за търсещите машини, но в случая той е подаден като поделемент на Person. По този начин се указва връзката между двата елемента – това е адреса на описания човек ( p  се съдържа в div, описващ главния елемент и носи едновременно itemprop=„address“ и itemscope ). По този начин може едновременно да се работи по дизайн на елементите и да се поставя маркирането им едновременно.

Друг момент в текущия пример, който привлича вниманието, е че всички елементи, които описват въпросния Person, се визуализират на текущата уеб страница. Освен, разбира се, ако нямат зададено изрично „display:none;“. Може обаче един уебмастър да иска да подаде чрез въпросния елемент и данни, които не иска да се визуализират – или понеже ще развали облика на сайта, или просто защото теста на структурната дата би дал грешка, понеже не ги намира, а ги смята за задължителни, а вие все пак искате елемента ви да се индексира.

В този случай е подходящо използването на мета таг вътре в описания елемент. Например:

…
< meta itemprop=„image“ content=„https://serpact.com/wp-content/uploads/2016/06/Nikola-Minkov-CEO-at-SEO-Agency-Serpact-1.png“ />
…

Google може да използва микродата данните в страниците на резултатите си. Това е и предпочитан формат за Google+ .

RDFa

RDFa е различен метод за подаване на метаданни. Поради естеството си може да се определи като CSS за значения. Както CSS и при него може да има главни елементи, които да са от значение за цялата страница или целия сайт – например маркирането познато на всеки работещ по-дълбоко в WORDPRESS:

<meta name=“description“ content=“A site about fish“ />
<link rel=“next“ href=“nextpage.html“ />
<link rel=“canonical“ href=“https://serpact.com/novini“/>

Тези записи заедно с индексацията на <html тага дават някои от най-важните данни за сайта.

Отделно RDFa може да се използва и за отделни и по-малки елементи. Например горния пример в RDFa формат би изглеждал така:

<div typeof=“Person“ vocab=“http://schema.org/“ >
<span property=“name“>Никола Минков</span>
<span property=“jobTitle“>СЕО  експерт</span>
<span property=“email“>info@serpact.com</span>
<p property=„address“ typeof=“PostalAddress“>Адрес:
<span property=“streetAddress“>Д. Благоев 7</span>
<span property=“addressLocality“>Свиленград</span>
<span property=“addressRegion“>България</span>
</p>
< meta property=„image“ content=„https://serpact.com/wp-content/uploads/2016/06/Nikola-Minkov-CEO-at-SEO-Agency-Serpact-1.png“ />
</div>

Други сходства с CSS е възможността отделни елементите да се групират, да се използват повторно или да са отделни от HTML на страницата.

Речник на отделните атрибути:

• about – Определя обекта на връзката на елемента. Ако е празен се има предвид текущата страница.
• rel – Определя връзката между обекта и URL получено или чрез href или чрез resource.
• rev – Подобно на rel, но връзката е обратна.
• property – определя, че съдържанието на тага, към който е придаден, описва свойството на елемента описано от него ( RDF варианта на itemprop ).
• content  – незадължителен атрибут, който заменя съдържанието  на property
• datatype – незадължителен атрибут, описващ типа на данните в property
• typeof – незадължителен атрибут, описващ типа на RDF елемента.
• href – Определя адреса на rev или rel атрибутите.
• resource – Определя адреса на rev или rel, когато  href го няма.
• src – определя обекта на връзката.

Трябва да се отбележи, че доста браузери и приложения към тях могат да вземат така форматираните данни и да работят с тях. Например, ако имате описано предстоящо събитие, от което се интересувате, то може да бъде прибавено към календара ви.

JSON-LD

Различен модел за предаване на метаданни е JSON-LD. Този метод използва Java базиран скрипт, чрез който да предава въпросните данни по възможно най-прост начин, с минимални усилия, стилизиран по JSON стандарта.

Поради отделянето на маркирането в отделен Java script то обикновено няма част, която да се визуализира на браузерите, но пък е удобно за разчитане от отделни приложения, които биха желали да използват данните получени през него.

Локален пример за JSON маркиране:

<script type=“application/ld+json„> {
„@context“: „http://schema.org“,
„@type“: „LocalBusiness“,
„address“: {
„@type“: „PostalAddress“,
„addressLocality“: „Свиленград“,
„addressRegion“: „BG“,
„postalCode“:“6500″,
„streetAddress“: „ул. Д. Благоев 7“
},
„telephone“: „+359 885-014-972“,
„email“: „info@serpact.com“,
„url“: „https://serpact.com/ „,
„sameAs“:
[ „https://plus.google.com/u/0/+SerpactBg“,
„https://www.facebook.com/Serpact/“],
„description“: „SEO агенция Serpact прави клиентите си печеливши, продаващи и популярни! Компетентни сме в SEO оптимизация, On-Page / Off-Page SEO и PPC.“,
„name“: „SEO Агенция Serpact“,
„alternateName“: „Serpact“,
„legalname“: „Серпакт EООД“,
„branchCode“: „Serpact BG“,
„taxID“: „202477340“,
„openingHours“: „Понеделник-Петък 8:00-17:00“,
„priceRange“:“1000-2600 BGN“,
„geo“: {
„@type“: „GeoCoordinates“,
„latitude“: „41.7676176“,
„longitude“: „26.202593“
},
„hasMap“: „https://www.google.com/maps/place/Serpact/@41.7676176,26.2004043,17z/data= !3m1!4b1!4m5!3m4!1s0x0:0x4df134a68b714c27!8m2!3d41.7676176!4d26.202593“,
„logo“: „https://serpact.com/wp-content/uploads/2016/03/serpact-small.png“,
„image“: „https://serpact.com/wp-content/uploads/2016/03/serpact-small.png“,
„award“: “ „,
„contactPoint“: [ {
„@type“: „ContactPoint“,
„contactType“: „customer service“,
„telephone“: „+359 885-014-972“,
„email“: „info@serpact.com“,
„productSupported“: „SEO оптимизация, SEO анализ“
}],
„currenciesAccepted“: „BGN, GBP, USD, EUR“,
„paymentAccepted“: „Банков път“,
„founder“: [ {
„@type“: „Person“,
„name“: „Nikola Minkov“,
„nationality“: „Bulgarian“,
„jobTitle“: „CEO“,
„gender“: „male“,
„sameAs“: [
„https://plus.google.com/+katqvalentinova“,
„https://www.facebook.com/nikola.t.minkov“
] } ],
„foundingDate“: „2012“,
„foundingLocation“: „Димитровград“
}
</script>

Някои особености за JSON

Форматът е базиран около „context“ елемента, за да осигури връзката между JSON и RDF модела. Поради това моделът позволява отделните стойности да се форматират в специфициран формат или да се свържат с определен език. Поради начина на структуриране ( като отделен скрипт ) JSON маркирането може да бъде вградено в страницата или изведено в отделен файл, към който може да се обръщат различни страници.

Както се вижда освен <script type=“application/ld+json„> , което указва типа на речника , този вид маркиране няма особен собствен речник. Трябва да се вземат предвид обаче някои основни правила при маркирането.

1. Отделните елементи на маркировката са съставени от два основни аргумента – свойството на описаното поле и стойността на въпросното свойство. Типа на въпросната стойност трябва да бъде съобразен със стандарта на типа за въпросната стойност ( Ако полето изисква URL, не можете да сложите обикновен текст без да получите грешка). Можете да проверите въпросните формати в сайта на http://schema.org за съответната маркировка.

2. При случаите, когато определен атрибут има няколко стойности ( например в горния пример полето „sameAs“ описва страниците на описвания обект в различните социални мрежи, а те са повече от една), то тези стойности се групират в [ ] и се отделят със запетая.

3. Комплексната маркировка, описваща зависими елементи се осъществява чрез събиране на свойствата на въпросния елемент в { }. Всеки такъв елемент трябва да бъде маркиран чрез собствен „@type“ индекс, който определя типа му и съответно какви полета се очаква да има.

Други речници, които трябва да се споменат са microformat и OpenGraph.

Мicroformat

Мicroformat е речник от колекция от HTML тагове, вградени в кода на страницата ви, който характеризират определени елементи от нея – хора, събития и други, чийто елементи се прихващат от външни източници като отделни приложения или допълнения към браузера ви и влияят на това как и какви данни ще бъдат предоставени. Например гео маркирането

<span class=„geo“>
<span class=„latitude“>41.7676176</span>,
<span class=„longitude“>26.202593</span>
</span>

Може да се прихване от GPS приложение, използвано за навигация или да определи езика, чрез който да предаде текущата страница.

Някои основни маркировки на microformat:

• hCalendar – за събития
• hCard – за контактна информация , включва:
  • adr – за адрес
  • geo – за гео кооординати (latitude, longitude)
• hNews – за новини
• hProduct – за продукти
• hReview – за отзиви
• rel-license – за копирайт лицени
• rel-nofollow, – за да изключи следването на една връзка, често за спиране на евентуален спам.

WORDPRESS и повечето по-сериозни Уеб платформи често добавят  автоматично подобна маркировка към отделни елементи елементи от сайта ви. ( например фийда ).

Open Graph

Open Graph е речник, разработен през FaceBook , за да може той коректно да приема съдържанието, да го разчита и да го извежда в подходящ формат.

Пример:

<meta property=“og:locale“ content=“bg_BG„/>
<meta property=“og:type“ content=“article„/>
<meta property=“og:title“ content=“Кой побеждава – съдържанието или линка? | Новини | Serpact™„/>
<meta property=“og:description“ content=“За съжаление на въпроса кое е по-важно съдържанието или линка няма точен отговор? Линковете и съдържанието вървят ръка за ръка, но защо?„/>
<meta property=“og:url“ content=“https://serpact.com/koy-pobezhdava-sydyrzhanieto-ili-linka/„/>
<meta property=“og:site_name“ content=“SEO Агенция Serpact™„/>

Това е Open Ggraph маркирането на определена статия на Serpact.

Основните полета, използвани от Facebook при индексирането на съдържанието в собствен пост са: og:type – за вида на поста, og:title – за името , og:url – за адреса на източника, og:image – за основното изображение ( ако има такова ).  В нашия случай имаме и og:locale – за езика на поста, og:description – за описание , og:site_name – за име на сайта на източника.

Трябва да се има в предвид, че Facebook ( а и другите социални платформи ) имат свой собствен поглед и изисквания към съдържанието, което евентуално биха приели, както и към това как да го приемат, и този поглед се различава от този на останалите търсещи машини. Затова и си има собствен речник за маркиране.

Така съобразявайки се с това, каква информация имате на сайта си, как и за какво искате тя да послужи , можете да изберете какви елементи искате да маркирате и каква маркировка да използвате, така че отделните търсещи машини да могат най-точно и лесно да разчетат съдържанието ви и да могат коректно да го подадат в отговорите си.

Надяваме се с примерите си и описаните атрибути към отделните модели на маркиране ще можете да извършите това маркиране коректно. Можете да използвате за контрола онлайн теста на структурната дата на гугъл https://search.google.com/structured-data/testing-tool    ,за да проверите маркировката си за грешки и предложения за поправка. От http://schema.org  можете да изведете изискванията и правилните атрибути, които са ви необходими за маркирането на елементите, които искате да обозначите.