👩🏿‍🎨 ⏭️ 😘 Do-it-yourself Schema.org: customizing micro-layout without a programmer ✊🏽 🍫 ⏱️

Programmers are now offended, but not necessary. They will try to cope without you, and then they will come to you with the request to repair everything that broke in the process. Joke. Nearly.

We talk about the vocabulary and micro-markup syntax, assembled several plugins and tools for creating and checking markup, and took apart one of the plugins in steps.

, Schema.org, .

Schema.org — , , . , , site.ru/product_page1 , : , , , .. .

Schema.org . , , :

Open Graph. Facebook, (, , ). Facebook, (, , ..).
. W3C, 2007 . , , . , , Schema.org.
Dublin Core. — .

Schema.org

JSON-LD
JSON-LD

JSON-LD?

CMS?

— , . — , . Schema.org, Open Graph, Dublin Core — .

— html- . — , .

, Schema.org:

;
;
RDFa;
JSON-LD.

, , .

. : , — , — .

, :

: , :

Schema.org, — .

— Google ( ).

Google . : , ( , ).

SEO Promopult: . — . -, , . , . ( ).

( ). , , : , .

: → → → .

— , ( ).

Schema.org

(, ) , (SKU, , ..).

— schema.org.

— () Thing ( )

, :

Product — , . , , , .. , /: , , , , , , , , SKU ..
Event (). , : , , .. Schema.org Event . , (BusinessEvent), (Festival), (SportsEvent).
Recipe — . , , , .
Review (). — «» .

, Schema.org :

RDFa;
;
;
JSON-LD.

, (JSON-LD) — .

Google JSON-LD — , RDFa, .

: JSON-LD ( .). , ( ), . — RDFa ( , — ).

Google — JSON-LD.

JSON-LD

. , .

JSON-LD :

<script type="application/ld+json">
{
//  
}
</script>

— , ( <html>, <head> <body> html-). , : , .

<script type="application/ld+json">
{
"@context": "https://schema.org/", //    — Schema.org
"@type": "Product", //  — 
"name": "iPhone", //  —  
"image": "https://site.ru/iphone10.png", // URL  
"description": "iPhone 10", // 
"brand": "Apple", // -
"aggregateRating": { // 
"@type": "AggregateRating",
"ratingValue": "5", // 
"ratingCount": "56" //  
}
}
</script>

! , , . , .

JSON-LD

JSON-LD ( ) — , . JSON-LD, :

technicalseo.com — , (, , , FAQ-, ..). .

schemaapp.com — (, 14- ). Schema.org.

hallanalysis.com — . .

, . JSON-LD , , .

Structured Data Testing Tool Google;

JSON-LD?

( ) — . <head> </head> .

JSON-LD .

HTML ( JSON-LD — JavaScript). — .

— :

itemscope — , (<div>...</div>) ();
itemtype — ;
itemprop — .

<div itemscope itemtype="http://schema.org/Movie">
<h1 itemprop="name"></h1>
<div itemprop="director" itemscope itemtype="http://schema.org/Person">:
<span itemprop="name"> </span>
(. <span itemprop="birthDate"> 20  1970 .</span>)
</div>
<span itemprop="genre"> </span>
<a href="../movies/interstellar-2-trailer.html" itemprop="trailer"></a>
</div>

— .

, -:

webcode.tools — , 14 . JSON-LD;

htmlstrip.com ( 3 : , , );

Local Business Schema Generator — . JSON-LD — .

( ).

, .

Google — .

, ;
, Google (, ).

;

URL . , - — . — . . — , .
« ».

. « » , . , . (, ) .

Similarly, label all required and optional elements. Then click Finish. In the pop-up window, the tool will offer to select a group of similar pages selected by the system, or create your own group. Select the option you want and click Create Page Group.

At the next step, the system will offer to check the correct layout of other pages. If there are many similar pages, the system will show several sample pages. Check the markup and correct errors if some elements are incorrectly marked by the system. Then publish the micro-markup.

Googlebots will crawl the site’s pages and take into account the specified micro-layout.

How to change or remove micro-layout

<> Open the Search Console and go to the Marker section. Select the group of pages that you added when marking up. Edit them or delete the group completely.