Что такое Предпросмотр карточки Twitter?
Twitter Card Preview показывает, как будут выглядеть ваши ссылки при публикации в Twitter/X. Введите URL или заполните заголовок, описание и изображение, чтобы перед публикацией просмотреть оба типа карточек: Summary и Summary with Large Image.
Превью использует те же пропорции, что и веб-клиент Twitter/X: 2:1 для Summary with Large Image (рекомендуется для блог-постов и запусков), и квадрат 1:1 для Summary (лучше для категорийных страниц и справочных ссылок). Заодно генерируются нужные meta-теги — их можно вставить прямо в <head> сайта, не выписывая руками.
Как использовать
- Шаг 1 — Заполните заголовок, описание и URL изображения или вставьте HTML своей страницы, чтобы разом импортировать её существующие теги twitter: и og:.
- Шаг 2 — Выберите тип карточки: Summary (маленькая миниатюра) или Summary with Large Image (превью в стиле баннера).
- Шаг 3 — Просмотрите предпросмотр в реальном времени, чтобы увидеть, как именно ссылка отображается в ленте Twitter/X — при желании внутри полноценного твита и на LinkedIn, Facebook, Slack и Discord — и при необходимости скорректируйте поля.
Когда использовать
- Посмотреть, как будет выглядеть пост или статья, перед тем как твитнуть ссылку аудитории.
- Аудит старых лендингов, у которых карточка ломается или показывает обрезанный логотип.
- Выбор подходящего типа карточки (Summary или Large Image) для конкретной страницы до добавления meta-тегов.
Результат
Вы собираетесь поделиться ссылкой на статью в блоге в Twitter/X. Вы вставляете HTML страницы, чтобы загрузить её теги, и предпросмотр показывает, что в карточке отсутствует описание, а изображение обрезано. Вы исправляете оба поля и убеждаетесь, что карточка с большим изображением выглядит профессионально, прежде чем публиковать.
Частые вопросы
- В чём разница между Summary и Summary with Large Image?
- Summary показывает маленькую квадратную миниатюру слева, заголовок и описание — справа. Summary with Large Image ставит широкий баннер над заголовком. Большой вариант занимает больше места в ленте и почти всегда даёт более высокий CTR.
- Какие размеры изображения Twitter/X показывает на самом деле?
- Для Summary with Large Image видимая область примерно 2:1 (например 1200×600 px). Twitter принимает от 300×157 до 4096×4096, но кадрирует в 2:1, поэтому важный текст и лица должны оставаться внутри центральной 2:1-зоны.
- Нужно ли одобрение Twitter Developer, чтобы использовать эти теги?
- Нет. Meta-теги Twitter Card работают на любом публичном сайте без одобрения. Старый валидатор, требовавший проверки, отключён. Добавьте теги в <head>, выкатите публично — при следующей шере карточка появится сама.
- Почему карточка в Twitter не обновилась, хотя теги верные?
- Twitter активно кеширует ответы карточек. После правок старая карточка может держаться часами. Шер URL с трекинг-суффиксом (?v=2 или UTM) форсирует свежий запрос. Ещё одна типичная причина — блок Twitterbot в robots.txt.
- Использовать Open Graph или теги Twitter?
- Twitter откатывается на Open Graph (og:title, og:description, og:image), если twitter:*-тегов нет, так что обычно достаточно OG. Добавьте twitter:card и twitter:image, если нужен полный контроль над тем, какую картинку и раскладку Twitter возьмёт.
Похожие инструменты
Генератор структурированных данных
Создайте разметку JSON-LD Schema для SEO
Веб-страница в PDF
Сохранение веб-страницы в виде PDF
Генератор политики конфиденциальности
Создайте политику конфиденциальности для вашего сайта
Генератор условий использования
Сгенерируйте документ с условиями использования
Генератор согласия на использование файлов cookie
Создание кода баннера согласия на использование cookie
Минификатор CSS
Сжатие CSS-кода для уменьшения размера файла