Блог Верстка
15 минут на чтение
4284
0

Руководство по Gmail Markup

15 минут на чтение
4284
0

Наверняка вы хоть раз видели письмо, которое выделяется в списке. Его плашка выше других и к ней будто прикреплён фрагмент карты с датой, временем и названием места или мероприятия. Это означает, что в письмо добавили Гугл-разметку. Рассказываем пошагово, как это сделать и избежать ошибок.

Что такое Gmail Markup

Gmail Markup, или Гугл-разметка— это дополнительный код, благодаря которому почтовые ипоисковые службы понимают, какая информация содержится вписьме или насайте. Спомощью кода вывыделяете самую важную информацию, аГугл выводит эти данные напервый план.


Gmail Markup показывает самое важное: дату, время, адрес, ещё и карту прикладывает.

Gmail Markup— часть проекта schema.org. Это совместная разработка Гугла, Яндекса иYahoo, чтобы унифицировать семантическую разметку вHTML5. Другими словами, компании объединились, чтобы создать такие метаданные, которые поисковикам удобно считывать. Инициатива касается всего контента винтернете, номырассмотрим только письма.

Зачем нужен Gmail Markup

Предположим, вы — фанат певицы Монеточки. Ваш запрос в поисковике выглядит так: «концерт Монеточка Москва». Это и есть ключевые слова, по которым Гугл покажет вам подходящие сайты. Этого недостаточно, чтобы показать, где и когда будет проходить концерт. Используя Gmail Markup, организатор может указать поисковику или почтовому клиенту, где прописаны дата, время и адрес.

Без Gmail Markup ваше письмо затеряется среди остальных. СGmail Markup письмо занимает вчетыре раза больше места ивыделяется засчёт плашки скартой. Ктомуже компании, которые используют Gmail Markup, получают преимущество впоиске.

Кому стоит размечать письма

  • Кафе, туристическим агентствам, гостиницам, компаниям, организующим мероприятия ипрокат— для подтверждения бронирования, выставления счетов.
  • СМИ, блогам, соцсетям, форумам— для подборки статей вдайджест.
  • Ретейлу илогистике— для отправки уведомлений, трекинга посылок.
  • B2B-компаниям— для планирования встреч иотправки приглашений вкалендарь.

Форматы разметки

Предположим, выанонсируете конференцию. Шаблон разметки можно взять прямо изинструкции Гугла, раздел Reservations, страница Event.

Унас есть выбор между двумя форматами: Microdata иJSON-LD. Вчём разница:

  • Microdata основан наHTML иможет быть инлайновым, тоесть его можно прописать вкаждом теге или встроить отдельно, между тегами <head>.
  • JSON-LD основан наязыке JavaScript, поэтому код пишется отдельно втеге <script>, между тегами <head>.

Подробнее оформатах читайте встатье Яндекса.

Для примера мывыберем JSON-LD, потому что его рекомендует Гугл иорганизация, разрабатывающая стандарты для интернета— W3C. JSON-LD поддерживают Яндекс.Почта, Gmail иInbox.

Так как JSON-LD расположен невтеле письма, авхедере, непривязывайте контент кГугл-разметке. Тем более почтовики, неподдерживающие JSON-LD, уберут этот код изписьма, как раньше делали совстроенными вхедер стилями. Главную информацию— название мероприятия, дату, время иадрес— выносите наверх, авсамом письме расскажите опрограмме конференции.

Подробный разбор кода

<script type=“application/ld+json”>
{
Разметка состоит из пары «ключ»: «значение», после каждой пары ставится запятая. Вложенная структура в ключах заключается в {}.
“@context”: “http://schema.org”,В каждой разметке — своя структура и ключи. Чтобы их понять, нужен словарь. Разметка использует словарь со schema.org.
“@type”: “EventReservation”,Тип словаря. Для бронирования есть варианты: EventReservation, FlightReservation, LodgingReservation, RentalCarReservation, FoodEstablishmentReservation.
“reservationNumber”: “E123456789”,Код, номер или идентификатор бронирования.
“reservationStatus”: “http://schema.org/Confirmed”,Подтверждение или отмена регистрации “http://schema.org/Cancelled”.
“underName”: {Для кого бронируем.
“@type”: “Person”,“Person” или “Organization”.
“name”: “John Smith”
},
Имя указывать обязательно.
“reservationFor”: {Для чего бронируем.
“@type”: “Event”,Варианты: BusinessEvent, ChildrenEvent, ComedyEvent, DanceEvent, EducationEvent, Festival, FoodEvent, LiteraryEvent, MovieShowing, MusicEvent, SaleEvent, SocialEvent, SportsEvent, TheaterEvent, VisualArtsEvent.
“name”: “Foo Fighters Concert”,
“startDate”: “2027–03-06T19:30:00–08:00”,Время в формате ISO 8601.
“location”: {
“@type”: “Place”,
“name”: “AT&T Park”,
“address”: {
“@type”: “PostalAddress”,
“streetAddress”: “24 Willie Mays”,
“addressLocality”: “San Francisco”,
“addressRegion”: “CA”,
“postalCode”: “94107”,
“addressCountry”: “US”
}
Где пройдёт мероприятие или располагается организация.
}Закрываем ключ “reservationFor”.
}
</script>
Закрываем ключ “reservationFor”.

Как сделать разметку изобычного текста

Разметку можно сделать изобычного текста, без прописывания ключей изначений, арезультат отправить себе напочту. Для этого нужны:

Мызаписали скринкаст, чтобы показать, как это выглядит напрактике.


Как сделать Gmail Markup изобычного текста иотправить письмо себе напочту
  1. Откройте Structured Data Markup Helper, выбирайте тип разметки ивставьте обычный текст или HTML.
  2. Добавьте ключевую информацию изтекста вструктуру разметки. Мастер покажет обязательные ключи идополнительные поля, которые можно добавить вразметку. Если втексте разметки нет какого-то обязательного значения, например, номера бронирования, его можно добавить вручную покнопке Add Missing Tags.
  3. Вприложении «Скрипты» создайте проект сфайлом для кода через меню File → New → HTMLfile. Имя можно указывать любое, унас это Code.gs.
  4. Скопируйте код изStructured Data Markup Helper ивставьте его между тегами <head>. Если вмастере разметки выписали обычным текстом изабыли про теги, получится обычный Gmail Markup, анам нужен HTML.
  5. Чтобы отправить результат себе напочту, добавьте вCode.gs код:
function testSchemas() {
  var htmlBody = HtmlService.createHtmlOutputFromFile('имя_HTML_файла').getContent();

  MailApp.sendEmail({
    to: Session.getActiveUser().getEmail(),
    subject: 'Test email markup - ' + new Date(),
    htmlBody: htmlBody,
  });
}

Нажмите Run. Вовсплывающем окне разрешите отправку имейла иразметка придёт наваш адрес.

Как найти ошибку вкоде Gmail Markup

Если непользоваться Structured Data Markup Helper, апрописывать пары «ключ: значение» самостоятельно, есть риск ошибиться. Проверит правильность Гугл-разметки, найти ошибки ирекомендуемые кзаполнению поля можно через валидатор Email Markup Tester.


Внашей Gmail Markup есть две ошибки итри рекомендации, новпочте почти всё отображается хорошо

Мысгенерировали письмо вStructured Data Markup Helper, нонеизбежали ошибок: неуказали reservationStatus иневерно поставили время. Поля reservationStatus вStructured Data Markup Helper небыло, ионо никак неповлияло написьмо. Аошибка сдатой ощутима. Получилось, будто мероприятие будет 18–19апреля, тоесть два дня вместо одного. Чтобы избежать такого, указывайте дату вформате ISO 8601с часами, минутами, секундами ичасовым поясом: «2027–03-06T19:30:00–08:00». Несмотря наэти две ошибки Gmail Markup работает.

Помимо ошибок, валидатор выдал рекомендации:

  • Изменить статус резервирования. Для этого нужна отдельная ссылка ивремя модификации, которые указываются вmodifyReservationUrl иmodifiedTime.
  • Добавить информацию оборганизаторе вполе Performer.

Требования котправителю

1. Настроенная DKIM или SPF-запись насервере

DKIM— текстовые файлы спубличным исекретным ключом навашем домене, SPF— текстовый файл, перечень IP-адресов, скоторых отправляются письма. Поэтим записям почтовый сервис проверяет, что письмо пришло именно отвашего домена. Настройка сервера— это тема отдельной статьи. Прочитайте инструкцию понастройке DKIM или SPF вЯндексе.

2. Неменьше 100 отправленных писем ежедневно

Выдолжны отправлять сосвоего домена больше 100 писем каждый день втечение нескольких недель.

3. Уровень спама ниже 0,1%

Гугл неговорит точную цифру, ограничиваясь туманной формулировкой: очень низкий уровень спама. Мейлчимп утверждает, что уровень жалоб должен быть меньше 0,1%. Когда выотправляете рассылку достаточно долго, жалобы будут всегда, ноихнедолжно быть много. Множество жалоб означает, что получатели непонимают, почему они получают эту рассылку икогда подписались нанеё.

4. Письмо должно быть транзакционным

Все письма с разметкой должны быть транзакционными — это письма, которые ждут пользователи. Рекламные письма рассылать нельзя, но отличить их от транзакционных сложно даже крупным поисковикам. Поэтому Гугл ориентируется на уровень жалоб и отписок. Это справедливо: получатели чаще жалуются на рекламу, чем на транзакционные письма.

Мынерекомендуем экспериментировать срекламными рассылками. Вслучае неудачи Гугл исключит ваш домен избелого листа иразметка перестанет работать, бонусом могут возникнуть проблемы сдоставляемостью.

5. Ваш домен есть вбелом листе Gmail Schema

Если всё остальное впорядке, можно подавать заявку набелый лист.

Отправьте готовое письмо с Gmail Markup со своего почтового сервера на schema.whitelisting+sample@gmail.com. По нему Гугл смотрит, как вы хотите использовать разметку и не собираетесь ли вы рассылать спам. Разметка должна быть максимально подробной и полной. Если сомневаетесь, будете использовать RSVP-действие в рассылках или нет — добавляйте.

После отправки письма заполните форму иждите ответа. Гугл обрабатывает заявки помере ихпоступления, поэтому сколько это займёт времени, предсказать невозможно.

Почему Gmail Markup неработает

1. Выотправили письмо нечерез Гугл-скрипт

Мейлчимп идругие почтовые сервисы поумолчанию добавляют свою подпись DKIM. Гугл сравнивает домены впочте иесли они несовпадают, отключает разметку. Уличного аккаунта указаны @gmail.com идомен для DKIM-записи, ауМейлчимпа— mail120.suw17.mcsv.net.


Слева мыотправили письмо через Мейлчимп, асправа— через Гугл-скрипт

2. Сервер ненастроен

Если рабочий сервис ненастроен или настроен неполностью, тодомен изDKIMне совпадает сдоменом отправителя. Гугл сравниваетих, видит различия иотключает разметку. Чтобы избежать этого, сначала настройте DKIM или SPF, подайте заявку вГугл, дождитесь одобрения итолько тогда запускайте рассылку.

Можноли отправлять письма сGmail Markup клиентам

Да, если ваш домен добавят вбелый лист. Частично отом, как это сделать, написано вруководстве. Для этого нужны Python иGoogle Cloud.

Авывнедряли Gmail Markup усебя? Поделитесь опытом.