JSON-LD схемата за локален бизнес и основните и характеристики

Shema.org…

Дали я обичате или не, тази схема е много важна част от оптимизацията на сайта ви за локалното търсене. За мен тя е връзка на любов и омраза.

  • Обичате я – защото така организира неорганизираната информация, че я превръща в разширени описания;

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

Какво е Микро информация?

Микро информацията или данните за нея са спецификация на HTML кода. Форма на семантични означения използвани за кодиране на данни, чрез речници като Shema.org. Това е чудесен метод за комуникиране на мета данните с търсачките. Големите търсачки, като Bing и Google използват тези означения, за да извличат информация от страниците на уебсайтовете. Тази спецификация често се използва за създаване на „по-богат“ опит за потребителите на интернет, чрез значително разширени описания и интерактивни елементи.

Пример за форматиране на Микроданни за локален бизнес:

<div itemscope=““ itemtype=“http://schema.org/LocalBusiness“>

<span itemprop=“name“>Gene’s Delicious Donuts</span><br>

<link itemprop=“url“ href=“http://www.example.com“>

<span itemprop=“address“ itemscope=““ itemtype=“http://schema.org/PostalAddress“>

<span itemprop=“streetAddress“>123 Happy Lane</span><br>

<span itemprop=“addressLocality“>Irvine</span>, <span itemprop=“addressRegion“>CA</span>

<span itemprop=“postalCode“>92618</span>

</span><br>

<a itemprop=“telephone“ href=“tel:+15551112345″>(555) 111-2345</a><br>

<span itemprop=“faxNumber“>(555) 111-2345</span><br>

<span itemprop=“email“>you@domain.com</span>

<link itemprop=“logo“ href=“image/path/file-name.jpg“>I

<link itemprop=“sameAs“ href=“https://plus.google.com/your-google-url“>

<link itemprop=“hasMap“ href=“https://www.google.com/maps/place/link-to-your-business“>

<span itemprop=“geo“ itemscope=““ itemtype=“http://schema.org/GeoCoordinates“>

<meta itemprop=“latitude“ content=“111.00000″>

<meta itemprop=“longitude“ content=“-96.012345″>

</span><br>

<time itemprop=“openingHours“ datetime=“Mo, Tu, We, Th, Fr 09:00-17:00″>9AM – 5PM</time>

</div>

Пример за графика на Гугъл при извличане на информация от Микроданните:

Трудности с Микроданните

Откакто микроинформацията често използва визуални означения, за да стилизира фактически елементи на дадена страница, аз често съм се „изгубвал“ в CSS и HTML, в опитите си да направя всичко да изглежда образно призоваващо в сайта на клиентите ми. Ненужните проблеми създадени от разпределението на микроданните, често водят до непродуктивно използвано време, което може да бъде употребено за други важни задачи по SEO оптимизацията и програмирането.

Какво е JSON-LD?

JSON-LD е схема за означение на данните, която ги свързва така, че да позволи по-лесното им означаване в маркерите на скриптовете. За разлика от микродатата, JSON-LD данните се появяват в задния фон, за да бъдат схематично означени. Няма нужда да означавате фактически HTML елементи, което създава много по-бърза работна среда за маркетинг професионалистите. Със скриптовете няма нужда да се тревожите за липсващ отворен span или за затворен div – всичко просто работи. Мислете за JSON-LD схемата, като за по-бърз, чист и опростен метод за използване на схеми. Търсачките я обожават, защото могат да обхождат кода с лекота и да разберат данните много по-бързо.

Ползите от използването на JSON-LD схемата

  • Вложени ценности – позволява да се представи по-комплексно информацията, като тя се разчита много по-лесно.

  • Променлива база – за да означите нов елемент, просто трябва да добавите променлива.

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

  • Лесни за маркиране ревюта – запазвате оформлението на досегашните си ревюта, без да трябва да правите промени в файла на CSS.

Видове полезна локална бизнес информация възможна за означаване

За повечето локални бизнеси, типичния NAP, бизнес часовете и гео-локацията са най-важните елементи на информационни данни. Опитен разработчик на данни би използвал структурирани данни включващи:

  • Бизнес име

  • Адрес

  • Телефонен номер

  • Имейл адрес

  • Бизнес часове

  • Информация за гео-локацията (координати карта)

  • Ревюта

  • Лого

  • Описания на типа бизнес

  • Линкове към социални профили, чрез метода sameAs

  • Име на уебсайта

Допълнителни полезни данни, които биха могли да се означат включват:

  • Продукти

  • Медия (изображения и видео)

  • Събития

  • Корпоративни контакти

  • Търсачка за линкове към сайта

Базов Shema.org пример за използване на данните за JSON-LD схемата за локален бизнес

В този базов пример за локален бизнес, ние сме включили вида на самия бизнес, пощенски адрес, описание, име на бизнеса, телефон, часове на работа, гео координация и линкове към социалните профили:

<script type=“application/ld+json“>

{

„@context“: „http://schema.org“,

„@type“: „LocalBusiness“,

„address“: {

„@type“: „PostalAddress“,

„addressLocality“: „Irvine“,

„addressRegion“: „CA“,

„postalCode“:“92618″,

„streetAddress“: „123 Happy Lane“

},

„description“: „This is your business description.“,

„name“: „Gene’s Delicious Donuts“,

„telephone“: „555-111-2345“,

„openingHours“: „Mo,Tu,We,Th,Fr 09:00-17:00“,

„geo“: {

„@type“: „GeoCoordinates“,

„latitude“: „40.75“,

„longitude“: „73.98“

},

„sameAs“ : [ „http://www.facebook.com/your-profile“,

„http://www.twitter.com/your-profile“,

„http://plus.google.com/your-profile“]

}

</script>

Как да приложите Shema.org означаването, използвайки JSON-LD схемата за локален бизнес?

Преди да се гмурна директно във въпроса, нека изложа кратък анонс на един непрофесионалист:

На първо място аз не съм професионалист по схемата JSON-LD и нямам никакви връзки с Гугъл. Тази статия е предназначена да ви покаже, как точно аз прилагам схемата в моите проекти. Надявам се, че тази информация ще ви бъде полезна. Моля прочетете всички упътвания на Гугъл внимателно, преди да пристъпите към влагането на подобен код. Не забравяйте да го тествате, тествате, тествате!

Също така ще ви посоча няколко помощни линка и инструмента:

  • Тестващ инструмент за Структурирани данни – това е инструмент на Гугъл, който може да ви бъде от помощ, когато имате проблеми с настройките на кода. Използвайте го, за да тествате кода си, преди да го публикувате на уебсайта си. Препоръчвам ви го горещо, защото ще направи  живота ви в програмирането много по-лесен.

  • Информационно табло за видовете схеми – този изумителен ресурс, събран на едно място от Фил Розек и Давид Дииринг ще ви разясни напълно вашата схема. Вместо да определяте локален бизнес, използвайте това информационно табло, за да намерите вашият вид схема, за да заместите „@type”: “LocalBusiness” линията. Не сте сигурни точно как да изберете правилния вид? Не се тревожете, Фил и Дейвид са написали статия, за да ви помогнат с тази задача.

  • Примери на Гугъл за Структурирани данни – в този ресурс има много обяснения и примери за видовете данни възможни за означаване.

  • Инструмента на Гугъл за Webmaster-и – правилния код за вграждане ще бъде показан във вашата GWT дъска с инструменти. Аарон Брадли, автора на „SEO скептици“ потвърждава, че GWT разбира и чете JSON-LD схемата. Можете да намерите точно тази част в GWT при Search Appearance-Structured Data (Поява на търсенето – Структурирани данни).

  • Списък на означения за структурирани данни и тяхната визуализация, валидност и инструменти за тестване също могат да ви бъдат полезни.

Стъпка 1: Определете вида на вашата схема

Използвайте удобната таблица на Дейвид и Фил, за да определите точно кой вид схема описва най-добре бизнеса ви – вместо да използвате стандартната схема на „Локален Бизнес“.

Стъпка 2: Персонализирайте и сложете кода си, където и да е на уебсайта ви

Персонализирайте нашия базов пример (по-долу) с вашата собствена информация, като включите избраната от вас вид схема в стъпка 1. Тогава сложете генерирания код, където и да е на уебсайта си. Няма значение дали ще го поставите в секцията <head> или <body>.  Гугъл няма да има проблеми да го разчете и на двете места. Откакто схемата JSON-LD форматира данни, като ги свързва, няма допълнителни запитвания към сървъра. Така няма значение дали скрипта е зареден в началото или края на страницата – това така или иначе няма да доведе до забавяне. 

Персонализирайте вашия вид схема:

„@type“: „LocalBusiness“,

Например, вашия @type(вид) може да е:

„@type“: „HVACBusiness“,

„@type“: „Attorney“,

„@type“: „Physician“,

„@type“: „RealEstateAgent“,

„@type“: „Dentist“,

Персонализирайте вашите Гео Координати:

За да намерят вашите гео координати, когато търсят бизнеса ви в Картите на Гугъл и да погледнат в URL-то, за да намерят ширината и географската дължина, трябва да персонализирате данните. Като алтернатива може да използвате http://www.latlong.net , за да намерите адреса на вашия бизнес:

Добавете URL адрес:

„url“: „http://www.example.com“,

Добавете лого:

„logo“: „http://www.example.com/images/logo.png“,

Добавете информация за имейл адрес:

„email“:“mailto:you@example.com“,

Добавете връзки към социални профили:

До този момент Гугъл поддържа социални мрежи, като Facebook, Google+, Twitter, Myspace, Instagram, LinkedIn, YouTube. За да добавите нов профил, добавете URL в кавичките и го разделете с точка.

„sameAs“ : [ „http://www.facebook.com/your-profile“,

„http://www.twitter.com/yourProfile“,

„http://plus.google.com/your_profile“]

Свържете се към карта

„hasMap“: „https://www.google.com/maps/place/Sushi+Imari/@33.664141,-117.879423,17z/data=!3m1!4b1!4m2!3m1!1s0x80dcdfaa9f9de2a5:0x48ad2abe6bb60a3b?hl=en“,

За да вземете линк към картата си, намерете бизнеса си с картите на Гугъл и копирайте кода от десния краен ъгъл в gear icon > Share or Embed Map.

Включете допълнителен вид:

Като допълнителна стъпка за тези от вас, които биха искали да добавят Онтология на продукта, чрез допълнителна стойност в техния код, добавете допълнителен вид като този:

„additionalType“: „http://www.productontology.org/id/Personal_injury_lawyer“,

Вижте статията в Локалната система за видимост, за това как да изберете Онтология на продукта, неговите категории и защо да я включите във вашата схема!

Добавете събиране на рейтинг:

„aggregateRating“: {

„@type“: „AggregateRating“,

„ratingValue“: „4“,

„reviewCount“: „250“

},

Включете ревюта с насъбиращ се рейтинг

За да добавите повече ревюта, просто копирайте и поставете елементите на ревюто и добавете натрупване, чрез reviewCount (отброяване на ревюта) и ratingValues (оценки на ревютата). Забележете, че всяко ревю има две фигурни скоби и е отделено с точка.

<script type=“application/ld+json“>

{

„@context“: „http://schema.org“,

„@type“: „Dentist“,

„name“: „Family Dentistry“,

„aggregateRating“: {

„@type“: „AggregateRating“,

„ratingValue“: „4“,

„reviewCount“: „2“

},

„review“: [

{

„@type“: „Review“,

„author“: „Ellie“,

„datePublished“: „2011-04-01“,

„description“: „I’m not entirely upset with this office, but the staff at the front desk could have been nicer in letting me know they have nothing available for the next 2 months.“,

„name“: „Good services, poor communication“,

„reviewRating“: {

„@type“: „Rating“,

„bestRating“: „5“,

„ratingValue“: „3“,

„worstRating“: „1“

}

},

{

„@type“: „Review“,

„author“: „Lucas“,

„datePublished“: „2011-03-25“,

„description“: „I was finally able to get my old crown replaced with a new, porcelain one at a cost that doesn’t break the bank.“,

„name“: „Affordable Crowns“,

„reviewRating“: {

„@type“: „Rating“,

„bestRating“: „5“,

„ratingValue“: „5“,

„worstRating“: „1“

}

}

]

}

</script>

Стъпка 3: Тествайте кода си

След като веднъж имате кода си, ако вече не сте в Инструмента за тестване на Структурирани данни, отидете там и тествайте кода си, като го копирате и поставите, и кликайки на Валидиране (Validate).

Зелена отметка и текста „Всичко е наред“ ще ви се покаже, ако кода е валидиран без грешки. Ако поради някаква причина виждате грешка, внимателно проверете синтаксиса, за да се уверите, дали някъде не сте пропуснали точка, фигурни скоби или цитати.

Пример за локален бизнес, чрез JSON-LD и разширени реквизити

За да добавим разширени реквизити към нашия базов пример, ние включихме имейл адрес, допълнителен вид, карта, URL на сайта и линк към изображение за лого:

<script type=“application/ld+json“>

{

„@context“: „http://schema.org“,

„@type“: „LocalBusiness“,

„additionalType“: „http://www.productontology.org/id/Genes_Donuts“,

„url“: „http://example.com/“,

„logo“: „http://www.example.com/images/logo.png“,

„hasMap“: „https://www.google.com/maps/place/link-to-your-business“,

„email“: „mailto:you@example.com“,

„address“: {

„@type“: „PostalAddress“,

„addressLocality“: „Irvine“,

„addressRegion“: „CA“,

„postalCode“:“92618″,

„streetAddress“: „123 Happy Lane“

},

„description“: „This is your business description.“,

„name“: „Gene’s Delicious Donuts“,

„telephone“: „555-111-2345“,

„openingHours“: „Mo,Tu,We,Th,Fr 09:00-17:00“,

„geo“: {

„@type“: „GeoCoordinates“,

„latitude“: „40.75“,

„longitude“: „73.98“

},

„sameAs“ : [ „http://www.facebook.com/your-profile“,

„http://www.twitter.com/yourProfile“,

„http://plus.google.com/your_profile“]

}

</script>

Бележка: В този пример, категорията за Онтология на продукта е  допълнително направена, за да ви демонстрираме как се прави. Ако това бяха Поничките на Ранди, те можеха да добавят тяхното име, като допълнителен вид!

Няколко съвета, за да избегнете грешки

Ако имате малко или нямате никакъв опит в програмирането, е по-лесно да изпаднете в грешки, когато се опитвате да персонализирате примерите за код с вашите собствени информационни данни. Събрах няколко съвета, за да ви помогна да валидирате кода си, без да грешите:

  1. Всяка информация се отбелязва в кавички: „телефон“:

  2. Всеки вид информация се декларира в следния вид: „@вид“:

  3. Съставни записи, като стойности към адрес, винаги трябва да бъдат поставяни във фигурни скоби: „адрес“: { стойности на адреса }

  4. Всяка информация е отделена от точка “местоположение на адреса”: “Irvine”, “регион на адреса”: “CA”

  5. Повтарящите се характеристики, като различни часове на работа или социални линкове към медии (sameAs property) се поставят в скоби [].

  6. Не използвайте програмата Microsoft Word, за да форматирате кода си, защото това ще създаде грешки при форматирането. Аз препоръчвам Notepad или да маркирате добавките в самият Инструмент за тестване на Гугъл.

JSON-LD схемата за означаване и основните и водещи линии

Преди да се вдъхновите и да започнете да програмирате данни, които не са визуално представени на сайта ви, бъдете информирани, че Гугъл не се шегува, когато става въпрос за спам от разширеното описание! Ръчните и алгоритмичните глоби са възможни, когато става въпрос за отбелязване на данни, които посетителите не могат да видят.

Водещи линии и основните притеснения, които създава означаването на локалния бизнес

  • Данните не трябва да объркват или заблуждават потребителите, които търсят в търсачките.

  • Използвайте само най-специфичните видове и имена на реквизити определени от schema.org.

  • Означеното съдържание трябва да бъде видимо на страницата, където се поставя скрипта.

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

В крайна сметка, за да останете „чисти“ – бъдете сигурни, че маркирате само съдържание, което вече е видимо на уебсайта ви. Примерно, ако страницата не съдържа ревюта, не добавяйте в скрипта означения за ревюта.

Няколко факта

Няколко зададени наскоро въпроса и техните отговори за добавянето на схемата и означаването с JSON-LD:

  • Мога ли да включа данни, които не са показани на уебсайта ми? Не, независимо че има някои изключения. Логично Гугъл няма да покаже никаква информация, която не е показана на уебсайта ви. Всъщност, това е против техните правила. Вижте линка за повече детайли около позволените и забранени изключения.

  • Моите разширени описания не се показват, защо така? Гугъл не дава гаранция, че вашите разширени описания ще бъдат показани.

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

  • Как да форматирам данните за работни часове, които са променливи? Ако бизнеса ви има различни работни часове, за различни дни, можете да определите множество работни часове, като индивидуална линия, която е затворена в скоби. За да ви покажем бегло описание на този подход, посетете schema.org specification (спецификации). Ето и бърз пример за бизнес, чийто работни часове през по-голямата част от седмицата са от 9 до 5, но в петък работния ден е до обяд:

„openingHours“: [ „Mo-Th 09:00-17:00“, „Fr 09:00-12:00“ ],

  • Мога ли да използвам този код в системи за управление на съдържанието, като WordPress и други? Да, кода работи навсякъде. За да поставите кода на всички страници в уебсайта си (site-wide) добавете го към персонализирания си скрипт в секцията „Настройки“. Някои теми нямат такава секция, затова намерете header.php or footer.php файла и добавете кода там.

  • JSON-LD схемата изтрива ли настройките на CSS? Не. За разлика от JavaScript форматирането на данните чрез свързване не се изтриват настройките на рендеринга. Това означава, че можете да поставите кода, където искате на сайта си, без да се тревожите, че това ще доведе до забавяне във времето за зареждане. Кода ще увеличи размера на съдържанието на HTML файла ви, но с много малко – напълно пренебрежимо, когато става въпрос за време за зареждане на страница.

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