Расширенные сниппеты в Google. Как создать красивые сниппеты для Google

Расширенные сниппеты – это специальные тэги разметки, которые помогают повысить уровень релевантности контента для пользователей. Они также хорошо воспринимаются Google, так как идентифицируют различные части страницы.

Если Google может четко прочесть о том, что эта часть страницы представляет собой обзор, а та часть – раздел с информацией об авторе, то эти различия будут отображены прямо на странице результатов поиска.

Если верить словам Google:

Расширенные сниппеты – это специальные тэги разметки, которые веб-мастеры могут применять на сайтах для того, чтобы сообщать Google, какой тип контента имеется на страницах, чтобы система могла лучше отображать их в результатах поиска.

  • Пример расширенных сниппетов – тэг разметки автора

Тэг разметки автора поддерживается Google, так как он помогает определить различные отрывки контента в интернете, принадлежащие одному и тому же автору. Это очень выгодно для блоггеров и авторов гостевых постов, которые могут публиковаться на нескольких вебсайтах, так как этот тэг всегда сообщает Google о том, кто создал этот контент.

Атрибут href ссылается на страницу автора. Google получает возможность вывести имя, изображение и контент, на который идет ссылка с авторской страницы, для отображения в поисковой выдаче. Только сейчас уже более актуален способ вывода автора через сеть Гугл Плюс, в будущем его рассмотрим.

Что Расширенные сниппеты делают для SEO?

Ниже вы видите результат выдачи в гугл по рецептам, пример с англоязычного поиска, у нас чуть меньше функциональности пока что.

Так как использование сниппетов стремительно распространяется, результаты поисков очень скоро будут максимально оптимизированы и приближены к желаемому результату. Они будут отображать больше информации, которая поможет пользователям делать более четкие решения о том, какие сайты следует посетить. Осуществляя поиск рецептов, результаты с изображениями и очками рейтинга более вероятно привлекут внимание, нежели страницы с полотном текст.

Разрабатывая вебсайт с учетом удобства его использования, вы повышаете собственные шансы на то, чтобы попасть в топ выдачи поисковых систем. И поэтому вам обязательно следует внедрять эту стратегию. Сниппеты будут удобны и полезны каждому!

  • Возможно, это поможет вам в самом начале:

Все знают о SEO, и о том, как она влияет на удачу. Некоторые элементы вроде частотности ключевых слов – это основное знание, но существуют и другие элементы, о которых также следует знать! Хотя это вряд ли серьезно повлияет на естественный прирост рейтинга, в целом все методы будут работать хорошо!

  • Проверка правильности настройки сниппетов через инструмент — Rich Snippets Testing
  • Вопросы-Ответына на этой странице

Пусть это будет вводной статьей, в будущем в следующих частях обязательно нужно будет рассмотреть все способы формирования снипетов как в Гугл, так и в Яндексе.

Обновление: Вторая часть — , как добавить фото автора в сниппеты.

Всем привет! Сегодня я расскажу вам о том, как сделать расширенный сниппет в выдаче поисковой системы Google, в котором будет информация об авторе блога и его фотография из Google+. Такой сниппет придаст вашему сайту индивидуальность в поисковой выдаче и выделит его из толпы.

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

(от англ. snippet – отрывок, кусок ) – это небольшое описание страницы или вырванный из контекста кусок текста, который выводится на странице результатов поиска.

В Гугле сниппет берется из мета-тега description , то есть из описания статьи. Яндекс берет наиболее подходящий отрывок из текста статьи, реже берет сниппет из тега description .

Расширить сниппет, как в Яндексе, так и в Гугле можно множеством различных способов. Сегодня я рассмотрю способ, который позволяет добавить фотографию из вашего профиля в Google+ и информацию о вас. Эта информация будет отображаться для каждой страницы вашего сайта в выдаче.

Вот так это будет выглядеть:

Все это дает нам несколько плюсов в сравнении с другими сайтами:

  • Во-первых, в выдаче наш сайт будет отличаться от других сайтов, поэтому пользователи ПС (поисковых систем) в большинстве случаев перейдут именно на наш сайт (вспомните себя при поиске информации 🙂 , всегда есть желание перейти по блоку, который лучше оформлен) Из этого следует повышение ctr (отношение количества кликов к количеству просмотров поисковой выдачи)
  • Во-вторых, повышается доверие посетителей к нашему сайту. Фотография рядом со сниппетом показывает, что блог ведет реальный человек, который не скрывает себя.
  • Ну и наконец, мы подтверждаем авторство своих статей в гугле. То есть, если обнаружатся копии ваших статей в сети, то гугл будет знать, что автор этой статьи именно вы, и не станет понижать ваш сайт в выдаче.

Теперь давайте разберемся с тем, как сделать расширенный сниппет в google.

1. Первое что нужно сделать, это зарегистрироваться в Google+ , если вы этого еще не сделали.

2. Заполните свой профиль и добавьте туда фотографию. Особое внимание обратите на пункты Мои публикации и . В пункте Мои публикации добавите ссылку на свой сайт, а в пункте добавьте e-mail вида текст@ваш_домен.ru и подтвердите его. Очень важно, чтобы почта располагалась именно на домене вашего сайта!!!

‹a href=»google+id?rel=author»›author_name‹/a›

где google+id — это id вашего профиля.

Также можно поставить кнопку Google+ . По умолчанию там стоит другая ссылка, но я ее тоже изменил на ту, что выше.

Проверить, все ли правильно вы сделали, можно на этой странице . Введите адрес своего сайта или конкретной страницы и нажмите Preview . На выходе должно получиться примерно следующее (кликабельно):

Если вы допустили какую-нибудь ошибку, то гугл сам натолкнет вас на решение проблемы. Если вы все сделали правильно, то расширенный сниппет должен появиться при следующем обновлении выдачи. Для этот процесс занял примерно полторы недели.

Надеюсь у вас все получится 🙂 . Удачи! Не забудьте моего блога, чтобы первым получать интересные статьи.

Безусловно, если ваш сайт находится по какому-то запросу на первой странице выдачи поисковой системы – это хорошо. К этому нужно стремиться, это будет решающим фактором в популярности вашего проекта, и от этого будет зависеть ваша прибыль (если проект коммерческий). Но, следует заметить, что трафик на первую позицию в поиске и на 10-ю это разные вещи. Существует много статистических исследований, которые дают примерные проценты распределения трафика по позициям. Точные данные вы сможете найди где-то в другом месте. Ясно одно: чем дальше от первой позиции – тем меньше трафик. Десятая позиция в Google потенциально может дать примерно 10% от всех посетителей набравших этот запрос. И это при том, что она более кликабельная, чем 9-я (потому, что крайняя снизу).

Немного теории

Логическим завершением любого поискового запроса, сделанного человеком, должен быть переход на сайт, где есть именно то, что человек искал. После нахождения такого сайта, человек испытывает моральное удовлетворение и прекращает поиск. По-этому, если на первой странице выдачи выше вашего сайта есть много качественных и профессионально сделанных проектов – то вам стоит надеяться только на чудо. Выход один – делать качественный сайт. Но, есть все-таки один момент, который может дать немного преимущества – нужно заставить человеческий глаз сфокусироваться именно на описании вашего сайта в результатах выдачи. Я не буду затрагивать тему о том, что нужно создавать информативные сниппеты, чтобы в них был намек на то, что сайт содержит именно то, что нужно. Это все понятно. Давайте представим, что все 10 сайтов из выдачи имеют качественные информативные сниппеты. Что в этом случае можно сделать, чтобы привлечь больше внимания?

Как повысить CTR сайта в поисковой выдаче Google?

Выход есть. Чтобы увеличить кликабельность сниппета (CTR – clickthrough rate), нужно как-то визуально выделить ваш сайт в результатах поиска Google от остальных. Человек всегда будет обращать внимание на отличия в общей однородной массе. Текст описаний сайтов (сниппет) – это и есть масса, масса текста. Если не фокусироваться на каких-то отдельных словах, а смотреть как-бы сквозь текст, за него, то ничего особенного в глаза не бросается. Чтобы текст сниппета бросался в глаза нужно делать либо сгустки пикселей в какой-то части, либо делать пустое пространство, либо делать вертикальные расчески (несколько одинаковых строк текста одна под другой).

Почему сниппеты для Google, спросите вы? Он самый предсказуемый в плане отображение сниппетов. Только Google будет отображать то, что я ему укажу. На самом деле, любой владелец сайта должен иметь возможность сам выбирать, как будет выглядеть его описание в выдаче, а не так, как захочет Yandex .

Как же Google формирует сниппет сайта? В формировании описания сайта в результатах выдачи принимают участие: тэг , <meta name=”description”>, содержимое параметра alt=”” первой картинки в <a href="/multimedia/ispolzovanie-probelnyh-simvolov-dlya-formatirovaniya-koda-html-nerazryvnyi.html">html коде</a>, текст внутренних и <a href="/download/obnovlenie-faila-s-pomoshchyu-palitry-vneshnie-ssylki-sistema-avtomatizirovannogo-proektirovaniya-autoca.html">внешних ссылок</a>, описание сайта в каталоге Dmoz, или просто текст со страницы сайта. Также, в <a href="/social-network/why-do-not-show-me-what-time-they-went-in-how-to-hide-the-last-visit-time-in-watsapp-whatsapp.html">последнее время</a> появилось много возможностей выделить свой сайт с помощью микроформатов для расширенных <a href="/internet/kak-sdelat-rasshirennyi-snippet-v-google-delaem-rasshirennyi-snippet-v.html">сниппетов Google</a>. Но, это уже тема для другой статьи. Возможно, я все-таки найду в себе силы и реализую давно задуманный проект по созданию сниппетов для Google, и всему, что с этим связано.</p> <p>Если не пустой <b><title> </b> – первая строка сниппета формируется из него. Если <b><title> </b> пустой – то Google может выбрать текст первой ссылки, которая содержит набранное <a href="/multimedia/kak-opredelit-poiskovye-zaprosy-operator-minus---ubrat-opredel-nnye.html">ключевое слово</a>, если таких нет, то текст самой первой ссылки в html-коде или часть основного текста.</p> <p>Две другие строки сниппета (иногда три) формируются так, чтобы содержать текст, релевантный поисковому запросу. Если <b><meta name=”description”> </b> не пустой и релевантен запросу, то описание сайта берется из него. Есть определенный <a href="/internet/maksimalnyi-razmer-faila-podkachki-windows-7-kak-uznat-rabotaete.html">максимальный размер</a> <b>description </b>, если текста в нем мало, то Google заполняет <a href="/tools/pochemu-vinda-zanimaet-mnogo-mesta-zakanchivaetsya-svobodnoe.html">свободное место</a> релевантными кусками из текста. Если <b><meta name=”description”> </b> пустой, но параметр <b>alt=”” </b> первой картинки <b><img> </b> не пустой, то берется этот текст. Если <b>description </b> нерелевантен запросу, то описание сайта фомируется из кусков релевантного текста (на усмотрение Google).<br> Если сайт присутствует в <b>Dmoz </b>, то Google может брать данные для сниппета оттуда. Чтобы отключить показ описания сайта из Dmoz, нужно вставить на сайт этот html-код: <b><meta name=”robots” content=”noodp”> </b>.</p> <p>Для того, чтобы влиять на создание сниппета, нужно из всего выше перечисленного выделить самый <a href="/tools/wix-novye-prilozheniya-i-poleznye-funkcii-wix-novye-prilozheniya-i-poleznye.html">подходящий вариант</a>: <b><title> должен быть не пустой </b>; <b><meta name=”description”> не пустой, релевантный запросу, не короткий </b>. Дальше, дело техники.</p> <h2>Оптимизация сниппетов Google. Перейдем к практике </h2> <p>Задача: сфокусировать глаза пользователя на описании вашего сайта. Я предлагаю делать сгустки в тексте. Для этого очень хорошо подходит любое повторение одного и того же символа много раз: AAAAAAAAA, WWWWWWWWW, iiiiiii, 88888, @@@@@@@@, ##########, [[[[[[[[, < <<<< >>>>>>, и так далее. Любые графические спецсимволы тоже подойдут: ❄ ❆ ☀ ☁ ☂ ☔ ☽ ★ ☎ ☘ ☙ ☢ ☑ ☒ ☯ ☗ ☰ ☱ ☲ ☲ ☴ ☵ ☶ ☷ ☻ ♠ ❤ ♦ ◆ ♨ ♬ ♻ ♼ ⚀ ⚅ ⚈ ⚉ ⚑ ⚫ ▂ ▃ ▅ ▆ ██ ▒▓ ▀▄▀▄ ═ ╬ ╦ ╩ ╦ ❥ ✿ ❋ ✩ ✮ ✯ ✰ ❶ ❷ ❸ ❹ ❺ ❻ ❼ ❽ ❾ .</p> <p>Вся сложность заключается в том, чтобы забить текстом <b>description </b> под завязку, и заставить Google перенести текст на вторую строку так, как нам нужно. Это не так сложно, нужно знать всего пару нюансов. На самом деле этот перенос делается браузером, когда превышается ширина поля, содержащее текст (за это отвечает гугловский css-класс). Ну, и максимальный размер description у меня получился 155 символов. Тоесть, нужно сделать такой блок текста, чтобы он был по максиму близок к 155 символам и произошел принудительный перенос в нужном нам месте на вторую строчку. Управлять переносом можно, зная, что браузер не разрывает слова. Единственное замечание, нельзя просто взять и сделать всю вторую строчку из одного неразрывного слова – google ее не примет и поставит троеточие (…). нужно внутри вставить слова и символы, которые гугл понимает как пробел: дефис, подчеркивание (я еще не протестил все <a href="/graphics/nastroika-interneta-mts-vse-vozmozhnye-varianty-kak-nastroit-mobilnyi.html">возможные варианты</a>, иногда хвост такого описания после слова обрубает до самого конца). Старайтесь пока во второй строчке привязывать подобный “хвост” после текста не пробелом.</p> <h2>Закрепим полученную информацию на реальном примере</h2> <p>Так как я уже начал замечать в выдаче Google сайты, которые используют мои методы создания сниппетов, то считаю, что пришло время расскрыть немного свои карты .</p> <p><img src='https://i1.wp.com/saney.ru/wp-content/uploads/2011/10/snippets1.gif' width="100%" loading=lazy></p> <p>В этом сниппете используется “#” в title и description. Несколько таких символов подряд отлично концентрируют на себе внимание.<br> Звездочки ★ тоже очень сильно заметны. Здесь я использовал их, чтобы изобразить рейтинг отзывов. Получилось неплохо. Я думаю, что слово “««- recommended” тоже не останется без внимания, ведь возле остальных сайтов такой надписи нет. Также, в сниппете присутствует email компании. Но, больше всего привлекает внимание конечно же эта конструкция с ❺. На другом сайте, где ипользуется подобный шаблон сниппета, средний CTR 9-й позиции на 1-й странице результатов Google равен примерно 12%. Это <a href="/graphic-editors/kakoi-iz-dannyh-servisov-chast-google-facebook-prilozhenie-servisy-google-play-chto-eto-takoe-i.html">данные Google</a> Webmasters Tools за последние 3 месяца.</p> <p><b>Как это можно сделать? </b></p> <p>Эту красоту можно сделать с помощью специальных микроформатов данных, которые Google уже давно использует при отображении сайтов. Я не буду в этой статье расписывать подробно, что это, а остановлюсь на нашем примере.</p> <p>Чтобы сделать такой сниппет с ❺, нужно вставить в html-код вашего сайта такой текст:</p> <p><div xmlns:v=”http://rdf.data-vocabulary.org/#”><br> <span typeof=”v:Breadcrumb”><a href=”http://вашсайт.com/” rel=”v:url” property=”v:title”>Ваш текст</a> › </span><br> <span typeof=”v:Breadcrumb”><a href=”http://вашсайт.com/раздел-сайта.php#content” rel=”v:url” property=”v:title”>❺❺❺❺❺</a> › </span><br> <span typeof=”v:Breadcrumb”>Ваш текст</span><br> </div></p> <p>В результате моих экспериментов был найден способ, как заставить Google показывать один и тот же текст возле URL сайта. А также была решена проблема с показом такого сниппета для главной страницы сайта. Для этого нужно в структуре Breadcrumb в том месте, где прописывается внутренний раздел сайта, просто дописать так называемую “хеш-ссылку” к <a href="/android/vybivaet-iz-kontakta-na-glavnuyu-stranicu-pochemu-postoyanno-obnovlyaetsya.html">главной странице</a> /#hash. Где hash – это id какого-нибудь элемента на вашей странице.</p> <p>Также, стоит заметить, что Google уже обратил внимание на такие сниппеты. Если раньше можно было использовать такие приколы как ▀▄▀▄▀ или ████ ☑, то сейчас многие из таких символов уже запрещены к показу возле URL. Или же они показываются только в региональных выдачах, а в google.com не работают (или работают, но <a href="/multimedia/kak-sdelat-hlebnye-kroshki-wordpress-plagin-yoast-seo-nash-luchshii-pomoshchnik.html">хлебные крошки</a> должны быть короткими и начинаться с буквы).</p> <p><img src='https://i1.wp.com/saney.ru/images/snippets.gif' height="73" width="350" loading=lazy></p> <p>Еще одна фича, которая все-еще работает – это возможность прописать в Breadcrumb URL другого сайта (вместо ссылки на раздел сайта, не home page) . Тогда со сниппета Google можно будет переходить на другой сайт, если пользователь кликнет по такой ссылке, как ❺❺❺❺❺ в нашем примере. Это может быть использовано “черными оптимизаторами”, чтобы без ипользование редиректов направлять трафик из профилей форумов на свои сайты. Или же можно использовать в качестве другого url сервис bit.ly, чтобы узнать как пользователи кликают на сниппет.</p> <h2>Генератор сниппетов для Google</h2> <p><i>Данная статья была написана в 2008 году, после нескольких лет успешного применения описанных техник на практике. С тех пор многое изменилось, но основная идея осталась прежней. </i></p> <p>Не забудьте понажимать на <a href="/players/my-v-socsetyah-knopki-pluso-knopki-socialnyh-setei-kak.html">социальные кнопки</a>, если вам понравилась статья </p> <p>Для того, чтобы дать пользователю <a href="/graphic-editors/dopolnitelnaya-informaciya-ili-chto-eshche-my-znaem-ob-oblakah-kak-obrazuyutsya.html">дополнительную информацию</a>, ещё до посещения сайта в поисковой выдаче, такие системы, как Google и Яндекс, создали расширенные сниппеты. Они же помогают выделить более качественные сайты, которые готовы внедрять новшества и развиваться.</p> <p>Сами по себе они представляют собой результат поисковой выдачи, который был расширен благодаря одному из дополнений. У каждого поисковика существует собственные системы, а также свои правила для их подключения.</p> <p>Не иже будет представлена информация о всех возможных вариациях этих дополнений, а также способах их получения.</p> <p>В Яндексе на сегодняшний день существует огромное количество <a href="/graphics/ustanovka-skriptov-v-razlichnye-brauzery-ustanovka-skriptov-v-razlichnye.html">различных расширений</a> для поисковой выдачи, чтобы пользователи могли получить максимум информации о сайте и выбрать из представленных вариантов максимально подходящий.</p> <p><img src='https://i2.wp.com/web-rynok.ru/wp-content/uploads/2018/12/img_5c094f0eb58d5.png' align="center" width="100%" loading=lazy></p> <p>Значок Турбо можно получить только после подключения специального YML файла в вебмастере в разделе «Турбо-страницы»-«Источники». Подробнее о технической составляющей <a href="/download/chem-mozhno-otkryt-dbf-fail-fail-dbf-struktura-i-sposoby-otkryt-bazu-dannyh.html">данного файла</a> <span>https://yandex.ru/support/webmaster/turbo </span>/ .</p> <p><img src='https://i0.wp.com/web-rynok.ru/wp-content/uploads/2018/12/img_5c0957e4df4db.png' align="center" width="100%" loading=lazy></p> <h2><span>Расширенные спиппеты в Google </span></h2> <p>В Google также для получения <a href="/social-network/kak-uznat-seriinyi-nomer-xiaomi-kak-uznat-podrobnuyu-informaciyu-o.html">подробной информации</a> о сайте или странице также имеются расширенные описания.</p> <p>Наиболее часто встречающиеся это быстрые ссылки. Они позволяют минуя основную страницу ознакомится с дополнительными материалами или информацией. Сильно расширяют ответ в выдаче и помогают выделиться.</p> <p><img src='https://i2.wp.com/web-rynok.ru/wp-content/uploads/2018/12/img_5c09585d069cf.png' align="center" width="100%" loading=lazy></p> <p><img src='https://i0.wp.com/web-rynok.ru/wp-content/uploads/2018/12/img_5c09590856c06.png' align="center" width="100%" loading=lazy></p> <p>Недавно появившийся список ответов, показывающий прямо в выдаче последние комментарии. Полезен для форумов, отзовиков и сервисов вида вопрос/ответ. Показывается только в мобильной выдаче.</p> <p><img src='https://i2.wp.com/web-rynok.ru/wp-content/uploads/2018/12/img_5c09596e686d7.png' width="100%" loading=lazy></p> <p>Эмблема AMP выдаётся сайтам, контент которых будет загружен моментально. Появляется только в мобильной выдаче.</p> <p><img src='https://i2.wp.com/web-rynok.ru/wp-content/uploads/2018/12/img_5c0959cddb433.png' align="center" height="470" width="433" loading=lazy></p> <p>Цены, сроки доставки и другие атрибуты для продажи товаров. Предоставляют возможность прямо из списка ответов выбрать подходящий сайт для покупки выбранного товара.</p> <p><img src='https://i1.wp.com/web-rynok.ru/wp-content/uploads/2018/12/img_5c095a32dbded.png' align="center" width="100%" loading=lazy></p> <p>Библиотека представлений, когда можно оформить в поисковой выдаче страницу для каждого типа материалов, среди которых:</p> <ul><li>Рецепты;</li> <li>Фильмы;</li> <li>Вакансии;</li> <li>Набор данных;</li> <li>Продукты;</li> <li>Телесериалы;</li> <li>Мероприятия;</li></ul> <p><b>Сниппет - это небольшое текстовое описание </b>, которое присутствует вместе со ссылкой в поисковой выдаче. Он дает пользователю информацию о материале, предоставленном той или иной страницей сайта в результатах выдачи по заданному запросу.</p> <p>За счет сниппетов пользователю облегчается задача в процессе выбора наиболее подходящего для него материала. Среди всех предоставленных ему ссылок, человек может выбрать только такие, которые наибольшим образом подходят под его <a href="/players/kolichestvo-poiskovyh-zaprosov-google-analiz-otcheta-poiskovye-zaprosy-chem-mozhet.html">поисковый запрос</a>.</p> <p>Чем привлекательней будет выглядеть описание страницы, тем <a href="/tools/kak-nazyvaetsya-prilozhenie-na-aifon-s-mordochkami-bolshaya.html">больше вероятность</a>, что посетитель перейдет на данный сайт. Поэтому сниппет является одним из важных элементов поискового продвижения.</p> <p>Вот, например, как выглядит в Яндекс сниппет по запросу "как раскрутить сайт":</p> <p>Как мы видим, Яндекс выделяет синоним запроса в title, в быстрых ссылках и точные формы запроса в тексте страницы. Как сделать, чтобы нужная часть текста попала в сниппет?</p> <ul><li>Желательно чтобы в предложении присутствовала <a href="/multimedia/poiskovye-zaprosy-v-google-yazyk-poiskovyh-zaprosov-yandeksa-kak-zadat-poisk-tochnoi.html">точная форма</a> запроса.</li> <li>Также увеличивает вероятность попадания в сниппет нахождение в этом же предложении или рядом повторения запроса или его синоним.</li> </ul><p>То есть Яндекс берет и "вырывает" кусок текста из страницы (до 240 знаков), где наиболее плотно расположены .</p> <p>В результатах <a href="/graphic-editors/raspoznat-po-fotografii-poisk-po-zagruzhennomu-izobrazheniyu-foto-ili.html">поиска Yandex</a> и Google можно видеть как обычные сниппеты, так и расширенные. Последние наиболее <a href="/players/kak-sozdat-obraz-ustanovlennoi-sistemy-sozdanie-tochnoi-kopii.html">точным образом</a> описывают предоставляемую страницу пользователю в результатах поисковой выдачи. Вот поэтому расширенные сниппеты в последнее время стали наиболее предпочтительными и популярными. Стоит помнить еще и о том, что в различных поисковых системах они создаются разными способами.</p> <h3>Расширенные сниппеты Яндекса</h3> <br><img src='https://i0.wp.com/raskruty.ru/img/snippet/rasshirennyj-snippet.png' width="100%" loading=lazy><p>В поисковой <a href="/android/chto-luchshe-yandeks-ili-gugl-sravnenie-poiskovikov-sravnenie-poiskovyh-sistem.html">системе Yandex</a> присутствуют <b>расширенные сниппеты (англ. rich snippets) </b>, которые предоставляют пользователю быстрые ссылки на <a href="/graphic-editors/kak-udalit-vse-zakladki-v-brauzere-google-chrome-dlya-chego-nuzhen.html">нужные разделы</a> ресурса, адрес организации либо компании (указывается и место на карте Яндекса) и т.д.</p> <p>Подробная информация предоставляется о заведениях общественного питания (барах, кофейнях, ресторанах и пиццериях), музеях, кинотеатрах, аэропортах, автошкол, различных фитнес-центрах и пр. Помимо этого, расширенные сниппеты Yandex могут показывать информацию о <a href="/codecs/anastasiya-skripnikova-kulinarnye-recept-na-million-ot.html">кулинарных рецептах</a>, вакансиях, рефератах, товарах, словарях и т.д.</p> <p>Яндекс, как и поисковая <a href="/android/operatory-poiskovoi-sistemy-google-php-nasledovanie.html">система Google</a> также обладает поддержкой <a href="/internet/vnimanie-adblock-zablokiroval-zagruzku-javascript-failov-otklyuchenie-adblock-v.html">семантической разметки</a> информации в микроформатах. К примеру, для разных рецептов применяется разметка в таком микроформате как hRecipe.</p> <p>При предоставляется возможность управления разметкой информации на страницах и таким образом можно оказывать влияние на формирование данных, которые будут содержаться в расширенном сниппете.</p> <h2>Сниппеты Google</h2> <p>Вот как выглядит сниппет в Google по тому же запросу (описание взято из description):</p> <br><img src='https://i2.wp.com/raskruty.ru/img/snippet/snippet-google.png' width="100%" loading=lazy><p>В отличии от Яндекса в основном создается из тега description и имеет меньшее количество знаков. Поэтому уделите особое внимание заполнению этого тега. Делайте описания страниц привлекательными для пользователя и с употреблением нужных ключевых слов.</p> <p>Расширенные сниппеты Гугл также имеют предназначение, чтобы детализировать информацию о предоставленных в поисковой выдаче страницах. В зависимости от того какой поисковый запрос задает пользователь сниппет Гугл также содержит разнообразную специальную информацию. К примеру, рейтинг, адрес, список <a href="/download/adding-tabs-to-google-chrome-bookmarks-quick-link-to-chrome.html">быстрых ссылок</a>, фотографии и т.д.</p> <p>Для различного рода и типа контента, поисковая система Google может показывать дополнительную информацию: люди, события, организации и компании, музыка, рецепты и другое. Чтобы управлять расширенными сниппетами на страницах ресурса, нужно применять один из трех вариантов сематической разметки информации: <b>микроформаты </b> (microformats), <b>микроданные </b> (microdata) либо же RDFa.</p> <p>Микроформаты – необходимо использовать для составления описания разных сущностей (элементов) и их свойств, это атрибут class в HTML-тегах. Микроданные – это рекомендованный поисковой системой Гугл вариант разметки, как и микроформаты, который позволяет поисковому роботу узнать об особых видах информации присутствующей на сайте, блоге и т.д.</p> <p>Для микроданных обычно используют такие атрибуты как itemprop, itemsscore, itemtype в HTML-тегах (доступно в HTML5). Делается это для того, чтобы таким свойствам или элементам контента давать <a href="/graphic-editors/chto-takoe-domennoe-imya-chto-takoe-www-kratkie-vyvody-vse-to-zhe-no-gorazdo.html">краткие имена</a> при их описании.</p> <p>При использовании формата RDFa обычно используются XHTML-теги. Необходимо отметить, что для всех трех вариантов разметки специальной информации доступна вложенность, которая предоставляет возможность связывать между собой <a href="/graphic-editors/metalloiskateli-princip-deistviya-i-osnovnye-harakteristiki-razlichnye-vidy.html">различные виды</a> описываемых данных на страницах.</p> <p>Как заявляют сотрудники поисковых систем, сниппеты Гугла или Яндекса влияния на позицию сайта в выдаче не оказывают. Хотя при этом оказывают огромную помощь для пользователей при выборе <a href="/multimedia/kak-otpisatsya-ot-uslug-na-telefone-poluchenie-neobhodimoi-informacii.html">необходимой информации</a> среди результатов, предоставленных поисковиком.</p> <p>Таким образом, благодаря тому, что <a href="/text/sovremennye-tendencii-v-razrabotke-informacionno.html">поисковые системы</a> обладают возможностью показывать расширенные сниппеты, описание сайта или блога станет наиболее привлекательным для пользователей. А это означает, что на ваш сайт придут новые целевые посетители.</p> <script type="text/javascript"> <!-- var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})() //--> </script><br> <br> <script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+ ";"+Math.random()+ "border='0' width='1' height='1' loading=lazy>");</script> </div> <div class="social-share"> <p class="title">Понравилась статья?</p> <div class="share js-socials-share"></div> </div> <div class="related-posts"><div class="wp_rp_wrap wp_rp_plain" id="wp_rp_first"><div class="wp_rp_content"><div class="row js-advices-row"> <div class="col-sm-4"> <div class="post-announce" data-position="0" data-poid="in-6915" data-post-type="none"><a href="/multimedia/pochemu-planshet-vidit-vai-vash-noutbuk-telefon-ili-planshet-ne.html" class="wp_rp_thumbnail thumb"><img src="/uploads/27136ad6f13ab03918457c0dffe7228f.jpg" alt="Ваш ноутбук, телефон или планшет не видит Wi-fi?" / loading=lazy></a> <div class="announce-body"> <p class="title"><a href="/multimedia/pochemu-planshet-vidit-vai-vash-noutbuk-telefon-ili-planshet-ne.html" class="wp_rp_title">Ваш ноутбук, телефон или планшет не видит Wi-fi?</a></p> </div> </div> </div> <div class="col-sm-4"> <div class="post-announce" data-position="0" data-poid="in-6915" data-post-type="none"><a href="/graphics/windows-ne-mozhet-poluchit-dostup-k-setevoi-papke-windows-ne-mozhet.html" class="wp_rp_thumbnail thumb"><img src="/uploads/18f22b7af886fa73e6ccece303be3579.jpg" alt="Windows не может получить доступ к сетевой папке Ошибка нет прав доступа фипи что делать" / loading=lazy></a> <div class="announce-body"> <p class="title"><a href="/graphics/windows-ne-mozhet-poluchit-dostup-k-setevoi-papke-windows-ne-mozhet.html" class="wp_rp_title">Windows не может получить доступ к сетевой папке Ошибка нет прав доступа фипи что делать</a></p> </div> </div> </div> <div class="col-sm-4"> <div class="post-announce" data-position="0" data-poid="in-6915" data-post-type="none"><a href="/utilities/utility-dlya-remonta-zhestkogo-diska-transcend-programmy-dlya.html" class="wp_rp_thumbnail thumb"><img src="/uploads/6bf4b952fdfd559d12c2e2ea8e5c736e.jpg" alt="Программы для восстановления флешек" / loading=lazy></a> <div class="announce-body"> <p class="title"><a href="/utilities/utility-dlya-remonta-zhestkogo-diska-transcend-programmy-dlya.html" class="wp_rp_title">Программы для восстановления флешек</a></p> </div> </div> </div> <div class="col-sm-4"> <div class="post-announce" data-position="0" data-poid="in-6915" data-post-type="none"><a href="/tools/vnedrenie-sistemy-as-wms-effektivnoe-upravlenie-skladskimi-resursami.html" class="wp_rp_thumbnail thumb"><img src="/uploads/8f432ab49859e93ee3efe26cc74ee4a8ub-250x200.png" alt="Внедрение системы AS WMS: Эффективное Управление Складскими Ресурсами" / loading=lazy></a> <div class="announce-body"> <p class="title"><a href="/tools/vnedrenie-sistemy-as-wms-effektivnoe-upravlenie-skladskimi-resursami.html" class="wp_rp_title">Внедрение системы AS WMS: Эффективное Управление Складскими Ресурсами</a></p> </div> </div> </div> <div class="col-sm-4"> <div class="post-announce" data-position="0" data-poid="in-6915" data-post-type="none"><a href="/android/kak-vklyuchit-spyashchii-rezhim-na-huavei-nastroika-spyashchego-rezhima.html" class="wp_rp_thumbnail thumb"><img src="/uploads/04c6a46310e45055f21b51b1e00ad479.jpg" alt="Настройка спящего режима в Android или как сделать, чтобы экран не отключался" / loading=lazy></a> <div class="announce-body"> <p class="title"><a href="/android/kak-vklyuchit-spyashchii-rezhim-na-huavei-nastroika-spyashchego-rezhima.html" class="wp_rp_title">Настройка спящего режима в Android или как сделать, чтобы экран не отключался</a></p> </div> </div> </div> <div class="col-sm-4"> <div class="post-announce" data-position="0" data-poid="in-6915" data-post-type="none"><a href="/tools/remont-ajjfona-sovety-i-prakticheskie-navyki.html" class="wp_rp_thumbnail thumb"><img src="/uploads/0bce8f387f89f3c864f1a2bf2a619881ub-250x200.png" alt="Ремонт Айфона: Советы и Практические Навыки" / loading=lazy></a> <div class="announce-body"> <p class="title"><a href="/tools/remont-ajjfona-sovety-i-prakticheskie-navyki.html" class="wp_rp_title">Ремонт Айфона: Советы и Практические Навыки</a></p> </div> </div> </div> <div class="col-sm-4"> <div class="post-announce" data-position="0" data-poid="in-6915" data-post-type="none"><a href="/utilities/primenenie-mnogopotochnosti-v-igrah-kak-vklyuchit-vse-yadra.html" class="wp_rp_thumbnail thumb"><img src="/uploads/492a586ad09408d652d966aaf9811558.jpg" alt="Как включить все ядра процессора Объединяя все компоненты" / loading=lazy></a> <div class="announce-body"> <p class="title"><a href="/utilities/primenenie-mnogopotochnosti-v-igrah-kak-vklyuchit-vse-yadra.html" class="wp_rp_title">Как включить все ядра процессора Объединяя все компоненты</a></p> </div> </div> </div> <div class="col-sm-4"> <div class="post-announce" data-position="0" data-poid="in-6915" data-post-type="none"><a href="/graphic-editors/mozhno-li-v-yandekse-sdelat-nochnoi-rezhim-berezh-m-glaza-pri-nochnoi.html" class="wp_rp_thumbnail thumb"><img src="/uploads/27e4661693453995711580191a971901.jpg" alt="Бережём глаза при ночной работе за компьютером" / loading=lazy></a> <div class="announce-body"> <p class="title"><a href="/graphic-editors/mozhno-li-v-yandekse-sdelat-nochnoi-rezhim-berezh-m-glaza-pri-nochnoi.html" class="wp_rp_title">Бережём глаза при ночной работе за компьютером</a></p> </div> </div> </div> <div class="col-sm-4"> <div class="post-announce" data-position="0" data-poid="in-6915" data-post-type="none"><a href="/utilities/anshlag-users-registration-php-sozdaem-neveroyatnuyu-prostuyu-sistemu.html" class="wp_rp_thumbnail thumb"><img src="/uploads/b2bded92e630054b3402b10adc369d41.jpg" alt="Создаем невероятную простую систему регистрации на PHP и MySQL" / loading=lazy></a> <div class="announce-body"> <p class="title"><a href="/utilities/anshlag-users-registration-php-sozdaem-neveroyatnuyu-prostuyu-sistemu.html" class="wp_rp_title">Создаем невероятную простую систему регистрации на PHP и MySQL</a></p> </div> </div> </div> </div></div></div></div> </div> <div class="g-sidebar site-sidebar"> <aside id="ratios_list_widget-2" class="sidebar-widget "> <div class="widget-head have-icon"> <span class="icon icon-ratio"></span> <span class="title">Популярное</span> </div> <div class="widget-body"> <ul class="ratios-list"> <li> <span class="num">1</span> <p class="title">Способы восстановления номера на операторе киевстар </p> </li> <li> <span class="num">2</span> <p class="title">Обзор Xiaomi Mi Bluetooth headset </p> </li> <li> <span class="num">3</span> <p class="title">Microsoft Sticky Notes что это за программа и нужна ли она? </p> </li> <li> <span class="num">4</span> <p class="title">Ssd m2 pci e 3.0 установка. SSD с интерфейсом PCI Express: обзор и тестирование пяти моделей. Подробный видео обзор </p> </li> <li> <span class="num">5</span> <p class="title">Причины, по которым Яндекс </p> </li> <li> <span class="num">6</span> <p class="title">Клавиатуры: лучшие, новейшие, удобнейшие Лучшие геймерские клавиатуры с подсветкой </p> </li> </ul> </div> </aside> <aside id="new_posts_widget-2" class="sidebar-widget "> <div class="widget-head have-icon"> <span class="icon icon-new"></span> <span class="title">Новые статьи</span> </div> <div class="widget-body"> <ul class="posts-list delimited"> <li> <a href="/download/amigo-brauzer-voiti-bez-skachivaniya-kak-besplatno-skachat.html"> <span class="post"> <span class="image"> <span class="thumb"><img src="/uploads/1807f86cd7963334c18a0b5670a9b273.jpg" alt="Как бесплатно скачать браузер Амиго?" / loading=lazy></span> </span> <span class="title">Как бесплатно скачать браузер Амиго?</span> </span> </a> </li> <li> <a href="/multimedia/mozhno-li-skanirovat-po-seti-kak-sdelat-setevoi-skaner.html"> <span class="post"> <span class="image"> <span class="thumb"><img src="/uploads/975242dc2871f4b359cb2ab4ee94494b.jpg" alt="Как сделать сетевой сканер" / loading=lazy></span> </span> <span class="title">Как сделать сетевой сканер</span> </span> </a> </li> <li> <a href="/text/kak-nastroit-besprovodnoi-vai-fai-router-kak-nastroit-router-bez-pomoshchi.html"> <span class="post"> <span class="image"> <span class="thumb"><img src="/uploads/de75c8a8ce126a47b2ce58a0722c855d.jpg" alt="Как настроить роутер без помощи специалиста" / loading=lazy></span> </span> <span class="title">Как настроить роутер без помощи специалиста</span> </span> </a> </li> <li> <a href="/download/obzor-marshrutizatora-asus-rt-ac53-perehodnyi-period-proizvoditelnost-i-harakteristiki-raboty.html"> <span class="post"> <span class="image"> <span class="thumb"><img src="/uploads/1b3cdb56790c74222a428ee2b7a0c71a.jpg" alt="Производительность и характеристики работы" / loading=lazy></span> </span> <span class="title">Производительность и характеристики работы</span> </span> </a> </li> <li> <a href="/players/avtomaticheskie-krany-dlya-sbora-bitkoinov-chto-takoe-bitkoin-krany-na-avtomate-bez-kapchi-i-kak-na-et.html"> <span class="post"> <span class="image"> <span class="thumb"><img src="/uploads/490446c4c24866e4fe82248d3787cbf6.jpg" alt="Что такое биткоин-краны на автомате без капчи, и как на этом можно зарабатывать?" / loading=lazy></span> </span> <span class="title">Что такое биткоин-краны на автомате без капчи, и как на этом можно зарабатывать?</span> </span> </a> </li> </ul> </div> </aside> <aside id="new_posts_widget-2" class="sidebar-widget "> <div class="widget-head have-icon"> <span class="icon icon-new"></span> <span class="title">Новые статьи</span> </div> <div class="widget-body"> <ul class="posts-list delimited"> <li> <a href="/multimedia/pochemu-planshet-vidit-vai-vash-noutbuk-telefon-ili-planshet-ne.html"> <span class="post"> <span class="image"> <span class="thumb"><img src="/uploads/9e60528535eb5534558ce032fe862ff3.jpg" alt="Ваш ноутбук, телефон или планшет не видит Wi-fi?" / loading=lazy></span> </span> <span class="title">Ваш ноутбук, телефон или планшет не видит Wi-fi?</span> </span> </a> </li> <li> <a href="/graphics/windows-ne-mozhet-poluchit-dostup-k-setevoi-papke-windows-ne-mozhet.html"> <span class="post"> <span class="image"> <span class="thumb"><img src="/uploads/708458839068715f977bbd2b5a23a1e6.jpg" alt="Windows не может получить доступ к сетевой папке Ошибка нет прав доступа фипи что делать" / loading=lazy></span> </span> <span class="title">Windows не может получить доступ к сетевой папке Ошибка нет прав доступа фипи что делать</span> </span> </a> </li> <li> <a href="/utilities/utility-dlya-remonta-zhestkogo-diska-transcend-programmy-dlya.html"> <span class="post"> <span class="image"> <span class="thumb"><img src="/uploads/1be42f27a47c627614a165e230b430ff.jpg" alt="Программы для восстановления флешек" / loading=lazy></span> </span> <span class="title">Программы для восстановления флешек</span> </span> </a> </li> <li> <a href="/tools/vnedrenie-sistemy-as-wms-effektivnoe-upravlenie-skladskimi-resursami.html"> <span class="post"> <span class="image"> <span class="thumb"><img src="/uploads/8f432ab49859e93ee3efe26cc74ee4a8ub-85x50.png" alt="Внедрение системы AS WMS: Эффективное Управление Складскими Ресурсами" / loading=lazy></span> </span> <span class="title">Внедрение системы AS WMS: Эффективное Управление Складскими Ресурсами</span> </span> </a> </li> <li> <a href="/android/kak-vklyuchit-spyashchii-rezhim-na-huavei-nastroika-spyashchego-rezhima.html"> <span class="post"> <span class="image"> <span class="thumb"><img src="/uploads/bee615a19fc90fd4d53609dbca7387f9.jpg" alt="Настройка спящего режима в Android или как сделать, чтобы экран не отключался" / loading=lazy></span> </span> <span class="title">Настройка спящего режима в Android или как сделать, чтобы экран не отключался</span> </span> </a> </li> </ul> </div> </aside> <aside id="top_posts_widget-2" class="sidebar-widget "> <div class="widget-head have-icon"> <span class="icon icon-new"></span> <span class="title">Популярное</span> </div> <div class="widget-body"> <ul class="posts-list delimited"> <li> <a href="/tools/remont-ajjfona-sovety-i-prakticheskie-navyki.html"> <span class="post"> <span class="image"> <span class="thumb"><img src="/uploads/0bce8f387f89f3c864f1a2bf2a619881ub-85x50.png" alt="Ремонт Айфона: Советы и Практические Навыки" / loading=lazy></span> </span> <span class="title">Ремонт Айфона: Советы и Практические Навыки</span> </span> </a> </li> <li> <a href="/utilities/primenenie-mnogopotochnosti-v-igrah-kak-vklyuchit-vse-yadra.html"> <span class="post"> <span class="image"> <span class="thumb"><img src="/uploads/aebfeb9a512279c44daf4243dadcba0d.jpg" alt="Как включить все ядра процессора Объединяя все компоненты" / loading=lazy></span> </span> <span class="title">Как включить все ядра процессора Объединяя все компоненты</span> </span> </a> </li> <li> <a href="/graphic-editors/mozhno-li-v-yandekse-sdelat-nochnoi-rezhim-berezh-m-glaza-pri-nochnoi.html"> <span class="post"> <span class="image"> <span class="thumb"><img src="/uploads/8c1f681348e4d18fd9208e84dbb09533.jpg" alt="Бережём глаза при ночной работе за компьютером" / loading=lazy></span> </span> <span class="title">Бережём глаза при ночной работе за компьютером</span> </span> </a> </li> <li> <a href="/utilities/anshlag-users-registration-php-sozdaem-neveroyatnuyu-prostuyu-sistemu.html"> <span class="post"> <span class="image"> <span class="thumb"><img src="/uploads/114031cdc3080105cd53350ebd1594e4.jpg" alt="Создаем невероятную простую систему регистрации на PHP и MySQL" / loading=lazy></span> </span> <span class="title">Создаем невероятную простую систему регистрации на PHP и MySQL</span> </span> </a> </li> <li> <a href="/graphics/chto-nuzhno-nabrat-chtoby-vosstanovit-nomer-kievstar-sposoby.html"> <span class="post"> <span class="image"> <span class="thumb"><img src="/uploads/54181562ae86514480de726c4a600863.jpg" alt="Способы восстановления номера на операторе киевстар" / loading=lazy></span> </span> <span class="title">Способы восстановления номера на операторе киевстар</span> </span> </a> </li> </ul> </div> </aside> <aside id="text-3" class="sidebar-widget widget_text"> <div class="textwidget"> <div class="sticky-block"> </div> </div> </aside> </div> </div> </div> <footer class="site-footer"> <div class="footer-container"> <div class="logo-area"> <span class="logo1"> </span> </div> <div class="pane-right"> <ul id="menu-v-podvale" class="menu"> <li class="menu-item type-post_type object-page "><a href="">О проекте</a></li> <li class="menu-item type-post_type object-page "><a href="/feedback.html">Контактная информация</a></li> <li class="menu-item type-post_type object-page "><a href="">Реклама на сайте</a></li> </ul> <div class="credits"> <p class="copy">© 2024 multxit.ru</p> Андроид. Мультимедиа. Социальные сети. Инструменты. Кодеки. Графика </div> </div> </div> </footer> <div id="sendresult" style="display: none;"> <div class="popup-win"> <p class="win-title">Спасибо!</p> <p class="win-message">Ваше сообщение отправлено.</p> </div> </div> <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,700,700italic&subset=cyrillic"> <link href='https://fonts.googleapis.com/css?family=PT+Sans:400,400italic,700,700italic&subset=latin,cyrillic-ext,latin-ext' rel='stylesheet' type='text/css'> <script src="https://multxit.ru/wp-content/themes/domotmoem/js/bxslider/jquery.bxslider.min.js"></script> <script src="https://multxit.ru/wp-content/themes/domotmoem/js/fancybox/jquery.fancybox.pack.js"></script> <script src="https://multxit.ru/wp-content/themes/domotmoem/js/share/share.min.js"></script> <script src="https://multxit.ru/wp-content/themes/domotmoem/js/app/app.min.js"></script> <style type="text/css"> @import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css'); .dwqa-questions-list .dwqa-question-item { padding-left: 70px; } .dwqa-questions-list .dwqa-question-item .avatar { position: static; width: 12px; height: 12px; margin-right: 5px; margin-top: 0; display: inline-block; } .dwqa-question-item .dwqa-status { position: absolute; left: 15px; top: 50%; width: 36px; height: 36px; margin-top: -18px; border-radius: 36px; text-indent: -9999px; padding: 0; background: none; box-shadow: 0 0 0 1px #e67e22 inset; } .dwqa-question-item .dwqa-status:after { content: "\f128"; display: block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #e67e22; text-indent: 0; font-size: 18px; width: 36px; height: 36px; line-height: 36px; text-align: center; top: 0; position: absolute; } .dwqa-question-item .dwqa-status-closed { box-shadow: 0 0 0 1px #666 inset; } .dwqa-question-item .dwqa-status-closed:after { color: #666; content: "\f023"; } .dwqa-question-item .dwqa-status-resolved { box-shadow: 0 0 0 1px #578824 inset; } .dwqa-question-item .dwqa-status-resolved:after { color: #578824; content: "\f00c"; } .dwqa-question-item .dwqa-status-answered { box-shadow: 0 0 0 1px #1ba1e2 inset; } .dwqa-question-item .dwqa-status-answered:after { color: #1ba1e2; content: "\f112"; font-size: 14px; } </style> <script type='text/javascript' src='https://multxit.ru/wp-content/plugins/akismet/_inc/form.js?ver=3.2'></script> <link rel='stylesheet' id='in_posts_adv-css' href='/wp-content/plugins/in-posts-adv/css/ipa.min.css?ver=8e8e885e5afaeff2f05325ad207caad6' type='text/css' media='all' /> <script type='text/javascript' src='/wp-includes/js/wp-embed.min.js?ver=4.7.8'></script> <script type='text/javascript' src='https://multxit.ru/wp-content/plugins/in-posts-adv/js/ipa.min.js?ver=8e8e885e5afaeff2f05325ad207caad6'></script> <script> (function(){ var a = document.querySelector('.sticky-block'), b = null, P = 20; window.addEventListener('scroll', Ascroll, false); document.body.addEventListener('scroll', Ascroll, false); function Ascroll() { if (b == null) { var Sa = getComputedStyle(a, ''), s = ''; for (var i = 0; i < Sa.length; i++) { if (Sa[i].indexOf('overflow') == 0 || Sa[i].indexOf('padding') == 0 || Sa[i].indexOf('border') == 0 || Sa[i].indexOf('outline') == 0 || Sa[i].indexOf('box-shadow') == 0 || Sa[i].indexOf('background') == 0) { s += Sa[i] + ': ' +Sa.getPropertyValue(Sa[i]) + '; ' } } b = document.createElement('div'); b.style.cssText = s + ' box-sizing: border-box; width: ' + a.offsetWidth + 'px;'; a.insertBefore(b, a.firstChild); var l = a.childNodes.length; for (var i = 1; i < l; i++) { b.appendChild(a.childNodes[1]); } a.style.height = b.getBoundingClientRect().height + 'px'; a.style.padding = '0'; a.style.border = '0'; } var Ra = a.getBoundingClientRect(), R = Math.round(Ra.top + b.getBoundingClientRect().height - document.querySelector('.footer-container').getBoundingClientRect().top + 0); if ((Ra.top - P) <= 0) { if ((Ra.top - P) <= R) { b.className = 'stop'; b.style.top = - R +'px'; } else { b.className = 'sticky'; b.style.top = P + 'px'; } } else { b.className = ''; b.style.top = ''; } window.addEventListener('resize', function() { a.children[0].style.width = getComputedStyle(a, '').width } , false); } } )() </script> </body> </html>