How To Use Microdata When Creating A Website

How To Use Microdata When Creating A Website
How To Use Microdata When Creating A Website

Video: How To Use Microdata When Creating A Website

Video: How To Use Microdata When Creating A Website
Video: Facebook Microdata & Adding Schema to site 2024, December
Anonim

Consider the use of microdata (microdata) to give your site more semantic value and visibility to search engines.

Semantic web
Semantic web

Microdata or "microdata" is an innovation that has been brought to the world of the global web with the release of the new revision of the HTML5 standard. Microdata is a compact add-on over regular HTML markup, is logically related name-value pairs, and is based on the content of a web page. The purpose of microdata is to make text not just a collection of words, but to give it more semantic meaning. This means that the search robot, examining the content of your site, will be able to compose and analyze the links between the objects that you want to point him to. Sounds too complicated? Let's look at an example, and everything will become clear at once.

You host an event and post about it on your website without using semantic markup and microdata. Of course, the search robot will find keywords related to the event in the text and display it in the search results when requested. But the date, location, type of event, the search robot, most likely, will not be able to determine, and this data can be lost among all the rest of the information on the page. When using microdata, you yourself specify what kind of event, when and where.

For example, the issue of a search engine for some children's event. The top site does not use the semantic markup capabilities, while the bottom site does. Do you see the difference? In the first case, you need to read a block of information to find out the details, and in the second case, you immediately find what you need.

An example of a search engine issue with and without microdata
An example of a search engine issue with and without microdata

And this is just one example of the use of microdata. In fact, their applications are much wider, and there is every reason to believe that the number of use cases and the number of microdata sites will only grow.

How does it work? It's very simple, just add a few machine-readable attributes to the normal HTML markup. For example, this is what our markup would look like without microdata:

Children's performance "The Nutcracker" will take place on December 22 at the Olympic Sports Complex in Moscow.

And like this - with microdata:

Several new attributes have been added to the main html tags here:

  • itemscope - sets the scope of the microdata block;
  • itemtype - sets the type of microdata;
  • itemprop - sets the properties described by the microdata.

For example, in our case, the search robot will highlight the following information:

  • data type: event;
  • title: The Nutcracker;
  • date: December 22;
  • place: SC Olympic.

And the search robot will be able to process this data and present it to the user in a convenient form corresponding to the request. Depending on the type of microdata, this can be the ability to add an event to the calendar, or add a person's contact to the address book, or order a product, or buy a plane / train / bus ticket, etc.

But how does a search robot know what the word "event" is? To do this, you need to observe a certain agreement so that everyone uses the oin and the same so-called. A “dictionary” from which you can select the appropriate type of microdata. Currently, such a dictionary is the site schema.org and several other sites that store generally accepted microdata dictionaries.

To use these dictionaries, you must first select the appropriate data type. Data types are specified as URIs. For example, for an event, the appropriate type from the dictionary would be "Event" with the URI "https://schema.org/Event". This address may not lead to a real page on the Internet, it is only used to identify the type of microdata.

Thus, if we rewrite our example using a common vocabulary, we get the following markup:

Recommended: