Абсолютно новое руководство по поддержке CSS в электронной почте

  1. Что нового в обновлении 2017 года?
  2. Проверено больше возможностей CSS
  3. Проверено больше почтовых клиентов
  4. Полный редизайн
  5. Только веб
  6. Заворачивать

Интересный факт: с тех пор прошло более десяти лет Руководство по поддержке CSS в электронной почте было впервые выпущено ,

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

Руководство по CSS всегда было одним из наших самых популярных ресурсов, помогая людям во всем мире, которые пишут электронные письма, выполнять свою работу. Как разработчик электронной почты, я считал его знаковым интернет-ориентиром задолго до того, как присоединился к Campaign Monitor.

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

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

Но сегодня у нас есть что-то особенное для вас. Ознакомьтесь с новым руководством по CSS в электронной почте.

Что нового в обновлении 2017 года?

Что не ново! Когда мы приступили к работе над новым руководством по CSS, мы не просто хотели повторно протестировать и обновить то, что уже было там. CSS не стоит на месте за последние 3 года, как и почтовые клиенты.

Проверено больше возможностей CSS

Предыдущее руководство включало 111 различных функций, тогда как новое руководство охватывает в общей сложности 278 функций .

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

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

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

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

Проверено больше почтовых клиентов

С 2014 года появилось много новых почтовых клиентов. Особенно на мобильных устройствах, где мы расширили наше руководство, чтобы включить приложения для Android и iOS таких клиентов, как Gmail, Yahoo! Почта и Outlook. За Android-приложение Gmail мы проверили IMAP а также Gmail адреса отдельно, чтобы захватить различия в рендеринге.

Мы также проверили 4.2.2 а также 4.4.4 версии Почты Android отдельно, поскольку между ними произошли серьезные изменения в поддержке CSS.

Для настольных клиентов, таких как Apple Mail, Thunderbird, AOL Desktop и Postbox, мы повторно протестировали последнюю версию. И для различных клиентов электронной почты для настольных компьютеров, выпущенных Microsoft на протяжении многих лет, мы постарались охватить как можно больше из них.

В общем, мы перешли от 24 до 35 почтовых клиентов. Если вы умножите это на количество протестированных функций, размер руководства по CSS увеличится более чем в три раза .

Полный редизайн

Наша предыдущая таблица поддержки CSS уже лопалась, особенно если вы пытались просмотреть ее на маленьком экране. Теперь, когда данные выросли втрое, нам пришлось изменить дизайн руководства, чтобы учесть увеличение объема информации.

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

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

Если функция частично поддерживается или требует использования префикса поставщика, эта информация теперь отображается внутри строки, а не скрывается как всплывающая подсказка при наведении курсора, как раньше. Это изменение особенно удобно, если вы читаете на мобильном телефоне.

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

Чтобы упростить поиск по огромным объемам данных, есть также поле поиска, которое позволяет вам перейти непосредственно к функции, которую вы хотите проверить

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

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

Если вам постоянно приходится искать, какие виды медиа-запросов поддерживаются и где, вы можете добавить в закладки страница медиазапросов , Если кто-то спросит, работают ли фоновые изображения URI данных в электронной почте, вы можете указать их прямо на нужную ссылку ,

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

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

Только веб

Еще одно изменение заключается в том, что мы больше не предоставляем версии руководства в формате Excel и PDF. Есть несколько причин для этого.

Во-первых, увеличение содержания сделало эти форматы менее подходящими.

Во-вторых, мы хотим постоянно обновлять руководство. За кулисами мы добавили систему управления контентом, которая делает этот процесс намного более плавным, чем раньше.

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

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

Заворачивать

Вы часто слышите, что большинство маркетологов электронной почты сейчас используют инструменты перетаскивания, такие как наш Email Builder разрабатывать свои электронные письма. Но что также верно, так это то, что в нашем сообществе больше, чем когда-либо, разработчиков электронной почты, которые творчески используют новейшие методы CSS и придумывают новые.

Мы рады наконец-то снабдить вас новейшим руководством по поддержке CSS в электронной почте.

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

Похожие

Что такое хост-адаптер?
... влено: 26.04.2017 от Computer Hope Хост-адаптер , HBA ( хост-адаптер шины ) или хост-контроллер - это часть компьютера, которая обеспечивает связь с такими устройствами, как жесткие диски , Ethernet , волокно,
Книги года 2016 lubimyczytać.pl - голосование длится только до 28 февраля! - что читать
Спешите и примите участие в голосовании за книги orimyczytać.pl 2016 года, организованные крупнейшим книжным веб-сайтом (обзор и информация) в Польше. У Lubimyczytać.pl сотни тысяч польских читателей. Сайт, как и его английский аналог Goodreads.com, организовал ежегодное голосование за лучшего принца года в котором читатели отдают свои голоса. Большим преимуществом таких плебисцитов является тот факт, что выбор определенного
CSS Float Theory: вещи, которые вы должны знать
... CSS. Плавания часто неправильно понимают и обвиняют в том, что они перемещают весь контекст вокруг него, вызывая проблемы с удобочитаемостью и удобством использования. Однако причина этих проблем не в самой теории, а в том, как теория интерпретируется разработчиками и браузерами. Тем не менее, если вы внимательно посмотрите на теорию float, вы обнаружите, что она не так сложна, как кажется. Большинство связанных с этим проблем вызвано более старыми версиями Internet Explorer. Если вы знаете
USB, Firewire & Thunderbolt: что лучше для аудио?
Если вы выбираете новый аудиоинтерфейс или новый компьютер, каковы плюсы и минусы множества предлагаемых протоколов подключения? Лучше купить аудиоинтерфейс, который подключается к моему компьютеру через USB, Firewire, Thunderbolt или PCIe? Какой из них еще пригодится через пять или 10 лет? И почему вокруг нет больше интерфейсов USB 3? По мере того, как расширяются наши возможности получения данных от A до B - недавно были добавлены USB 3, Thunderbolt и Thunderbolt 2, в то время как
Как использовать CSS3 Radial Gradient с примером
... больше о градиенте CSS3 и особенно о радиальном градиенте CSS3. Если вы обратились непосредственно к этой части руководства, мы рекомендуем вам взглянуть на первую часть статьи, а не на эту часть. Многоцветный градиент давайте продолжим с многоцветным градиентом. Это довольно просто, после второго и третьего аргумента для функции линейного градиента, добавить столько цветов, сколько вы хотите. Вот пример [codepen_embed height = ”266 ″ theme_id =” 0 ″ slug_hash
Как приземлиться с девочками (Руководство для девочек для мальчиков)
... времени в Интернете, и вы придете к выводу, что молодые люди сегодня попадают в одну из двух категорий: чрезмерно чувствительные щенки, пытающиеся получить настоящую любовь покупка или парни, которые думают, что флирт - это пьяный взлом и крики угроз изнасилования на дороге с дорожным конусом в виде мегафона для девушек. Несмотря на то, что эта картина не совсем точна, кажется, что слишком много
Все, что вам нужно знать при поездке в Италию
Вот мой первый (и, вероятно, единственный) оригинальный путеводитель, который творит чудеса ! И как? Очень просто. Спасает жизни, защищает ваши кошельки, гладит вас по вкусу, заботится о ваших международных отношениях и (самое главное) сохранит ваше чувство юмора во всем этом. Ничего, просто тренируйся! Причиной этого текста стала статья, найденная в сети, в которой я узнал, что
Градиенты с помощью CSS3 »perun.net
... CSS3 для реализации цветовых градиентов не является чем-то новым. Вот очень простой пример: .evolution {background: -moz-linear-Gradient (вверху, # 900, # 079); цвет: #fff; набивка: 2,5em 3em; } Этот пример выглядит в Mozilla Firefox следующим образом: Это не все, что возможно с CSS3, как
Не знаете, что такое подарок Санты? Что купить у родственников? У многих людей (в том числе и у меня) есть пробл...
Не знаете, что такое подарок Санты? Что купить у родственников? У многих людей (в том числе и у меня) есть проблема с подарками для своих близких. Независимо от того, будет ли это день рождения, именины, юбилей или Дед Мороз, проблема всегда одна и та же - какой подарок купить? Я выберу то, что я выберу? От случая к случаю, от Рождества до Рождества, от одного пропущенного подарка к другому, я всегда обещаю себе, что в следующий раз, когда я покрою это раньше, я спрошу и т. Д. ...
Интернет-магазин по сравнению с традиционным или что и где покупать (инфографика)
Каждый интернет-магазин ищет наиболее эффективную форму общения с покупателями. Кроме того, когда он имеет низкую маржу, он учитывается в каждом злотом, и это ограничивает
Продажа в Allegro - что такое правовое регулирование? - eKomercyjnie.pl: eKomercyjnie.pl
... верное, каждый, кто регулярно пользуется почтовым ящиком, ценит ценную информацию и не любит ходить по спам-мачете по электронной почте"> Наверное, каждый, кто регулярно пользуется почтовым ящиком, ценит ценную информацию и не любит ходить по спам-мачете по электронной почте. Если это так, то такой человек не будет уклоняться от процесса подписки. Очень часто эту миссию невозможно выполнить, что приводит к взрыву отрицательных эмоций и в конечном итоге причиняет очень большой вред отправителю.

Комментарии

Учитывая, что вы попали на эту страницу, мы предполагаем, что вы имели в виду Samsung - зачем еще покупать лучший телевизор Samsung?
Учитывая, что вы попали на эту страницу, мы предполагаем, что вы имели в виду Samsung - зачем еще покупать лучший телевизор Samsung? Но, возможно, вы все еще находитесь на той стадии исследования, когда вы не совсем уверены в Samsung, и хотели бы знать, почему так много других людей - рецензентов и энтузиастов - ездят на рекламном поезде Samsung. Samsung так сильно влияет на этих людей, потому что их телевизоры, как правило, более яркие и намного ярче, чем конкуренты, особенно в
Однако мы постоянно следим за ситуацией и, как только произойдут серьезные изменения, дайте нам знать 😉 А что у вас за ситуация?
Однако мы постоянно следим за ситуацией и, как только произойдут серьезные изменения, дайте нам знать 😉 А что у вас за ситуация? * Источник: https://mobirank.pl/2016/01/27/mobile-digital-w-polsce-na-swiecie-2016/
Если вы думаете, что мы настолько пугающе горячи, что единственный способ оказаться на своем самолете - это оскорбления Может быть, мы просто слишком хороши для вас?
Если вы думаете, что мы настолько пугающе горячи, что единственный способ оказаться на своем самолете - это оскорбления Может быть, мы просто слишком хороши для вас? Кроме того, мы все знаем идеальную аферу сейчас, она была на рынке буквально десятилетие, чувак. У большинства из нас был наш первый опыт пикапа. Художники, когда мы тайно проникали в клуб с поддельным удостоверением личности, именно так, как ласка Джулиана Ассанжа, может рассказать нам о своих навыках чтения руки.
Тогда вы можете спросить, что же нового в Z2?
Тогда вы можете спросить, что же нового в Z2? Ну, у него немного больший 5,2-дюймовый дисплей, более тонкая рамка по краям, чуть более быстрый процессор Qualcomm с частотой 2,3 ГГц, новейшее программное обеспечение Android 4.4.2 KitKat и камера, способная снимать видео 4K. Хотя это лишь незначительные обновления, Z1 уже был потрясающим комплектом, и, возможно, это будет слишком рано для полного ремонта, учитывая, что он был выпущен только в сентябре прошлого года. Это доступно
Png bognam 2016-04-04 14:06:00 2016-12-01 16:08:48 Освещение в детской комнате - что искать и что искать?
png bognam 2016-04-04 14:06:00 2016-12-01 16:08:48 Освещение в детской комнате - что искать и что искать? https://www.homesquare.pl/files/uploads/2016/02/Kreatywny-pokój-zabaw.jpg 420 800 bognam https://www.homesquare.pl/files/uploads/2016/10/Logo-HomeSquare- PNG.png bognam 2016-02-22 16:11:41 2016-12-01 16:24:33 Творческая игровая комната для ребенка
Что если данная модель отличается только несколькими функциями, которые мы не рассматривали ранее?
Что если данная модель отличается только несколькими функциями, которые мы не рассматривали ранее? Нам действительно нужно 15 приложений и доступ в интернет когда мы ищем приемник только для просмотра ТВ и фильмов? Зачем переплачивать? Мы получим Toshiba
Первый вопрос, который давит на губы: что нового?
Первый вопрос, который давит на губы: что нового? Вот технические характеристики устройства: Первое место занимает 10,1-дюймовый экран Triluminos с разрешением 2K или, точнее, 2560 x 1600 пикселей. Это очень много, потому что благодаря этой плотности достигает 302 PPI. Однако это еще не все. Корпус, толщиной всего 6,1
Знаете ли вы, что более 67% пользователей на веб-сайтах электронной коммерции оставляют свои корзины покупок без проверки?
Знаете ли вы, что более 67% пользователей на веб-сайтах электронной коммерции оставляют свои корзины покупок без проверки? Клиенты хотят, чтобы на их вопросы отвечали мгновенно, и любая неопределенность с их покупкой может привести к потере продажи. Использование программного обеспечения для поддержки чата в реальном времени помогает вам мгновенно отвечать на вопросы пользователей и превращать их в платящих клиентов. В этой статье мы поделимся нашим выбором лучшего программного обеспечения
Когда вы вспоминаете среднюю школу, что первое, что приходит на ум?
Когда вы вспоминаете среднюю школу, что первое, что приходит на ум? Чувствуете себя застенчивым в предпубертатном теле (или у некоторых полная зрелость)? Выемка? Или тот чрезвычайно неловкий класс, когда вы изучили мужскую и женскую репродуктивные системы? Для некоторых эта память, кажется, исчезает довольно быстро. Buzzfeed недавно попросил группу взрослых пометить диаграммы
А что если у нашего роутера нет модуля Wi-Fi и интернет отправляется только через кабель?
А что если у нашего роутера нет модуля Wi-Fi и интернет отправляется только через кабель? Тогда точки доступа будут работать отлично. Эти устройства позволяют создавать сеть Wi-Fi и расширять зону действия интернета, например в офисе. TP-LINK представила в своем предложении усилитель беспроводного сигнала RE580D и точку доступа AP500. Оба устройства работают в новейшем стандарте 802.11ac и транслируют двухдиапазонную беспроводную сеть Wi-Fi с общей пропускной способностью до 1,9 Гбит / с.
То, что вас интересует (а также много!), Но не очень практично с точки зрения информационных технологий и новых тем, что выполняемые операции могут быть для вас слишком сложными?
То, что вас интересует (а также много!), Но не очень практично с точки зрения информационных технологий и новых тем, что выполняемые операции могут быть для вас слишком сложными? Но не волнуйтесь, вам не о чем беспокоиться! Программы для удаленного доступа, которые я собираюсь показать вам, на самом деле очень просты в использовании (по крайней мере, в большинстве случаев), вам просто нужно иметь минимум внимания и терпения, и все готово, у вас есть слово. Приятного чтения! TeamViewer

Что нового в обновлении 2017 года?
Что нового в обновлении 2017 года?
Если вы выбираете новый аудиоинтерфейс или новый компьютер, каковы плюсы и минусы множества предлагаемых протоколов подключения?
Лучше купить аудиоинтерфейс, который подключается к моему компьютеру через USB, Firewire, Thunderbolt или PCIe?
Какой из них еще пригодится через пять или 10 лет?
И почему вокруг нет больше интерфейсов USB 3?
И как?
Что купить у родственников?
Не знаете, что такое подарок Санты?
Что купить у родственников?