Микроразметка статьи

Размечаем статьи с помощью Schema.org (Article) + HTML5:

<div itemscope itemtype="http://schema.org/Article">
<!-- Указываем основную старницу -->
<link itemprop="mainEntityOfPage" href="https://soltyk.ru/" />
<header>
<!-- передаем заголовок -->
<h1 itemprop="headline name">Пример микроразметки статьи</h1>
</header>
<!-- в link можно передавать ссылки на картинки и т.п., которые не увидит пользователь -->
<link itemprop="image" href="https://soltyk.ru/assets/images/soltykam.jpg">
<!-- указываем дату публикации -->
<span itemprop="datePublished" content="2018-06-18">Дата размещения</span>
<!-- в meta можно передавать скрытое текстовое значение, которое не будет отображаться пользователю -->
<!-- указываем дату обновления материала -->
<meta itemprop="dateModified" content="2018-09-15">
<!-- Для разметки author необходимо использовать словарь Person -->
<div itemprop="author" itemscope="" itemtype="http://schema.org/Person">
<link itemprop="sameAs" href="https://soltyk.ru/" />
<img itemprop="image" src="https://soltyk.ru/assets/images/soltykam.jpg" alt="Солтык Алексей"/>
<a href="https://soltyk.ru/ob-avtore"><span itemprop="name">Солтык Алексей</span></a>
</div>
<!-- Для разметки publisher необходимо использовать словарь Organization -->
<div itemprop="publisher" itemscope="" itemtype="http://schema.org/Organization">
<link itemprop="sameAs" href="https://soltyk.ru/" />
<!-- размечаем логотип -->
<div itemprop="logo" itemscope itemtype="https://schema.org/ImageObject">
<link itemprop="url image" href="https://soltyk.ru/assets/images/soltykam.jpg"/>
</div>
<meta itemprop="telephone" content="+7(981)970-8045">
<div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
<meta itemprop="streetAddress" content="Северный проспект, 8к1">
<meta itemprop="postalCode" content="194354">
<meta itemprop="addressLocality" content="Санкт-Петербург">
</div>
<meta itemprop="name" content="Солтык Алексей">
</div>
<!-- размечаем краткое описание статьи -->
<div itemprop="description">
<p>Текст краткого описания</p>
<p>...</p>
</div>
<!-- указываем подзаголовок статьи -->
<h2 itemprop="alternativeHeadline">Подзаголовок статьи</h2>
<!-- размечаем тело статьи -->
<div itemprop="articleBody">
<article>
<img itemprop="image" src="https://soltyk.ru/assets/images/soltykam.jpg" title="Какое-то изображение в статье" alt="Альтернативное название">
<p>Размечаем содержимое статьи!</p>
<p>...</p>
</article>
</div>
</div>

Данный пример можете использовать в качестве шпаргалки.

Такую разметку поддерживают поисковые системы Яндекс и Google, а также была замечена поддержка у Mail-а и Bing-а.

Я рекомендую размечать любые информационные материалы с помощью данной микроразметки.

Валидаторы микроразметки

Валидатор от Google

Валидатор от Яндексе

Валидатор от Bing

Делайте разметку так, чтобы в ней не было ошибок – при проверке в валидаторах поисковых систем.