Генератор метатегов

Сгенерировать метатеги SEO, Open Graph и Twitter с живым предпросмотром поиска и соцсетей

Файлы не покидают устройство
Работает в браузере
Бесплатно, без регистрации и водяных знаков

Page

Title

0 chars

Description

0 chars

Canonical URL

Site name

Social sharing

Image URL

Absolute URL, ideally 1200 × 630 px.

Image description (alt)

Type

Locale

X card

Site @handle

Author @handle

Previews

Example

example.com

Page title

The page description appears here.

Choose a local image for the preview

Only shown here — the image URL above is never loaded.

Add a title.

Add a description.

HTML for <head> · 10 tags

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="robots" content="index, follow, max-image-preview:large">

<!-- Open Graph -->
<meta property="og:type" content="website">
<meta property="og:locale" content="en_US">

<!-- X (Twitter) -->
<meta name="twitter:card" content="summary_large_image">

<!-- Icons -->
<link rel="icon" href="/favicon.ico" sizes="32x32">
<link rel="icon" href="/icon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">

Как пользоваться: Генератор метатегов

Заполните заголовок, описание и картинку для шаринга страницы и получите готовый HTML для <head>: SEO, Open Graph, карточка X (Twitter), robots, цвет темы и теги фавиконки. Живые предпросмотры показывают, как страница выглядит в Google, Facebook / LinkedIn, X и Slack / Discord.

1
Введите заголовок, описание, канонический URL и имя сайта в «Странице».
2
В «Шеринге» добавьте URL изображения, его alt-текст, тип и стиль карточки X.
3
Задайте robots, цвет темы и другие параметры в «Техническом».
4
Проверьте вкладки предпросмотра и подсказки длины, затем скопируйте HTML для <head>.

Частые вопросы

Какой длины должны быть заголовок и описание?

Google обычно обрезает заголовки около 600 px (примерно 60 символов) и описания около 160 символов. Инструмент показывает счёт и предупреждает, когда текст слишком короткий или длинный.

Почему изображение не видно в предпросмотре?

Предпросмотр никогда не загружает введённый URL изображения. Чтобы увидеть картинку, используйте «Выбрать локальное изображение для предпросмотра»; оно показывается только на этой странице.

Какой размер изображения лучше для Open Graph?

Используйте абсолютный URL изображения около 1200 × 630 px. Относительные пути для og:image не работают.

Добавляет ли он теги статьи вроде времени публикации и автора?

Да. Когда тип — article, появляются поля публикации и автора и добавляются соответствующие теги article:.

Отправляется ли что-нибудь на сервер?

Нет. Теги и предпросмотры генерируются в браузере.