Wordpress blog with semantic markup
More than a year has passed since Google, Bing and Yahoo proposed the Schema.org semantic markup standard. But webmasters are in no hurry to implement the recommendations of search engines on their sites. And in vain. For example, representatives of Yandex to the question about the impact of semantic markup on the ranking of the site answered the following:
“In many cases, the use of markup makes your site more visible in Yandex Search and thus attracts more of the target audience. Yandex, in turn, is interested in the fact that users solve the problems with which they came to Search. One of our quality metrics is called “user happiness”. Obviously, sites that increase “happiness” will rank higher. „
Those. the use of semantic markup, at least, indirectly affects the ranking of the site. And the truth is, because in many cases the site snippet with markup looks more informative and attractive to the user. Let's see how sites with different markup schemes look like:
1.Products with a rating
')
2. Review
As you understand, the user is more likely to click on such a snippet, and your site will receive a profit in the form of growth positions (if other factors are normal). Yandex also recommends using Schema.org markup instead of microformats, since The first more modern and fast-growing.
It was a small introduction on the importance of applying semantic markup, now let's proceed directly to practical application.
I was faced with the task of making a video blog, so I’ll continue to talk about the use of micromarking for this type of content. But on the model, you can make a catalog of organizations or a blog with new music and etc. As a platform, I used WordPress CMS.
To describe a video clip, you must:
Now we look, which of the micromarking schemes will suit us. Stop at VideoObject - http://schema.org/VideoObject . Those. we need to add an entry to the common container:
And each of the video parameters will be marked up using parameters:
or
It is clear that for each video we will not manually register information in html, we need to somehow simplify this process. From the title of the material we take the title for our video. With the description of the problems either. And to fill in the remaining fields, we will use the “Arbitrary Fields” function. If you don’t know about this functionality in Wordpress, then it’s time to pay attention. Simply put, arbitrary fields allow you to add any notes to any material. For example, to make a catalog of organizations using standard tools, you would add all organization data using a text editor: phone number, address, opening hours, or use third-party add-ons. And with the help of arbitrary fields, you can turn ordinary articles into a directory of arbitrary data.
So that the information (in this case, the micromarking code) entered in an arbitrary field could be used for output in the template, we will use the following code:
or
where thumbnail is the name of an arbitrary field.
In the field thumbnail we will enter links to screenshots to the video. It remains to add the embedurl fields for the link to the video file and the duration for displaying the duration. By the way, the last parameter is optional, besides, it requires entering the date in ISO 8601 format. Http://en.wikipedia.org/wiki/ISO_8601 . The name and description parameters are tied to the code sections where the title and description of the post are displayed.
As a player, I used the Stream Video Player plugin.
As a result, we get an example of such a snippet:
In principle, this could be finished, because These tricks will help you make a site with reviews of books, a site with recipes, etc. But since we started to mark the data on the site, then let's use all the possibilities of semantic markup.
Those same stars - http://schema.org/AggregateRating . Without them, a blog with reviews would look inferior. This scheme can also be used for online stores - rating of goods. For Wordpress, you don’t need to invent anything, the creators of the WP-PostRatings plugin have added the AggregateRating scheme to the code. It will only be necessary in the wp-postratings.php file (wp-content / plugins / wp-postratings) to find and delete the extra attribute itemscope itemtype = " schema.org/Product " . And note that this plugin already includes the parameters itemprop = "name" and itemprop = "description" , i.e. When installing this plugin, you do not need to add something to the title and description in the template.
In order to issue instead of site.ru/categoty/products7232 a human-readable chain site.ru/Mobile phones was displayed, install the RDFa Breadcrumb plugin. After activating the plugin, in the right place of the template, paste the code:
As it turned out, in order for Yandex to take the video object correctly, you need to add Open Graph markup ( http://ogp.me ). All meta tags for video objects in Open Graph markup duplicate data from Schema.org. You can get acquainted with the details http://help.yandex.ru/webmaster/?id=1116426 . By the way, the Open Graph markup is used by social networks. When a person posts a link to your site in the social. networks, header data, descriptions and images are taken from meta tags:
For Wordpress, there is an SEO Ultimate plugin that will form the Open Graph markup itself.
I hope these tips will help you transform the dull and monotonous snippets and, perhaps, improve the position of the site.
“In many cases, the use of markup makes your site more visible in Yandex Search and thus attracts more of the target audience. Yandex, in turn, is interested in the fact that users solve the problems with which they came to Search. One of our quality metrics is called “user happiness”. Obviously, sites that increase “happiness” will rank higher. „
Those. the use of semantic markup, at least, indirectly affects the ranking of the site. And the truth is, because in many cases the site snippet with markup looks more informative and attractive to the user. Let's see how sites with different markup schemes look like:
1.Products with a rating
')
2. Review
As you understand, the user is more likely to click on such a snippet, and your site will receive a profit in the form of growth positions (if other factors are normal). Yandex also recommends using Schema.org markup instead of microformats, since The first more modern and fast-growing.
It was a small introduction on the importance of applying semantic markup, now let's proceed directly to practical application.
I was faced with the task of making a video blog, so I’ll continue to talk about the use of micromarking for this type of content. But on the model, you can make a catalog of organizations or a blog with new music and etc. As a platform, I used WordPress CMS.
To describe a video clip, you must:
- clip name
- description
- screenshot
- video file
- specify the duration
Now we look, which of the micromarking schemes will suit us. Stop at VideoObject - http://schema.org/VideoObject . Those. we need to add an entry to the common container:
itemscope="" itemtype="http://schema.org/VideoObject" And each of the video parameters will be marked up using parameters:
<span itemprop=""></a> or
<meta itemprop="" content="" /> It is clear that for each video we will not manually register information in html, we need to somehow simplify this process. From the title of the material we take the title for our video. With the description of the problems either. And to fill in the remaining fields, we will use the “Arbitrary Fields” function. If you don’t know about this functionality in Wordpress, then it’s time to pay attention. Simply put, arbitrary fields allow you to add any notes to any material. For example, to make a catalog of organizations using standard tools, you would add all organization data using a text editor: phone number, address, opening hours, or use third-party add-ons. And with the help of arbitrary fields, you can turn ordinary articles into a directory of arbitrary data.
So that the information (in this case, the micromarking code) entered in an arbitrary field could be used for output in the template, we will use the following code:
<?php $image = get_post_meta($post->ID, 'thumbnail', true); if($image !== '') { ?> <meta itemprop="thumbnail" content="<?php echo $image ?>" /> <?php } ?> or
<?php $image = get_post_meta($post->ID, 'thumbnail', true); if($image !== '') { ?> <span itemprop=""><?php echo $image ?></a> <?php } ?> where thumbnail is the name of an arbitrary field.
In the field thumbnail we will enter links to screenshots to the video. It remains to add the embedurl fields for the link to the video file and the duration for displaying the duration. By the way, the last parameter is optional, besides, it requires entering the date in ISO 8601 format. Http://en.wikipedia.org/wiki/ISO_8601 . The name and description parameters are tied to the code sections where the title and description of the post are displayed.
As a player, I used the Stream Video Player plugin.
As a result, we get an example of such a snippet:
In principle, this could be finished, because These tricks will help you make a site with reviews of books, a site with recipes, etc. But since we started to mark the data on the site, then let's use all the possibilities of semantic markup.
Overall rating
Those same stars - http://schema.org/AggregateRating . Without them, a blog with reviews would look inferior. This scheme can also be used for online stores - rating of goods. For Wordpress, you don’t need to invent anything, the creators of the WP-PostRatings plugin have added the AggregateRating scheme to the code. It will only be necessary in the wp-postratings.php file (wp-content / plugins / wp-postratings) to find and delete the extra attribute itemscope itemtype = " schema.org/Product " . And note that this plugin already includes the parameters itemprop = "name" and itemprop = "description" , i.e. When installing this plugin, you do not need to add something to the title and description in the template.
Bread crumbs
In order to issue instead of site.ru/categoty/products7232 a human-readable chain site.ru/Mobile phones was displayed, install the RDFa Breadcrumb plugin. After activating the plugin, in the right place of the template, paste the code:
<?php if(function_exists('rdfa_breadcrumb')){ rdfa_breadcrumb(); } ?> Open graph
As it turned out, in order for Yandex to take the video object correctly, you need to add Open Graph markup ( http://ogp.me ). All meta tags for video objects in Open Graph markup duplicate data from Schema.org. You can get acquainted with the details http://help.yandex.ru/webmaster/?id=1116426 . By the way, the Open Graph markup is used by social networks. When a person posts a link to your site in the social. networks, header data, descriptions and images are taken from meta tags:
<meta property="og:title" content=""/> <meta property="og:description" content=""/> <meta property="og:image" content=""/> For Wordpress, there is an SEO Ultimate plugin that will form the Open Graph markup itself.
I hope these tips will help you transform the dull and monotonous snippets and, perhaps, improve the position of the site.
Source: https://habr.com/ru/post/152937/
All Articles