lobsite! Увійти Створити обліковий запис

Безкоштовні інструменти /

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

Створіть заголовок, опис і теги Open Graph та карток X, перегляньте вигляд у Google й у посиланнях, скопіюйте HTML. Безкоштовно у браузері.

У результатах пошуку example.com Lobsite: your sites, live in seconds

Run one command, or drop a folder in the browser. Only the files you changed upload.

og.png
example.com Lobsite: your sites, live in seconds Run one command, or drop a folder in the browser. Only the files you changed upload.
Теги для вашого <head>
  • Усе готово.

Як користуватися

  1. Заповніть назву й опис, адресу сторінки та зображення для попереднього перегляду.
  2. Перевірте результат пошуку й попередній перегляд посилання праворуч та виправте все, на що вказують попередження.
  3. Скопіюйте теги до <head> вашої сторінки або завантажте їх.

На теги перетворюються лише заповнені поля, а всі значення екрануються, тому лапки та & у вашому тексті не можуть порушити HTML.

Найважливіші теги

  • <title> — заголовок результату пошуку та вкладки браузера. У результатах відображається приблизно 60 символів.
  • <meta name="description"> — фрагмент під ним, якщо пошукова система вважає, що він відповідає сторінці. Орієнтуйтеся на 70–160 символів.
  • <link rel="canonical"> указує єдину адресу сторінки, щоб копії за іншими адресами не конкурували з нею.
  • Теги Open Graph (og:) використовують Slack, LinkedIn, Facebook, iMessage і більшість чат-застосунків для попереднього перегляду посилань.
  • twitter:card просить X показати картку з великим зображенням. Решту даних X бере з тегів Open Graph.

Зображення для попереднього перегляду

Використовуйте зображення 1200 × 630 пікселів (1,91:1) у форматі PNG або JPEG, розміром до 5 МБ, за повною адресою https://. Відносні шляхи на кшталт /og.png не працюють: сервіси, які створюють попередній перегляд, самостійно завантажують зображення. Не розміщуйте важливий текст близько до країв, адже деякі застосунки обрізають зображення до квадрата.

Поширені запитання

Чи мають досі значення ключові слова в метатегах?

Ні. Google роками ігнорує <meta name="keywords">, тому генератор його не створює.

Чому попередній перегляд посилання не змінюється після оновлення тегів?

Сервіси кешують попередній перегляд, іноді на кілька днів. Більшість мають засіб для повторного завантаження сторінки, наприклад Post Inspector у LinkedIn та Sharing Debugger у Facebook.

Де мають бути теги?

Усередині <head>, перед закривальним </head>. Якщо на сторінці вже є <title> або опис, замініть їх, а не додавайте другий.

Чи можна тут побачити справжнє зображення в попередньому перегляді?

Замість зображення попередній перегляд показує назву його файлу, оскільки ця сторінка завантажує зображення лише з lobsite.com. Опублікуйте сторінку й перевірте її в чат-застосунку, щоб побачити справжній результат.