Как создать и загрузить файл с логотипом бренда

Логотип бренда – это SVG-файл, который вам нужно загрузить на общедоступный веб-сервер вашего домена.

Требования к SVG-файлу и рекомендации по его созданию

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

Чтобы в почте у получателей логотип рядом с вашими письмам отображался правильно, SVG-файл должен соответствовать следующим требованиям:

• Формат: SVG Tiny PS (версия SVG).
• Атрибут baseProfile: tiny-ps
• Атрибут version: 1.2
• Элемент <title>: должен содержать название организации. Строгих требований к его значению нет.
• Нельзя добавлять:
  • внешние ссылки, кроме ссылок на указанные пространства имен XML;
  • скрипты, анимации и другие интерактивные элементы;
  • атрибуты x= или y= в корневой элемент <svg>.

Ниже даны дополнительные рекомендации, которые помогут обеспечить совместимость SVG-файла с почтовыми клиентами, поддерживающими BIMI. Логотип должен:

• Располагаться в центре квадрата.
• Иметь сплошной цветной фон. Прозрачный фон может отображаться неправильно.
• Иметь размер минимум 96 x 96 пикселей. Gmail не поддерживает SVG-файлы меньшего размера.
• Иметь небольшой размер файла. Рекомендуется, чтобы он не превышал 32 КБ.
• Содержать элемент <desc> (описание) для обеспечения доступности.

Шаг 1. Создайте SVG-файл с логотипом бренда

В настоящее время инструментов для создания SVG-файла, который бы соответствовал всем требованиям BIMI, не существует. SVG-файл для BIMI нужно изменить вручную, используя текстовый редактор или специальный скрипт.

Ознакомьтесь с рекомендуемыми инструментами для создания SVG-файла для BIMI.

Как создать SVG-файл для BIMI с помощью Adobe Illustrator и текстового редактора

Вы можете создать SVG-файл с помощью Adobe Illustrator, а затем внести в него незначительные изменения, используя текстовый редактор. При этом обязательно учитывайте требования и рекомендации.

1. Откройте исходное векторное изображение в Illustrator.
2. Убедитесь, что в нем нет битовых карт, ссылок на другие файлы, текста и сгруппированных объектов. Чтобы оставить текст в файле, преобразовав его в объект, используйте в Illustrator функцию Создать кривые.
3. Нажмите Файл > Сохранить как.
4. В окне Сохранить как:
   • Введите название файла в поле Сохранить как. Рекомендуем использовать только строчные буквы и дефисы, например moybrend-bimi.svg. Не используйте специальные символы.
   • В списке Формат выберите SVG (svg). Не выбирайте Сжатый SVG (svgz).
5. Нажмите кнопку Сохранить.
6. В окне Параметры SVG:
   • В списке Профили SVG выберите SVG Tiny 1.2.
   • Рядом с параметром Расположение изображения установите флажок Сохранить.
7. Нажмите кнопку "ОК", чтобы сохранить файл.
8. Откройте файл в текстовом редакторе. Вам нужно изменить первую часть файла. Она выглядит примерно так:
   
   <?xml version="1.0" encoding="utf-8"?>

   <!-- Generator: Adobe Illustrator 25.3.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->

   <svg version="1.2" baseProfile="tiny" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"

   y="0px" viewBox="0 0 742.23 828.45" overflow="visible" xml:space="preserve">

   <g id="design">

   <g>

   <!-- Generator: Adobe Illustrator 25.3.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->

   <svg version="1.2" baseProfile="tiny-ps" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"

   overflow="visible" xml:space="<title>Solarmora Services</title>

   <g id="design">

9. В текстовом файле измените строки 3 и 4:
   • У атрибута svg version должно быть значение 1.2. Если это не так, укажите значение 1.2 вручную.
   • Измените значение атрибута baseProfile на tiny-ps.
   • Удалите атрибуты x и y вместе с их значениями.
   • Добавьте тег <title> и его значение между <svg и <g>, как показано в примере на шаге 8.
10. После изменений убедитесь, что первая часть файла выглядит примерно так:
    
    <?xml version="1.0" encoding="utf-8"?>

<!-- Generator: Adobe Illustrator 25.3.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->

<svg version="1.2" baseProfile="tiny-ps" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"

overflow="visible" xml:space="<title>Solarmora Services</title>

<g id="design">
     
11. Сохраните внесенные изменения. У файла должно остаться расширение .svg.

Теперь вам нужно загрузить SVG-файл на общедоступный веб-сервер вашего домена.

Шаг 2. Загрузите SVG-файл на общедоступный веб-сервер

Загрузите созданный файл на ваш общедоступный веб-сервер.

Он должен находиться в том же домене, что и сервер исходящей почты. В этом домене нужно включить BIMI, следуя инструкциям в статье Как добавить запись TXT для BIMI у регистратора домена.

Скопируйте URL для файла SVG. Эту информацию вы добавите в запись TXT для BIMI.

Дальнейшие действия

Получите сертификат VMC или добавьте запись TXT для BIMI на сайте регистратора домена. В Gmail логотипы BIMI отображаются только в том случае, если у отправителя есть сертификат VMC.

_{Google, Google Workspace, а также другие связанные знаки и логотипы являются товарными знаками компании Google LLC. Все другие названия компаний и продуктов являются товарными знаками соответствующих компаний.}