x
 
Игорь Петров
27 декабря 2018
Советы почтой каждую неделю
Пожалуйста, получите наше письмо, чтобы подтвердить свой адрес:
Вы подписаны на «Советы за неделю»:

Василий, Руст, привет!

Расскажите, как в бюро верстают электронные письма и рассылки?


Игорь!

Это зави­сит от письма. Мы делим письма на тран­зак­ци­он­ные и мас­со­вые. Тран­зак­ци­он­ное письмо — письмо, кото­рое при­хо­дит в ответ на дей­ствия поль­зо­ва­теля или при наступ­ле­нии собы­тия в сер­висе, каса­ю­щемся поль­зо­ва­теля. Например:

  • офор­мил под­писку, полу­чил кви­тан­цию об оплате;
  • запи­сался на день откры­тых две­рей, полу­чил письмо‑подтверждение;
  • запи­сался на курс, полу­чил письмо‑под­твер­жде­ние с инструкциями;
  • купил книгу и так её не открыл, полу­чил письмо‑напоминание;
  • был зачис­лен на вто­рую сту­пень, полу­чил письмо о зачислении.

Мас­со­вые — стан­дарт­ные рас­сылки по списку адре­сов: письма о выходе новых глав в кни­гах, ново­сти Ковор­кафе, анонс набора в Школу бюро.

Тран­зак­ци­он­ные письма вер­стаем из стан­дарт­ных модулей:

login_notice, email_footer, receipt_table — стан­дарт­ные модули (пар­ши­алы), кото­рые исполь­зу­ются повторно во всех пись­мах

Письма авто­ма­ти­че­ски обра­ба­ты­ва­ются с помо­щью Premailer. Он пере­но­сит стили эле­мен­тов из <style> или внеш­них фай­лов в атрибуты:

Ори­ги­наль­ная раз­метка и раз­метка в гото­вом письме

Чтобы письма было удоб­нее вер­стать и отла­жи­вать, исполь­зуем стан­дарт­ные Рель­со­вые превьюшки:

Одно­вре­менно про­ве­ряем деск­топ­ную и мобиль­ную вер­сии письма

Чтобы быст­рее согла­со­вы­вать письма с дизай­не­рами, пре­вьюшки писем вклю­чены на стей­джинге: чтобы пока­зать письмо, раз­ра­бот­чики ски­ды­вают ссылку на его превьюшку.

Пре­вьюшки писем, отправ­ля­е­мых новым бэкен­дом сайта бюро

С вёрст­кой рас­сы­лок дела похуже: часть рас­сы­лок вер­ста­ется вруч­ную из шаб­лона, часть живёт в Мей­л­чимпе, часть — соби­ра­ется авто­ма­ти­че­ски. О них рас­скажу в сле­ду­ю­щих советах.

P. S. Это был совет о веб‑разработке. Хотите знать всё о коде, тестах, фронтенд‑разработке, цеэсэсе, яваскрипте, рельсах и джейде? Присылайте вопросы.
Вёрстка и прототипирование — дисциплина Школы дизайнеров. Набор открыт до 12 августа или пока есть свободные места.
 

Поделиться
Отправить

Цель рубрики — обсуждение вопросов дизайна всех видов, текста в дизайне и взаимоотношений дизайнеров с клиентами.

Мы публикуем комментарии, которые добавляют к уже сказанному новые мысли и хорошие примеры. Мы ожидаем, что такие комментарии составят около 20% от общего числа.

Решение о публикации принимается один раз; мы не имеем возможности комментировать или пересматривать свое решение, хотя оно может быть ошибочно. Уже опубликованные комментарии могут быть удалены через некоторое время, если без них обсуждение не становится менее ценным или интересным.

Вот такой веб 2.0.

Как переходить на переписанные с нуля сервисы? Как организовать работу удалённой команды разработчиков? С чего начать вёрстку ХТМЛ‑страницы 2 Как донести подход HADI до руководства? 4




Недавно всплыло

Как найти себе замену 1 2 Хочу научиться сторителлингу 9 2