Google generates special snippets based on markup.

To do this, you need to specify the value of the AggregateRating field:

When using a microformat, you must indicate the name of the organization, address and telephone number:

To create a preview, all you need is a title, a short description, and a picture.

For a page with a list of products, you can add ItemList markup to get a special island with a catalog:

Considering that sites can offer different products, these types of markup are suitable for all online stores that have pages with a description and price for each product.

mass media

Alexander Lomakin, technical director of Lenta.ru:

At Lenta.ru we use three types of semantic markup: Open Graph, Twitter Cards and Schema.org.
With the first two standards from Facebook and Twitter, everything is simple - our materials are shared and liked quite a lot, so on social networks they should look no worse than on the main site. With markup, we control this by marking up the photo, title, and short description.

CreativeWork markup is suitable for news reports and various texts, with the help of which a structured snippet and an island with a news card are built in Yandex.

Children's theater festival "Big Change" opens in Moscow

Traditionally, the festival program consists of main and special programs. If the main playbill consists of foreign and Russian performances, then the additional one includes master classes and meetings, the topic of which is theater technologies and art for children.

The Islands platform is at the beta testing stage

You can add Organization or hCard markup to your contacts page.

Video hosting

Denis Chudinov, head of optimization at Ivi.ru:

We started thinking about introducing micro-markup only in 2012, while Yandex began to take into account the first types of micro-markup back in 2010. But better late than never :) However, it turned out that in 2012 there were practically no examples of its use on the RuNet; everyone had only heard about it, but did not understand at all how and what to implement. Therefore, we had to learn from our own experience: we had no choice but to consider different options ourselves, study the documentation of existing standards and look at our Western colleagues. In general, we experimented. As a result, we decided to implement two types: Open Graph and Schema.org/Movie, as they help transmit data to search engines and display beautifully on social networks.

For us, this implementation was not easy, both from a development point of view and from the point of view of understanding why it was needed - at that time it was not very obvious what micro markup would provide. In general, it was only clear that Open Graph is needed for social networks, and Schema.org is needed for search engines. In addition, at that time we did not have a separate metric to measure the effectiveness of markup, and it was not very clear how the effect of its implementation could be measured. However, a little time passed, and we began to notice that “left texts” began to disappear from the text of snippets in Yandex; they became more informative. And our users began to notice this, which couldn’t help but make us happy.

We are now continuing to implement micro markup, this time with much clearer goals and metrics - in order to connect to the updated Yandex.Video affiliate program, since we expect after this a significant increase in the number of visits from this service.

All video materials can be described in detail using the VideoObject type from Schema.org or the Open Graph extension from Yandex. The markup will allow you to participate in the Yandex and Google affiliate programs and be well displayed both in the results of large searches and in the search of video aggregators.

The markup indicates the video data: title, length, episode number, and so on.

And using the Schema.org/Movie markup you can get structured snippets with descriptions of films in Yandex:

To do this, you need to mark up detailed information about the film:

Captive of the Caucasus, or Shurik's New Adventures

director

• Alexander Demyanenko
• Natalya Varley

Having gone to one of the mountain republics to collect folklore, the hero of the film Shurik falls in love with a pretty girl; an athlete, an excellent student, and simply a beauty. But she is unexpectedly kidnapped to force her into marriage. The naive Shurik was not immediately able to figure out what was going on under his nose, but then he bravely rushed to free the Caucasian captive

Users can search for films not only by title, but also by other parameters - genre, director or cast. This markup will help you find the results you need on your site.

At the moment, 30% of pages known to Yandex have semantic markup. The responses from site representatives are a small but very indicative part of the experience of using markup. If you have it too, share it in the comments!

We thank our partners for their responses and assistance in compiling this article.

This concludes the series of tutorial posts on semantic markup. We wrote about various dictionaries and syntax standards, about markup-based products, and in this article we looked at live examples of Runet sites that use and recommend markup.

We hope these articles have helped you understand what semantic markup is and how it can benefit you. In turn, we, the Semantic Web team at Yandex, will continue to create products and tools that can help in working with semantic markup, and will continue to write about it.

To the untrained eye, the structure of microdata may seem complex and confusing, but in fact, this is not the case at all. It is enough just to understand the hierarchy of the markup dictionary and even not at the highest level to know the site code in order to successfully give the necessary signals to search engines.

In the previous one, we briefly described what micromarking is and what it can be used for. In this article, we will move from theory to more visual aspects and show how micro markup is implemented into the site, and what it gives in the end. For example, we will take the semantic markup dictionary http://schema.org as the most popular and officially supported by all major search engines. By the way, there is a Russian-language version of the dictionary (http://ruschema.org), developed by enthusiasts. Not as complete as the original, but worthy of attention.

How to make micro markup and where to write the necessary attributes

Now let's get straight to the point. About where the data is written that the search engine will pay attention to. To begin with, there are three attributes that should absolutely always be used:

• indicates to the search bot that there is an object on the page that is worth paying attention to;
• itemtype is found after itemscope and describes what type the referenced object is. The list of possible objects can be seen in the corresponding section of the dictionary (http://schema.org/docs/full.html);
• , which describes the properties of this object.

Let's look again at the examples of Yandex itself. Before us is a piece of code that describes the movie “Avatar”.

As you can see, the attribute appears in the tag

, where information about the film is contained. Appears immediately behind him itemtype, which refers to the Movie object (http://schema.org/Movie). Attributes are written, in this case, inside tags And .

Sometimes the itemprop value itself can mean a separate entity, in which case the itemscope attribute will be inside an existing one. This is done by using itemscope immediately after itemprop. For example:

As you can see, in the inner tag

contains data about the director of the film, which can be represented as a Person object type. Therefore, data about a person such as name or date of birth will relate specifically to Person, and not to the “mother” Movie object, since they are located inside the corresponding block

.

What tags does micro markup consist of?

As you may have noticed, the tag

is always used to indicate the beginning and end of an object description. In addition to it, the following tags can be used:

— it contains the properties of an object that can be described in words. The use of this tag is very convenient, since you can include any information in it without visually changing the site, therefore it is best to enter it if you need to add the itemprop attribute;

Tag used for links that are visible to users. If inside a tag to conclude url linking to a third-party site, it will be easier for the search engine to understand what kind of information is on your page. For example, you can provide a link to a Wikipedia article:
Another way to point a search engine to a link is to use a tag with href attribute:
Its difference from a tag is that the link will not be seen on the Internet
site bodies.

Also, using the tag useful for so-called enumerations, that is, properties that have a limited number of values. For example, an online store can use micro-marking to indicate the availability of goods in stock. Possible values ​​in this case, according to schema.org: in stock(in stock), out of stock(not available), pre-order(to order). Using a tag this information can be formatted as follows:

If we did not point to the InStock value, then the penultimate line could look like this:

Is available for sale!

But, expanding the functions of micro markup, in this case we tag replaced by < link>, turning it into an invisible link.

You can use the tag in a similar way < meta>, which remains out of sight of the user, but due to the negative attitude of search engines towards its too frequent use, we recommend not to abuse it.

The time or duration is described by a tag < time> with datetime attribute. For example, in the screenshot below, the start time of the concert is described by the startDate value:

Another example of using micro markup

In conclusion, we will give an example of the use of micro-markup on the site you are currently on, as well as the effect that this micro-markup gives. We are talking about the AggregateRating attribute for an object of type Article, that is, for an article. Under each article there is an article rating widget, the code of which contains an “invisible” tag

with the following attributes:

Thanks to it, the rating of the article can be seen in Google results. In addition, the date of publication in the search snippet is also a merit of micro-markup.

This is one of many examples of using markup. It can be useful for a site on any topic, and improve its presentation in search engines, be it products, events, recipes, reviews, dictionary entries, and so on and so forth. Therefore, we recommend that you carefully study schema.org and find attributes there that will allow the link to your site to stand out from competitors and attract more visitors.

Do not miss:

Hello, dear blog readers!

I want to tell you about another effective way to create your website. Today’s article will talk about what Shema.org micro markup is, how to use it and how it affects website promotion.

This is a continuation of the previous post about, I advise you to read it first if you don’t already know what an ideal snippet should be.

What is website micro-markup?

Several years ago, the largest companies Yandex, Google, Yahoo and Bing announced the introduction of new technologies into their search engines. Since then, Shema.org semantic markup has been helping robots most accurately process, distribute and understand information on Internet resources, in order to then provide this data to users in search results.

Micro markup is necessary for a website to make it easier for search engines to recognize the information posted on it. And as a reward for this, search engines will show a structured, user-accessible description of the resource (snippets) in the search results.

Here is one example given by Yandex:

In addition, thanks to micro-marking, you can see addresses, phone numbers, product descriptions, reviews, comments, opening hours, publication date and much more in the snippet. In order to see examples of website micro-markup, just look at the snippets of the most famous online stores.

Why do you need website micro-markup?

In view of the above, micro markup significantly contributes to increasing the clickability of the snippet in search results. After all, an extended description allows the user to quickly navigate the information, attracts his attention, and therefore, he is more likely to make a choice in your favor. In addition, search robots are more loyal to sites with micro markup, which allows them to index new posts faster.

Checking Yandex and Google micro markup

In order to check micro markup in Yandex, you will need to go to the Yandex Webmaster panel and follow the link “Check micro markup” or “Micro markup validator”.

In order to validate the micro markup (check), you need to enter the url of the site page in the field provided for this. To make the check available, you need to register with Yandex Webmaster.

Google micro markup is checked at: google.com/webmasters/tools/richsnippets.

The verification here follows the same principle as in Yandex.

To begin with, you just need to check if micro markup was installed on your blog automatically. This usually happens when using free WordPress templates. Such markup will need to be removed before implementing the Shema.org markup.

WordPress micro markup with and without plugin

Created several years ago, schema org microdata is a standard for using microdata to describe the essence of objects on resource pages. That is, if, without markup, a search robot reads information about objects from its knowledge base about them, then micromarkup completely describes for it the type, name, path to the object, etc.

Typically, WordPress micro markup is done by introducing special attributes into the initial HTML code.

In the example below you can see the difference between codes with and without markup:

The website ruschema.org/docs/gs provides an incomplete list of Shema standards in Russian. In this article I will give examples of only initial attributes for marking up contacts, pictures, comments, and articles.

How to make micro markup for a website? Attributes for header

Let's start with the header.php file, which is responsible for reviewing the information in the site header.

To start markup, you should enter the corresponding schema.org attribute into the site header tag.

It looks like this: itemscope itemtype="https://schema.org/WPHeader"

It is very important to insert it correctly into the file code, otherwise the template may stop working.

We find the tag responsible for displaying the site header. I have this

After inserting the attribute, it should look like this:

Then in the site header file you need to find the lines that give the description and name of the site.

They might look like this:

1 2	<div id = "title" > "> ("name"); ?> ("description"); ?> </div>

">

In these divs containing the name and description of the site, you need to insert the following attributes:

itemprop="headline"

itemprop="description"

This is what the code should look like after inserting:

1 2 3

<div id = "title" itemprop = "headline" > "> ("name"); ?> <span itemprop="description" >

">

After this, you should check the page micro-markup again and make sure that the robot understands everything.

Article markup

After the site header has been marked up, you can begin micro-marking the posts. To do this, you should find the file that is responsible for reviewing articles. For example, this could be: single.php.

First, we find the tag responsible for displaying the content and insert the required attribute:

In addition, you need to find tags in the file that are responsible for displaying the post, article title, author's name, publication date and heading. You may have your own names and differ from those given in the example below.

And here are the Shema.org attributes that correspond to these objects:

itemprop="articleBody" – post output

itemprop="name" — title

itemprop="articleSection" - category

itemprop="datePublished" — date

This is what you should get:

Post conclusion:

1 2 3 4

<h1 class = "title" itemprop = "name" > <div class = "postdate" > <span itemprop="datePublished" > <span itemprop="author" > </div> </code>

Micro-tagging of pictures

The itemprop="image" attribute allows robots to quickly recognize information about pictures.

You need to insert it into the image code as follows:

1 2 3

<img itemprop="image" class = "size-full wp-image-3279 alignleft" style = "margin: -15px 0;" src = "https://site/wp-content/uploads/2014/12/konvers2.png" alt = "conversion" height = "256" width = "300" > !}

Comment markup

To create comment markup, you need to implement the following attributes:

itemprop="comment" itemscope="itemscope" itemtype="https://schema.org/UserComments"

itemprop="interactionCount" – number of comments

itemprop="commentTime" – creation time

itemprop="commentText" – comment text

You can implement attributes both in the code of a specific page and in the function.php file for one or another type of object.

Each file type has its own set of attributes, which you can study on the site with standards (url is given above), or using the attribute generator. For example, this schema-creator.org/ .

But there is another way to create micro-markup for a website using the schema.org standard, which is to use plugins. A popular WordPress micro-markup plugin is Schema Creator by Raven. By downloading and, you can customize and create new markup. With its help, you will have the opportunity to select the type of markup for a certain type of object, fill in the necessary fields with a description and get the finished code.

In addition, you can ask questions in the comments to the article.

Any webmaster is familiar with HTML markup. Typically, HTML tags tell the browser how to display the information enclosed within the tag. For example, tag

Avatar

means that the "Avatar" string should be displayed in the first level heading format. However, the HTML tag doesn't provide any information about the meaning of the string: "Avatar" could refer to a wildly successful 3D movie or a user profile picture. This makes it difficult for search engines to find information that matches the user's query.

Schema.org provides a publicly accessible dictionary that allows webmasters to mark up pages so that they are understandable to the most common search engines: Yandex, Google, Microsoft and Yahoo!.

itemprop="name">Avatar

Director: itemprop="director">James Cameron(born August 16, 1954) itemprop="genre">Fantastic itemprop="trailer">Trailer

Note that we've added an extra ... tag to bind the itemprop attribute to the corresponding text on the page. Tag does not affect the display of the page in the browser, so it is convenient to use in conjunction with itemprop .

Now search engines will be able to understand not only that http://www.avatarmovie.com is a link, but also that it is a link to the trailer for the science-fiction film “Avatar” directed by James Cameron.

Nested Entities

Sometimes a property value can be an entity itself, with its own set of properties. For example, a movie director can be described as an entity of type Person that has the properties name and birthDate. To indicate that a property value represents an entity, you must add the itemscope attribute immediately after the corresponding itemprop .

Avatar

itemprop="director" itemscope itemtype="http://schema.org/Person">Director: James Cameron(genus. August 16, 1954)

Fantastic Trailer

Schema.org Types and Properties

In addition to the Movie and Person types mentioned in the section, schema.org describes many different entity types, each of which has a defined set of properties.

The most general type of entity is a Thing, which has four properties: name, description, url and image. More specialized, private types share properties with more universal ones. For example, Place is a special case of Thing, and LocalBusiness is a special case of Place. Private types inherit the properties of their parent type. (Moreover, the LocalBusiness type is both a special case of Place and a special case of Organization, so it inherits the properties of both parent types.)

Here is a list of some popular entity types:

Additionally: machine-readable version of the information

Many pages can be marked up using only the itemscope , itemtype , and itemprop attributes (described in How to Markup Content Using Microdata) together with schema.org types and properties (described in How to Use the Schema.org Dictionary).

However, in some cases it is difficult for a robot to unambiguously interpret a property of an entity. This section describes how to add a machine-readable version of information to your page markup.

Dates, times and durations: use tag with datetime attribute

Robots are not always able to correctly understand the date and time. For example, "01/04/11" is January 11, 2004, January 4, 2011, or April 1, 2011? To uniquely set the date, use the tag along with the datetime attribute. The value of the datetime attribute is a date in the format YYYY-MM-DD. The following HTML code accurately specifies the date as April 1, 2011:

04/01/11

The time of day is specified in the format hh:mm or hh:mm:ss, with the prefix T. The time may be indicated along with the date:

May 8, 19:30

Let's look at the example in context: HTML code with information about a concert that will take place on May 8, 2011. Event type markup includes the event name, description and date.

itemscope itemtype="http://schema.org/Event">

itemprop="name">Spinal Tap

itemprop="description">One of the biggest bands of all time will reunite for an unforgettable two-night show. The concert will take place May 8 at 19:30

Duration is described in a similar way, using the tag and the datetime attribute. The attribute value is preceded by the prefix P (from the English period). For example, you can indicate in a recipe that the cooking time is one and a half hours, as follows:

itemprop="cookTime" datetime="PT1H30M"> 1 ½ hours

H stands for the number of hours and M stands for the number of minutes.

Date, time and duration formats follow the ISO 8601 standard.

Listings and links to canonical pages: use the link tag with the href attribute

Transfers

Some properties have a limited set of possible values. Programmers call them enumerations. For example, an online store can use the Offer entity type to provide a detailed description of a product offering. The availability property usually has one of several possible values: In stock, Out of stock, Pre-order, etc. Enumerated property values ​​can be specified as URLs, similar to types schema.org entities.

Here is a product offer, marked as an entity of type Offer, with the corresponding properties:

Blend-O-Matic $19.95 Is available for sale!

And here is the same sentence, marked up using and href , which allows you to uniquely specify one of the valid values ​​for the availability property:

Blend-O-Matic $19.95 Is available for sale!

Schema.org provides a list of possible values ​​for a small number of properties - in cases where the property has a limited set of typical values. Thus, the possible values ​​for the availability property are listed in ItemAvailability .

Catcher in the rye Author Jerome Salinger itemprop="url" href="http://en.wikipedia.org/wiki/The_Catcher_in_the_Rye">Wikipedia page

As you can see, the itemprop="url" attribute can be used to link to a page on another site (in this case, Wikipedia) that describes the same entity. Linking to third-party sites helps search engines better understand what your page is about.

Catcher in the rye Author Jerome Salinger

Missing or implicit information: use a tag with content attribute

Sometimes important information cannot be marked up due to the way it is displayed on the page. For example, the information is presented in a picture (image of a 4 out of 5 star rating) or in a Flash object (for example, the length of a video), or it is implied but not explicitly stated on the page (for example, the currency of the price).

In such cases, you can use the tag with the content attribute. The following example picture illustrates a rating of 4 stars out of 5:

Blend-O-Matic $19.95 25 ratings

And here is the same example with marked rating information.

Blend-O-Matic $19.95

itemprop="reviews" itemscope itemtype="http://schema.org/AggregateRating"> itemprop="ratingCount">25 ratings

This technique should not be overused. Use tag with the content attribute only for information that cannot be marked in any other way.

schema.org extension

Most sites and organizations will not need to extend schema.org. However, schema.org does provide the ability to add properties and child types to existing entity types. If you are interested in this, check out

• Internet
• Programs
• Instructions
• Browsers
• Windows 10
• Android
• iOS
• Connection

The last notes

How to adjust color on a computer?

Why do we need virtual machines?

How to disable Android updates: applications and system How to disable auto-updates of Android applications on Google Play

How to transfer contacts to xiaomi

Jabra Halo Smart review: long-lasting Bluetooth headphones Made in China

Popular

Highscreen Zera S - Specifications

Specifications of the Samsung I9300 phone: comparison with competitors and reviews

How to flash Lenovo S60, unlock bootloader, root and custom firmware?

News

2024-05-08 01:36:40

Transferring the Yandex browser cache to another drive

2024-05-08 01:36:40

A vertical stripe appears on the monitor - who is causing the problem?

2024-05-08 01:36:40

Wireless headphones AKG K912

2024-05-08 01:36:40

review of a beautiful phablet with a magical battery and a strange attitude towards toys

2024-05-07 01:41:22

MGTS toll-free hotline number: telephone number to contact the operator

viws.ru

viws.ru - All about modern technology. Breakdowns, social networks, internet, viruses

2024 - All rights reserved

• Contacts
• About the site
• Advertising on the website

• Internet
• Programs
• Instructions
• Browsers

• Internet
• Programs
• Instructions
• Browsers