«Профсоюз верстальщиков был нам благодарен» Так я подумала, когда впервые сверстала письмо через Клод за 10 минут и 3 итерации. Я обещала не рассказывать про экономию и саксесс-стори в первом сезоне. Но все же поделюсь.
Процесс, как он был. Чтобы сделать одну емейл-рассылку: формируем ТЗ → дизайнер в фигме рисует макет → отправляем верстальщице, за 1200 р. она делает верстку → отдаем в рассылку. На каждом, КАЖДОМ этапе - правки из-за не досмотрел/забыл/не учел. И постоянно нужно было ждать. Ждать, пока дизайнер доделает презентацию и приступит к макету, ждать, пока верстальщица проснется, ждать, когда у меня будет 10 минут, чтобы отсмотреть правки на ошибки. Бррр.
Процесс сегодня. Прошу клода сделать классную рассылку в фирменном стиле
Балл в пользу ИИ. Экономия — 7 000 р. и часов пять в месяц.
Почему тогда мы в проигрыше? Потому что уже пятое письмо верстаю я сама, без делегирования. Счет в сезоне: отдел - 3 : ИИ - 2 🎁Бонус - промпт, которым верстаю: Сверстай HTML-письмо для рассылки через Юнисендер (вставка через «свой HTML»). Выдай один самодостаточный HTML-файл. Фирстиль: дай палитру (акцент-градиент + сплошной фолбэк, фоны, цвета текста), шрифтовой стек (веб-шрифтов в письмах нет — системные: 'Trebuchet MS', Verdana, Arial, sans-serif), обязательный локап события. Технические требования (Юнисендер / почтовики): Верстка только на таблицах (role="presentation"), все стили инлайном. В <head> — лишь media queries и reset. Контейнер 600px, центрирован. Мобильная версия через @media (max-width:480px): контейнер 100%, заголовок и крупные цифры уменьшаются, многоколоночные блоки складываются в одну (.stack → display:block; width:100%), сетки карточек — из 3 колонок в 2. Outlook: сплошной bgcolor-фолбэк под каждым градиентом, MSO-условные комментарии вокруг inline-block-сеток, <xml>-блок с PixelsPerInch в head. Картинки: пути через плейсхолдер {{IMG_BASE}}/имя.png, латинские имена. Фото людей — круглые PNG с прозрачным фоном (круг запечён в файл, не CSS-маской), 240×240, показ ~88–120px. У каждой значимой картинки width атрибутом и alt; письмо читается с отключёнными картинками. Обязательно: скрытый прехедер (display:none + -набивка) и переменная отписки {{UnsubscribeUrl}} в футере — без неё письмо не пройдёт модерацию. Читаемость: основной текст 15px/23px, min 14px на мобильном, контраст не ниже AA; телефоны/почты кликабельны (tel:, mailto:). Вес до 100 КБ (лимит Gmail), целиться в 15–30 КБ. Никаких <form>, JS, внешних CSS и веб-шрифтов. Структура: шапка с лого → хиро (градиент, заголовок, даты) → контентные блоки → CTA-кнопки с UTM → тёмный футер с локапом и отпиской. Тон: факты вместо маркетинга, без лишних прилагательных. Самопроверка перед выдачей: превью-PNG (верх/середина/низ), три состояния (десктоп 600px / мобильный ≤480px / Outlook-фолбэк), {{IMG_BASE}} и {{UnsubscribeUrl}} на месте, вес < 100 КБ, читается без картинок. Дальше — содержание конкретного письма.
