Хабр Курсы для всех
РЕКЛАМА
Практикум, Хекслет, SkyPro, авторские курсы — собрали всех и попросили скидки. Осталось выбрать!
Хабр доступен 24/7 благодаря поддержке друзей
Комментарии 36
Для картинок еще обязательно прописать аттрибут image чтобы они отображались в некоторых клиентах
Всё равно каждый почтовик по своему обрезает теги. А Outlook вообще превращает оформленное письмо в кашу.
В соответствии с RFC-5322:
Возможно, надо корректно настроить почтовый агент на хостинге.
Ну, и, да, конечно, wordwrap() помогает.
Данная спецификация вносит два ограничения на число символов в строке. Строка должна содержать не более 988 символов; следует использовать строки размером не более 78, без учета CRLF.
Возможно, надо корректно настроить почтовый агент на хостинге.
Ну, и, да, конечно, wordwrap() помогает.
Подскажите, встречалась ли вам такая проблема, когда веб-доступ к Exchange режет избирательно изображения?
Пытался сверстать макет табличного письма для Outlook, возникла проблема —
таблица выглядит как несколько строк заголовка с логотипами, затем несколько строк с фотографиями сотрудников и текстом. Завершается тоже строкой с логотипом — то есть все картинки находятся внутри таблицы.
MS Outlook показывает корректно, доступ к этому же exchange через web как намеренно удаляет строки с логотипами, оставляя фотографии. Пытался добавить сверху и снизу лишний TR, но web outlook все равно удалил. При просмотре кода, видно что веб-доступ в эксчендже полностью коверкает html верстку, заменяя ее на свою с div/span/p, но как победить я не понял.
P.S. Клиент под apple ведет себя практически также, как web access — отрезал логотипы сверху и справа.
Пытался сверстать макет табличного письма для Outlook, возникла проблема —
таблица выглядит как несколько строк заголовка с логотипами, затем несколько строк с фотографиями сотрудников и текстом. Завершается тоже строкой с логотипом — то есть все картинки находятся внутри таблицы.
MS Outlook показывает корректно, доступ к этому же exchange через web как намеренно удаляет строки с логотипами, оставляя фотографии. Пытался добавить сверху и снизу лишний TR, но web outlook все равно удалил. При просмотре кода, видно что веб-доступ в эксчендже полностью коверкает html верстку, заменяя ее на свою с div/span/p, но как победить я не понял.
P.S. Клиент под apple ведет себя практически также, как web access — отрезал логотипы сверху и справа.
Не надо, пожалуйста, отправлять письма с картиночками и на бланке, это уродство нереальное. Еще и отображается везде по-разному. И грузить сраные картиночки-шрифтики по мобильному интернету тоже грустно.
Сделайте доброе дело, отправляйте письма в text/plain.
Сделайте доброе дело, отправляйте письма в text/plain.
text/plain крут в обычной переписке, а когда нужно провести рекламную кампанию или еще что-то там, то без красивых картинок не обойтись. Таковы реалии
А еще можно делать письма с двумя секциями: html и text/plain и тогда всем будет хорошо =)
Тесты показывают, что на 40% больше кликают на картиночки нежели просто тект
может быть, кто–то сталкивался с такой проблемой: клиент gmail для ios/android выводит вверху над сообщением большую кнопку: «вид сообщения отформатирован под ваш экран. показать оригинал?» естественно, вся вёрстка из–за изменения свойств разваливается, пока не нажмёшь на эту кнопку, после чего сообщение выглядит идеально, как и должно быть. можно как–нибудь заставить приложение изначально не делать ничего, просто сразу отображать оригинал?
Ужас, не думал что почтовые клиенты так ужасно себя ведут.
Из статьи я понял, что если вдруг соберусь делать рассылку, то буду использовать только чистый текст. Из-за отсутствия стандарта отображения html в почтовых клиентах надо слишком много помнить вещей, которые в будущем будут меняться.
Спасибо за подробное руководство!
Я бы добавил, что стоит всегда принудительно указывать шрифты, поскольку каждый почтовик отображает со своим шрифтом по умолчанию. Но это непринципиально, поскольку из текста статьи и так вытекает положение, что необходимо по максимуму заполнять всевозможные атрибуты и стили.
А что Вы можете сказать по поводу кодировки писем? Какую лучше и, если можно так сказать, правильнее использовать для рассылок?
Я бы добавил, что стоит всегда принудительно указывать шрифты, поскольку каждый почтовик отображает со своим шрифтом по умолчанию. Но это непринципиально, поскольку из текста статьи и так вытекает положение, что необходимо по максимуму заполнять всевозможные атрибуты и стили.
А что Вы можете сказать по поводу кодировки писем? Какую лучше и, если можно так сказать, правильнее использовать для рассылок?
Могли бы Вы выложить шаблон такой сверстанной странички для e-mail?
А я бы хотел добавить к всему сказанному в статье, что
Outlook игнорирует все инлайновые стили, которые снабжены !important;.
Довольно долго сегодня ломал голову, почему же ссылки у меня не окрашиваются… спасибо одному незаметному комментарию на стековерфлоу…
Так что учтите это, если когда-то вам случится верстать почтовые рассылки. Глядишь, сэкономите час-другой времени с этим знанием.
Outlook игнорирует все инлайновые стили, которые снабжены !important;.
Довольно долго сегодня ломал голову, почему же ссылки у меня не окрашиваются… спасибо одному незаметному комментарию на стековерфлоу…
Так что учтите это, если когда-то вам случится верстать почтовые рассылки. Глядишь, сэкономите час-другой времени с этим знанием.
zurb.com/ink/
использую для вёрстки писем, потом прогоняю через
templates.mailchimp.com/resources/inline-css/
потому как все стили в head некоторые веб-интерфейсы и почтовики обрубают. Со всем вышеперечисленным сталкивался, приходится помнить.
использую для вёрстки писем, потом прогоняю через
templates.mailchimp.com/resources/inline-css/
потому как все стили в head некоторые веб-интерфейсы и почтовики обрубают. Со всем вышеперечисленным сталкивался, приходится помнить.
Можно я крупными напишу?
Пожалуйста! Не используйте HTML разметку в письмах. НИКОГДА!!!
Кроме того, что это бессмысленная трата сил и времени, это еще и делает чтение письма невозможным в большинстве клиентов, кроме самых мэйнстримовых.
В целом, использование HTML разметки — бессмысленная и вредная практика выходящая за все стандарты и не имеющая ровным счетом никакого смысла.
Лучшее письмо — это plain text из пары строк написанных вежливым и грамотным языком и стандартным привычным для глаза пользователя шрифтом.
Пожалуйста! Не используйте HTML разметку в письмах. НИКОГДА!!!
Кроме того, что это бессмысленная трата сил и времени, это еще и делает чтение письма невозможным в большинстве клиентов, кроме самых мэйнстримовых.
В целом, использование HTML разметки — бессмысленная и вредная практика выходящая за все стандарты и не имеющая ровным счетом никакого смысла.
Лучшее письмо — это plain text из пары строк написанных вежливым и грамотным языком и стандартным привычным для глаза пользователя шрифтом.
Почему бы не использовать удобный и популярный и поддерживаемый всеми HTML, например внутри корпорации?
RTF поддерживается реже, чем html.
Не все являются программистами/сисадминами, да и в этом случае, крайне удобно при переписке помечать и выделять шрифтом и цветами отдельные слова/фразы — что есть кроме HTML? Да ничего!
RTF поддерживается реже, чем html.
Не все являются программистами/сисадминами, да и в этом случае, крайне удобно при переписке помечать и выделять шрифтом и цветами отдельные слова/фразы — что есть кроме HTML? Да ничего!
1. для того чтобы сделать акцент, вам не нужен ни цвет ни другой шрифт.
2. если очень хочется подчеркнуть что-либо, можно использовать классическую разметку _подчеркиваемое_ *выделенное*. Такая разметка
а) делает текст более читаемым
б) удобна для просто алгоритмизируемой машинной обработки, если это нужно корреспонденту (например на раз-два можно сделать парсер средствами bash и sed)
Т.е. «костыли» в виде разнокалиберных шрифтов и цветов в письме выдают в авторах людей элементарно неграмотных, как в смысле визуальной так и языковой культуры, не говоря уже про культуру программирования и тотально непонимающих, как работает типографика и как устроено восприятие текста человеком. Все это делает очевидным банальное неумение выразить мысль через простую компоновку (в абзацы и подпункты) и сделать это средствами самого языка.
Впрочем, это же имеет место и для сайтов. Как правило сайты с дизайном в стиле «вырви глаз» рассылают столь же чудовищные по оформлению письма-подтверждения (не говоря уже про навязчивые аноносы, о которых их никто никогда не просит), порой вовсе игнорируя текстовую часть.
2. если очень хочется подчеркнуть что-либо, можно использовать классическую разметку _подчеркиваемое_ *выделенное*. Такая разметка
а) делает текст более читаемым
б) удобна для просто алгоритмизируемой машинной обработки, если это нужно корреспонденту (например на раз-два можно сделать парсер средствами bash и sed)
Т.е. «костыли» в виде разнокалиберных шрифтов и цветов в письме выдают в авторах людей элементарно неграмотных, как в смысле визуальной так и языковой культуры, не говоря уже про культуру программирования и тотально непонимающих, как работает типографика и как устроено восприятие текста человеком. Все это делает очевидным банальное неумение выразить мысль через простую компоновку (в абзацы и подпункты) и сделать это средствами самого языка.
Впрочем, это же имеет место и для сайтов. Как правило сайты с дизайном в стиле «вырви глаз» рассылают столь же чудовищные по оформлению письма-подтверждения (не говоря уже про навязчивые аноносы, о которых их никто никогда не просит), порой вовсе игнорируя текстовую часть.
Вы рассуждаете с точки зрения IT-специалиста с техническим образованием, и я полностью согласен со всеми приведенными аргументами в пользу text/plain. Но в большинстве случаев требования к HTML-разметке писем, так же как и «вырви-глаз-дизайн» сайтов, исходят от заказчиков или руководителей либо с извращенным вкусом, либо просто настолько упертых, что их невозможно переубедить. Так что нам, как разработчикам, остается либо выполнять требования, либо искать другое место работы/другого заказчика.
Грош — цена специалисту, который не в состоянии аргументированно и доходчиво объяснить заказчику, почему хорошее решение лучше плохого. «Специалист» же, который идет на поводу у глупого заказчика и делает что-либо вопреки собственным представлениям о профессиональном уровне и качестве (тем более, оправдывая это получаемыми деньгами) вовсе не достоин называться таковым и, напротив, достоин всякого порицания.
Любой специалист всегда имеет возможность отказаться работать с клиентом (или начальником) который по его мнению не соответствует своей позиции и предъявляет требования не сопоставимые с его профессиональным уровнем. Всегда можно просто отказаться. Просто ради уважения к себе, хотя бы.
Любой специалист всегда имеет возможность отказаться работать с клиентом (или начальником) который по его мнению не соответствует своей позиции и предъявляет требования не сопоставимые с его профессиональным уровнем. Всегда можно просто отказаться. Просто ради уважения к себе, хотя бы.
А как тогда отправить письмо с сылкой на сброс пароля/просмотр новой публикации/правила акции/новые правила обслуживания/новую политику кофиденциальности и т.д.?
А ещё, если это рассылка, то должна быть ссылка на отписку. Как её вставлять?
Не весть HTML, а просто картинки (для логотипа) + ссылки почему нельзя использовать?
Любопытно узнать на счёт поддержки svg почтовыми клиентами (многие веб-морды и какой-нибудь kmail работают нормально, но на счёт того же outlook посмотреть негде).
Встроили бы все эти почтовики уже давно какой-нибудь WebView или что-то подобное на каком-нибудь WebKit'е. Столько лет прошло, а воз и ныне там.
Обнаружил случайно, что в TheBat 4.2 не отображаются картинки, если указать ширину и высоту перед тегом src. Т.е.
картинка отображается, если
картинка отображается, если
<img src="http://example.com/image.jpg" width=200 height=200 />
<img width=200 height=200 src="http://example.com/image.jpg" />
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Верстка email рассылок от А до Я для чайников