Войти

Настройка SEO

Некоторые страницы на наших сайтах доступны неавторизованным пользователям, а это означает, что они должны правильно анализироваться поисковыми роботами и корректно отображать при "расшаривании" ссылки. Для это разработан ряд правил.

Адреса страниц

Все адреса должны быть понятными и соответствовать правилам.

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

Как настроить?

Настройка URL адреса должна сделана через механизмы Wasaby роутинга.

Мета-описание страницы

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

ТэгНазначение
titleЗаголовок страницы. Рекомендуемая длина не более 60 символов.
meta — descriptionУникальное описание страницы. Рекомендуемая длина не более 160 символов.
meta — robotsРазрешение на индексацию страниц для поисковых систем. Если никаких запретов на индексацию нет, то тэг можно не добавлять.
Данных тэгов может быть несколько и варианты значений зависят от конкретной задачи. Например, на sbis.ru используются значения "noyaca" и "noodp", запрещающие Яндексу использовать текст и заголовок из YACA и DMOZ в выдаче.
link — shortcut iconСсылка на favicon.
link — canonicalКаноничная ссылка (расположение оригинального контента).
meta — og:urlКаноничная ссылка.
meta — og:titleЗаголовок страниц, который отображается в предпоказе (то же самое, что и в title).
meta — og:descriptionОписание страницы, который отображается в предпоказе (то же самое, что и в description).
meta — og:imageСсылка на банер, который отображается в предпоказе.
meta — og:site_nameИмя сайта, которое отображается в предпоказе.

Как настроить?

Все платформенные шаблоны страницы SbisEnvUI/Bootstrap, Page.template:Entity, OnlinePage.template:Entity поддерживают опции, необходимые для настройки метаописания: title, description, meta и links.

// Page.ts
...
_beforeMount() => {
    this._pageInfo = {
        title: 'СБИС — сеть деловых коммуникаций: сообщения, задачи, документы, отчеты',
        description: 'СБИС — сеть деловых коммуникаций и обмена электронными документами между компаниями,  госорганами и обыкновенными людьми',
        url: 'https://sbis.ru/',
        faviconPath: '/Theme/img/favicon.png',
        previewImageUrl: 'https://sbis.ru/resources/CommonSbisRu/SEO/resources/images/2.png',
        siteName: 'СБИС'
    }
}
...
<!-- Page.wml -->
<SbisEnvUI.Bootstrap>
    <ws:title>
        {{ _pageInfo.title }}
    </ws:title>
     
    <ws:links>
    <ws:Array>
        <ws:Object rel="shortcut icon" href="{{ _pageInfo.faviconPath }}" type="image/png"/>
        <ws:Object rel="canonical" href="{{ _pageInfo.url }}"/>
    </ws:Array>
    </ws:links>
     
    <ws:content>
        <!-- Контент страницы -->
    </ws:content>
</SbisEnvUI.Bootstrap>

В результате, превью данной страницы в социальных сетях будет выглядеть следующим образом:

Контент страницы

Чтобы поисковый робот помог проанализировать страницы сайта, все переходы между страницами должны быть реализованы с помощью ссылок (<a>). При использовании SPA переходов ссылки необходимо обернуть в Router.router:Reference.

<!-- Правильно -->
<Router.router:Reference
   state="/contacts">
   <a href="{{ content.href }}" title="Перейти в Контакты">Перейти в Контакты</a>
</Router.router:Reference>
<!-- Неправильно -->
<span on:click="changePage()">Перейти в Контакты</span>

Заголовки

На странице необходимо размещать только один заголовок первого уровня (<h1>).

Картинки

Все фотографии и картинки должны размещаться тэгом <img> и содержать атрибут alt с описанием изображения.

© 2021 Тензор. Все права защищены.