• Верстка писем. Снова баги

      Автор изображения Eva Galesloot

      Привет!

      Прежде всего хочу принести извинения в адрес mail.ru и лично Андрею Сумину AndrewSumin за пост, написанный сгоряча. Проблема верстки писем изрядно наболела, но местами все не так плохо как казалось. Присутствуют и проблемы.

      Касательно mail.ru на данный момент претензий почти не имею. Верстать письма под эту вебморду так же приятно, как и для гуглопочты. Очень приятно видеть, что русские вебморды стали поддерживать фоновые изображения.

      Знаете чего очень не хватает? Фичлиста от разработчиков почтовых клиентов и вебморд. Было бы очень здорово узнавать из первых рук, какие фичи ввели в обращение, а какие наоборот — урезали. Это облегчило бы головную боль верстальщика, да и пользователь перестал бы получать кривые письма. Да, это очень важная информация.

      Ниже приведу несколько новых багов, которые стоит учесть при подготовке писем, а разработчикам — закрыть их.
      Читать дальше →
    • Koding.com радует нововведениями



        Koding.com — полноценная частично бесплатная среда разработки в браузере и социальная сеть для разработчиков в одном флаконе.

        Прошлогодний обзор
        Недавний обзор

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

        Не может не радовать скорость работы вебморды. Несравнимо лучше относительно момента запуска проекта.

        Из минусов (если кто пропустил), виртуальная машина выключается через 15 минут после прекращения работы с ней. Позиция разработчиков сервиса: «Нефиг разворачивать бложики и эксплуатировать сервис как хостинг. Мы даем вам среду разработки и тестирования.»

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

        Читать дальше →
      • Верстка писем, набор сниппетов



          Автор изображения MVBen

          До русских заказчиков наконец таки дошло, что мобильный веб набрал достаточные обороты для того, чтобы тратиться на его поддержку, в том числе и в рассылках. Ко мне все чаще обращаются с тем, чтобы сверстать письмо, которое бы адекватно смотрелось не только в зоопарке всевозможных почтовых клиентов и вебморд, но и на планшетах и смартфонах.

          В ходе работ у меня накопилось немного готовых решений, которые я сам ныне держу у себя под рукой и крайне часто использую, чем и с вами хочу поделиться.
          Читать дальше →
        • Верстка писем и email рассылок. Немного магии Gmail


            Автор изображения Mike, Creative Mints

            Добрый день. Я уже не раз писал о том, что media_queries в почтовых клиентах работают прекрасно. Даже outlook.com в браузере их адекватно воспринимает. Но вот gmail на яблоке и андроиде так не считает.

            Если в случае остальных клиентов мы можем сделать, например так:
            @media only screen and (max-width:480px) {
            .big_img { display:none !important; }	 .small_img { display:block !important; }
            }
            @media only screen and (max-width:600px) {
            .big_img { display:block !important; }	 .small_img { display:none !important; }
            }
            
            Читать дальше →
            • +12
            • 35.7k
            • 6
          • Адаптивные письма? Пожалуйста!

              Доброго дня.

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

              Итак, письмо:



              Футер нас не особо интересует, ибо там все ок.
              Но на экране телефона все не так радужно.
            • К черту веб-разработку или «Как я ушел головой в электронные письма»

                Меня зовут Артур Кох, и я не вижу своей жизни без интернет-рассылок. Многие читатели хабра знают меня по длинной серии публикаций на тему верстки HTML-писем, но это не все, чем я занимаюсь. Я с большим интересом работаю в сфере email маркетинга уже не первый год, и за это время накопилось очень много интересных наблюдений как на российском рынке, так и за его пределами, о которых я бы хотел рассказать. Будет здорово, если все ниже описанное не вызовет типичный для этой темы холивар на тему “email рассылки не нужны, горите в аду”. Местами будет сумбурно, субъективно, но скорее всего, интересно.
                Читать дальше →
              • Проблемы современных рассылок

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

                  Спам


                  Куча писем попадает в спам. Даже если они таковыми и не являются. 30% сервисов, в которых я регистрируюсь отправляют подтверждение регистрации мне на почту, но я ловлю его в спаме. Но это я. Да, я читаю папку «спам». Складывается впечатление, что многим просто плевать на потенциальных клиентов. Куда смешнее получать подобные письма в спам от компаний, предоставляющих, например, услуги рассылок. Каламбур.
                  Читать дальше →
                • MailBox глазами писем

                    Еще в прошлом году разработчики Дропбокса выкатили в Эппстор MailBox App. Волне себе удобный и приятный почтовый клиент для мобильных устройств от Apple. Вот здесь можно увидеть его обзор на момент выхода.

                    Сейчас же клиент претерпел нехилые изменения, получил очень минималистичный дизайн (даже чище стандартного Mail App), см. скриншот справа. Кроме всего прочего клиент позволяет прикреплять в аттач файлы с вашего дропбокс аккаунта. Но не об этом данный топик.

                    Не так давно встала задача сверстать письмо, которое будет также адекватно отображаться как MailBox, так и в других почтовых клиентах. Dropbox сейчас проводит бета-тестирование десктопной версии почтовика, поэтому я быстро раздобыл инвайт и приступил к делу.

                    Разумеется я запулил 100500 тестов и вот к чему я пришел.
                    Читать дальше →
                  • Хабр, давай пофиксим письма?

                      Привет.

                      В очередной раз получив письмо от хабра, я расстроился. А дело вот в чем. На скриншоте слева мы видим нормальное адаптированное письмо. Так оно отображается во всех вменяемых мобильных почтовых клиентах, которые поддерживают media queries. Теперь давайте взглянем на скрин справа. Таким письмо мы видим в мобильных Gmail, Yandex, Mail.ru клиентах как на андроиде, так и на яблочке. Как вы уже возможно догадались, эти клиенты media queries не поддерживают.


                      Будем лечить?
                      • +28
                      • 13.5k
                      • 4
                    • По-настоящему адаптивные письма. Часть первая

                        Написание данного поста навеяно недавней поистине шикарной работой, Niсole Merlin. Во многом ее методика верстки схожа с моей и мне радостно от того, что это направление развивается теперь и на западе. Чем же этот способ так хорош? Все очень просто. Не нужно объяснять как важно адаптировать под мобильные платформы сверстанные письма для того, чтобы они были прочтены. Читать простыни на телефоне мало кто будет. Что же все это время делал западный разработчик? Он верстал табличной версткой с элементами блочности, затем причесывал этот код медиазапросами для поддержки мобильников. Чем этот подход ущербен? А тем, что ни на андроиде, ни на яблоке медиазапросы не поддерживаются следующими почтовыми клиентами: Gmail, Yandex, Mail.ru. По большому счету западные коллеги могли бы и наплевать на яндекс с мейлом, но вот Gmail как ни крути первый среди почтовиков.



                        Для Nicole Merlin это стало очевидно и она разработала свою методику, которая основывается на резиновой верстке с минимальным использованием медиазапросов(progressive enhancement) и это работает! Но немного не так как хотелось бы нам в России. Вся резиновость автора держится на inline-block элементах и оперированием max-width. Но вот беда-то, наши ребята из яндекса и мейла max-width не поддерживают. Сначала я расскажу об отличиях моего подхода от приемов Nicole, а затем плавно перейду к своим мыслям и примерам кода, которые стоит использовать при подготовке писем.
                        Читать дальше →
                        • +8
                        • 19.1k
                        • 8
                      • По-настоящему адаптивные письма. Часть… снова первая



                          Первый пост был написан скорей на эмоциях. Метод Николь мне показался местами несостоятельным и громоздким, но стоит признать, что он во многом превосходит мои наработки и отныне я с удовольствием перенимаю ее приемы. Тем не менее Николь сделала легкие огрехи, которые я исправил. Также я убираю лишний мусор и экспериментирую с универсальными решениями для типичных задач при верстке.

                          К чему мы приходим:
                          — Использование внешних стилей и последующий прогон кода через инлайнер. Из-за усложнения кода это стало целесообразным
                          — Улучшение семантики через именование классов и сокращение участков кода
                          — Частичная поддержка the Bat! Хотя Николь на него забила.
                          — Полная поддержка всех мобильных почтовых клиентов
                          — Использование ранее опасных конструкций. Благодаря усердному тестированию проблемы решены.
                          Читать дальше →
                        • По-настоящему адаптивные письма. Часть вторая. Фреймворк


                            Картинка для привлечения внимания честно сперта у invisionapp (кстати, у них божественная рассылка)

                            С момента публикации последнего поста прошло ни много ни мало, полтора месяца, но на то были причины. Уйма работы и бредовые мысли задрота-верстальщика. Сначала я собирался просто перенять приемы Николь Мерлин для верстки писем себе, но потом хипстерская голова подумала: А почему бы не зафигачить целый фреймворк? Громкое слово для моей поделки, но мне приятно его так называть. Начнем с простого.
                            Читать дальше →
                            • +19
                            • 24.9k
                            • 8
                          • Сумбурно о разработке писем



                              Картинка для привлечения внимания пренадлежит studio4

                              Привет. За долгое время накопилось много интересностей на тему разработки писем, но систематизировать это в полноценный рассказ я не представляю возможным. Вместо этого я просто расскажу об этом так, как указано в заголовке топика.
                              Читать дальше →
                              • +11
                              • 15.3k
                              • 6
                            • Номера телефонов в почтовых клиентах

                                Казалось бы простая задача: вывод номера телефона в письме. Что может быть сложного? Классика. Никто не может прийти к единому стандарту.



                                Вопрос дня:


                                Использовать нативность, чудить или достучаться до разработчиков? Я не дам на него ответ, ибо сам нахожусь в замешательстве.

                                Возьмем номер:

                                8 (800) 888-88-88


                                И будем извращаться
                                Читать дальше →
                              • Нейромаркетинг: новый подход к повышению конверсии (часть 2)

                                  image

                                  В первой части статьи о нейромаркетинге мы рассказали о том, как и с какими клиентскими страхами можно бороться при помощи нейромаркетинговых инструментов, дополненных цифровым маркетингом. Но это еще не все! Продолжаем разговор: как работать с традиционными маркетинговыми приемами в Интернете, что обо всем этом говорят на Западе и как пользоваться картой салиентности?
                                  Читать дальше →
                                • Нейромаркетинг: новый подход к повышению конверсии

                                    image

                                    Слово «нейромаркетинг» нынче на слуху, но не все воспринимают его как научный подход, находящийся «на стыке» медицины, психологии и digital marketing (цифрового маркетинга). Этот метод часто используется в ритейле для увеличения продаж, да и успех многих видео-игр основан именно на нейромаркетинге, даже принципы Р. Чалдини, которые известны каждому маркетологу, во многом перекликаются с постулатами нейромаркетинга. Как насчет того, чтобы разобраться в этом понятии более подробно?
                                    Читать дальше →
                                  • 5 удивительных уроков по оптимизации коэффициента конверсии (примеры из реальной жизни)

                                    • Translation
                                    image

                                    Оптимизация коэффициента конверсии – это не только излюбленная тема авторов блога CrazyEgg, но и метод, при помощи которого вы можете извлечь больше пользы из потока пользователей на страницах вашего сайта. Лучший способ обучиться оптимизации – это почерпнуть знания у тех, кто её уже делал. Ниже приведён ряд советов по оптимизации коэффициента конверсии, а также свежие приёмы оптимизации, использованные различными компаниями. Вы увидите, что иногда удаётся добиться поистине удивительных результатов.
                                    Читать дальше →
                                  • Email-маркетинг — плюсы использования SaaS решений

                                    На сегодняшний день электронная почта является одним из основных инструментов общения между людьми. Все больше и больше компаний прибегают к этому способу общения со своими клиентами. Существует великое множество всевозможных сервисов для отправки маркетинговых рассылок, транзакционной почты, трекинга сообщений, отслеживания конверсии… Зачастую компаниям приходится выстраивать целый каскад интеграций между своим программным обеспечением и подобными решениями. Так стоит ли использовать SaaS для email-маркетинга? Однозначно, стоит! Почему? Добро пожаловать под кат.
                                    Читать дальше →
                                  • 5 полезных и бесплатных сервисов для email-маркетологов

                                      На этот раз я хочу поделиться с вами полезными и удобными бесплатными сервисами, которые помогут вам создать и разослать эффектную маркетинговую рассылку. Как создать валидное email-письмо? Как узнать примерную вероятность попадания письма в спам? Добро пожаловать под кат!
                                      Читать дальше →
                                    • 5 способов повысить эффективность ваших email-рассылок

                                      • Translation
                                      Привет всем! Вот и наступила очередная рабочая неделя, а это значит, что мы снова готовы поделиться с вами эффективными техниками повышения эффективности ваших email-кампаний.
                                      Читать дальше →