Com o iOS Mail sendo responsável por cerca de um terço de todos os e-mails abertos no primeiro semestre de 2017 , as atualizações na família do iPhone e as mudanças no sistema operacional móvel e seu cliente de e-mail podem ter um grande impacto no mundo do e-mail. Agora, após o grande evento da Apple em 12 de setembro, sabemos que não é um, mas três novos iPhones - iPhone 8, 8 Plus e iPhone X - que chegarão às mãos dos consumidores em breve, junto com o novo sistema operacional móvel iOS 11.

Mas o que isso significa para os profissionais de marketing por e-mail?

Embora o iOS 11 não seja lançado ao público antes de 19 de setembro, a versão golden master (GM) do iOS 11 - essa é a versão do sistema operacional que será lançada ao público em alguns dias - foi disponibilizada aos desenvolvedores em setembro 12º. Analisamos de perto a versão mais recente do iOS e a prévia da Apple de seus novos telefones para analisar os detalhes que todo comerciante de email deve saber.

Como é o seu e-mail no iOS 11? Veja como o iOS 11 renderiza seu e-mail com as visualizações de e-mail Litmus para iPhone X, iPhone 8, iPhone 8 Plus e mais clientes e dispositivos de e-mail populares. Saiba mais sobre as visualizações de e-mail →

iOS Mail ainda suporta vídeo HTML5

O vaivém da Apple no suporte de vídeo HTML5 para seu cliente de e-mail móvel tem causado confusão entre os profissionais de marketing por e-mail há anos. A Apple suportou vídeo HTML5 no iOS 7, então removeu o suporte a vídeo com o lançamento do iOS 8 em 2014, apenas para reintroduzi-lo com o lançamento do iOS 10 em 2016.

Então, no início deste verão, a comunidade de e-mail percebeu que a Apple pode ter mudado, com uma versão inicial do iOS 11 beta não mostrando suporte para vídeo HTML5 - novamente.

Então, qual é o problema do vídeo HTML5 na versão final do iOS 11? Os profissionais de marketing que amam a interatividade e a liberdade criativa que o vídeo HTML5 adiciona às campanhas de e-mail podem respirar aliviados: o vídeo ainda é compatível com o iOS 11 , com suporte para iPhone e iPad.

No entanto, observe que o atributo pôster (pôster = ””) é necessário para exibir uma imagem de visualização do seu vídeo no e-mail. Anteriormente, sem uma imagem de pôster definida, o primeiro quadro do vídeo seria mostrado. No iOS 11, no entanto, o vídeo aparece em branco.

Tamanhos e resoluções de tela para iPhone 8 e 8 Plus

Não há mudanças no tamanho da tela com o iPhone 8. Tanto o iPhone 8 quanto o iPhone 8 Plus têm exatamente os mesmos tamanhos e resoluções de tela que seus predecessores (iPhone 7 e 7 Plus).

Com isso, todas as consultas de mídia que existiam para a família iPhone 7 funcionarão da mesma forma para os novos telefones iPhone 8.

iPhone 8 (visualização com zoom):

 @media screen and (max-device-width: 320px) and (max-device-height: 568px) { /* Insert styles here */ }

iPhone 8 (visualização padrão) e iPhone 8 Plus (visualização com zoom):

 @media screen and (max-device-width: 375px) and (max-device-height: 667px) { /* Insert styles here */ }

iPhone 8 Plus (visualização padrão):

 @media screen and (max-device-width: 414px) and (max-device-height: 776px) { /* Insert styles here */ }

Tamanhos e resoluções de tela para iPhone X

Com o iPhone X, a Apple introduz um novo tamanho de tela à mistura.

Com 5,8 polegadas de diagonal, a tela do iPhone X é mais alta do que a do iPhone 8 Plus. O que é importante, porém, é que a largura da tela do iPhone X corresponde à largura das telas de 4,7 polegadas do iPhone 8. O aumento no tamanho da tela vem do fato de que a tela é 145pt mais alta do que uma tela de 4,7 polegadas.

Embora mais tamanhos de tela frequentemente signifiquem mais problemas - e mais casos para otimizar - o fato de que a largura da tela permanece a mesma é uma ótima notícia para designers de e-mail: nenhuma mudança na largura significa que as consultas de mídia existentes funcionarão para o iPhone X também.

Consulta de mídia do iPhone X:

 @media screen and (max-device-width: 375px) and (max-device-height: 812px) { /* Insert styles here */ }

Ao mesmo tempo, o iPhone X oferece cerca de 20% de espaço vertical adicional para conteúdo - ou seja, mais emails em exibição na caixa de entrada e mais conteúdo visível quando o email é aberto.

Correção de problemas de dimensionamento no iOS 11

Os problemas de escalonamento automático no aplicativo de e-mail móvel da Apple surgiram pela primeira vez com o lançamento do iOS 10 em setembro de 2016 . Com o iOS 11, continuamos vendo esse bug. Conforme a comunidade relatou em várias discussões da comunidade (veja aqui e aqui ), os e-mails não ocupam toda a largura da tela, mas aparecem com o zoom reduzido e fora do centro.

Você pode evitar que o iOS 11 dimensione automaticamente seu e-mail adicionando o seguinte código ao cabeçalho de seus e-mails:

 <meta name="x-apple-disable-message-reformatting">

Um grande obrigado a Remi Parmentier por compartilhar essa correção com a comunidade .

Otimize para alta densidade de pixels

O iPhone X vem com o que a Apple chama de Tela Super Retina . Com 2436 x 1125 pixels - ou 458 pixels por polegada - essa é a maior densidade de pixels já vista em uma tela de iPhone.

E com isso, otimizar as imagens do seu e-mail para telas de alto DPI é mais importante do que nunca. Se você não considera monitores de alta resolução, corre o risco de parecer descuidado com os assinantes. Por causa da maneira como as telas de alto DPI funcionam, as imagens não otimizadas acabam parecendo borradas e pixeladas nas telas de retina. Aqui está um exemplo:

Você pode garantir que suas imagens apareçam nítidas e claras, multiplicando o número de pixels em cada imagem por um fator de escala específico. Em outras palavras, crie suas imagens em formatos maiores para que, quando forem reduzidas no e-mail, haja mais pixels para as telas de retina exibirem. Para o iPhone X e todas as versões Plus da família iPhone, a Apple recomenda um fator de escala ou 3x; para todos os outros monitores é 2x .

À medida que aumentamos as dimensões de uma imagem, no entanto, o tamanho do arquivo também aumenta. Esse tamanho aumentado afeta o plano de dados do assinante e pode fazer com que um e-mail carregue lentamente. Ambos os problemas são um grande problema e criam uma experiência do usuário nada amigável. As ferramentas de otimização de imagem podem ajudar a compactar suas imagens para reduzir o tamanho do arquivo e, ao mesmo tempo, garantir que seus e-mails tenham uma ótima aparência em telas de alto DPI.

Segmentação iOS 11

No ano passado, Remi Parmentier descobriu que é possível usar declarações @supports em CSS para direcionar especificamente o iOS 10.

Podemos direcionar o iOS com a propriedade proprietária “-webkit-overflow-scrolling” que só é compatível com iOS. Se usarmos isso em combinação com uma das propriedades suportadas exclusivamente nas versões mais recentes do webkit do iOS - #RGBA notações de cores, por exemplo - podemos direcionar especificamente o iOS 10 e superior.

Aqui está uma consulta de mídia que terá como alvo o iOS 10:

 @supports (-webkit-overflow-scrolling:touch) and (color:#ffff) { /* Insert CSS here */ }

Se você deseja direcionar especificamente o iOS Mail na versão mais recente do sistema operacional da Apple - iOS 11.0, 11.1 ou 11.2 - as declarações de suporte combinadas com propriedades de preenchimento resolverão o problema:

Destino iOS 11.0 e 11.1

 @supports (padding-left:constant(safe-area-inset-left)) { /* Insert CSS here */ }

Destino iOS 11.2

 @supports (padding-left:env(safe-area-inset-left)) { /* Insert CSS here */ }

Você identificou alguma outra atualização que perdemos? Deixe-nos saber nos comentários abaixo.

Como é o seu e-mail no iOS 11? Veja como o iOS 11 renderiza seu e-mail com as visualizações de e-mail Litmus para iPhone 8, iPhone 8 Plus, iPhone 7, iPhone 7 Plus. Saiba mais sobre as visualizações de e-mail →