Генератор метатегов
Укажите заголовок страницы, описание и изображение, проверьте их длину, посмотрите, как результат будет выглядеть в Google и соцсетях, а затем скопируйте метатеги HTML.
1<!-- Primary Meta Tags -->2<title>Framer: бесплатный конструктор сайтов и ИИ-ассистент по дизайну</title>3<meta name="title" content="Framer: бесплатный конструктор сайтов и ИИ-ассистент по дизайну" />4<meta name="description" content="Бесплатный конструктор сайтов с ИИ-дизайнером, который проведет вас от идеи до запуска. Все изменения можно редактировать, а хостинг, CMS, аналитика, SEO и AEO уже встроены." />5<link rel="canonical" href="https://www.framer.com/" />6 7<!-- Favicon -->8<link rel="icon" href="https://framerusercontent.com/images/Io89FonxEaWg4nxvQQllVLwPUUI.png" />9<link rel="apple-touch-icon" href="https://framerusercontent.com/images/Io89FonxEaWg4nxvQQllVLwPUUI.png" />10 11<!-- Open Graph / Facebook / LinkedIn -->12<meta property="og:type" content="website" />13<meta property="og:url" content="https://www.framer.com/" />14<meta property="og:title" content="Framer: бесплатный конструктор сайтов и ИИ-ассистент по дизайну" />15<meta property="og:description" content="Бесплатный конструктор сайтов с ИИ-дизайнером, который проведет вас от идеи до запуска. Все изменения можно редактировать, а хостинг, CMS, аналитика, SEO и AEO уже встроены." />16<meta property="og:image" content="https://framerusercontent.com/images/vt65Mbfi3w8ymfTyRfbmgM4Tyo.png" />17<meta property="og:image:width" content="1200" />18<meta property="og:image:height" content="630" />19<meta property="og:site_name" content="Framer" />20 21<!-- X (Twitter) -->22<meta name="twitter:card" content="summary_large_image" />23<meta name="twitter:url" content="https://www.framer.com/" />24<meta name="twitter:title" content="Framer: бесплатный конструктор сайтов и ИИ-ассистент по дизайну" />25<meta name="twitter:description" content="Бесплатный конструктор сайтов с ИИ-дизайнером, который проведет вас от идеи до запуска. Все изменения можно редактировать, а хостинг, CMS, аналитика, SEO и AEO уже встроены." />26<meta name="twitter:image" content="https://framerusercontent.com/images/vt65Mbfi3w8ymfTyRfbmgM4Tyo.png" />27<meta name="twitter:site" content="@багетчик" />Как писать хорошие метатеги
Заполните поля выше, и генератор создаст HTML-код за вас. Вставьте его в тег <head> вашей страницы или скопируйте значения в SEO-настройки вашей CMS или конструктора сайтов.
Напишите заголовок длиной от 50 до 60 символов
Размещайте основное ключевое слово ближе к началу, а название бренда — в конце. Google обрезает заголовки примерно на 60 символах.
Длина мета-описания должна составлять от 140 до 160 символов
Кратко опишите, что предлагает страница, и дайте пользователям повод кликнуть по ней. Google иногда меняет описания, но понятный текст, точно отвечающий поисковому запросу, показывается намного чаще.
Добавьте канонический URL и изображение Open Graph
Канонический тег указывает поисковым системам, какой адрес является основной версией страницы. Используйте изображение og:image размером 1200 × 630 пикселей, чтобы оно полностью заполняло большую карточку на всех платформах.
Проверьте теги после публикации
После того как теги начнут действовать, проверьте URL-адрес с помощью инструмента проверки метатегов, чтобы увидеть, что считывают Google и социальные сети. Социальные сети кэшируют предпросмотры, поэтому проверяйте заново после каждого изменения. Если приложение по-прежнему показывает старую версию, обновите кэшированный предпросмотр.
Часто задаваемые вопросы о генераторе метатегов
Краткие ответы о метатегах, Open Graph и о том, куда вставлять сгенерированный код.
Что такое генератор метатегов?
Генератор метатегов преобразует заголовок страницы, описание, URL-адрес и изображение в HTML-теги, которые считываются поисковыми системами и социальными сетями: тег title, метатег description, каноническую ссылку, теги Open Graph и теги Twitter card.
Какие метатеги создает этот инструмент?
Он формирует тег title, метатеги title и description, rel=canonical, og:type, og:url, og:title, og:description, og:image с шириной и высотой, og:site_name, а также теги twitter:card, title, description, image и site.
Куда вставить сгенерированные метатеги?
Вставьте их в секцию head вашего HTML-кода непосредственно перед закрывающим тегом </head>. Если вы используете Framer, Webflow, WordPress или Shopify, просто укажите те же заголовок, описание и изображение в SEO-настройках страницы.
Имеют ли метатеги значение для SEO сегодня?
Тег title по-прежнему является фактором ранжирования, а метаописание — это то, что большинство людей читают в результатах поиска перед тем, как кликнуть. Теги Open Graph и Twitter определяют, как выглядит ссылка, когда ею делятся, что также напрямую влияет на клики.
Этот генератор метатегов бесплатный?
Да. Сервис работает прямо в вашем браузере, не требует создания аккаунта, а введенные данные нигде не сохраняются.