5 exemplos de e-mails otimizados para celular

Publicados: 2016-11-03

Nós, profissionais de marketing, nos acostumamos com a ideia de que, ao otimizar nossos e-mails para usuários móveis, podemos dar às nossas campanhas uma vantagem sobre a concorrência. Infelizmente, os tempos mudaram e o fato é que agora devemos criar variantes de e-mail otimizadas para celular como uma coisa natural.

Há alguns anos, chegamos a um ponto crítico em que os smartphones ultrapassaram os computadores desktop como o tipo de dispositivo mais usado para ler e-mails. Mais recentemente, o Relatório de preferência de dispositivos da Movable (2015) descobriu que 52% dos e-mails agora estão sendo abertos em smartphones - com desktops respondendo por apenas 32%.

É muito fácil cair na armadilha de criar e-mails principalmente para usuários de desktop - provavelmente você está usando um desktop para colocá-los juntos. Agora é hora de livrar-se dessa mentalidade antiquada e colocar o dispositivo móvel em primeiro lugar, depois o desktop.

Neste artigo, discutiremos 5 exemplos inspiradores de e-mails otimizados para celular, todos cuidadosamente projetados para aumentar as conversões. Incluímos algumas dicas acionáveis, para que você possa replicar as ideias apresentadas em suas próprias campanhas.

HolidayPirates - primeiros princípios

férias espirituais

Decidimos começar com este e-mail por um motivo: ele foi inconfundivelmente projetado para celulares primeiro.

Este é o único ponto que insistimos veementemente que você leve em consideração e coloque no centro de sua estratégia de marketing por e-mail. Porque? Em primeiro lugar, porque o celular é o tipo de dispositivo mais usado para aberturas de e-mail, com uma participação majoritária que ainda cresce ano a ano; e em segundo lugar, porque é muito mais fácil usar um design otimizado para celular como base e, em seguida, construir elementos adicionais para dispositivos maiores do que fazer o oposto.

[mailchimpsf_form access = ”web” title = ”Para mais informações como esta, inscreva-se em nosso boletim informativo”]

A proporção de elementos visuais para copiar

Podemos dizer que este e-mail foi projetado primeiro para dispositivos móveis apenas observando quantas palavras existem na página - ou seja, não muitas.

Incluir muitas cópias em um e-mail normalmente terá um efeito negativo nas conversões móveis. No e-mail da HolidayPirates, a cópia é limitada a três linhas por item de conteúdo na versão móvel (a cópia mais o botão CTA são praticamente iguais em termos de uso de espaço à imagem que o acompanha); enquanto na versão desktop a mesma cópia pode ocupar pouco mais de uma linha, agindo mais ou menos como uma legenda para a imagem. Se este e-mail tivesse sido projetado primeiro para desktop, poderíamos ter visto uma cópia adicional em variantes de telas maiores e versões resumidas (ou pior, muitas cópias e rolagem horizontal) para dispositivos menores.

Muitos botões de CTA que chamam a atenção

Se você já leu sobre o assunto de otimização da taxa de conversão, sabe o quanto pode ser ganho posicionando botões de CTA estrategicamente em suas páginas da web.

CTAs, ou botões de call to action, são links do tipo imagem, usando um design de botão com um texto obrigatório (por exemplo, “Compre agora”, “Inscreva-se gratuitamente”, “Veja mais”). A HolidayPirates usou botões CTA aqui para vincular ao conteúdo de seu site.

Na captura de tela da versão móvel acima, você só pode ver um dos itens de conteúdo apresentados no e-mail do HolidayPirates. Isso se deve exclusivamente à quantidade de espaço que temos à disposição aqui neste artigo, e de fato, dez destinos estão incluídos no e-mail, cada um com sua imagem, cópia e botão CTA “Show Deal”.

Usar CTAs em seus e-mails é amplamente reconhecido como a melhor maneira de fazer com que os usuários de celular cliquem para onde você quiser. Aqui estão algumas dicas sobre como tornar seus CTAs supereficazes:

  • Faça-os grandes e relativamente brilhantes - se você já tentou acertar um alvo pequeno e obscuro com o polegar enquanto navega no telefone (ou em algum outro contexto estranho), você entenderá por que é importante destacar seus CTAs. Isso também tornará seus CTAs mais atraentes.
  • Coloque-os em branco - pelas mesmas razões.
  • Torne a cópia do CTA clara e concisa - diga em duas ou três palavras.
  • Link para conteúdo compatível com dispositivos móveis - não há por que canalizar usuários de dispositivos móveis para um site hostil aos dispositivos móveis.

O que aprendemos até agora

A partir deste único e-mail de marketing, verificamos três pontos-chave - vamos chamá-los de princípios básicos - no marketing por e-mail:

  1. Design para celular primeiro
  2. Vá com calma na cópia
  3. Use CTAs para links

Para nós, esses são os fatores mais importantes que você precisa considerar ao criar seus e-mails de marketing. Agora vamos dar uma olhada em mais quatro e-mails que atendem ao usuário móvel de maneiras interessantes e instigantes:

PayasUgym - incorporação na atividade móvel

Por que deixar de fazer seu e-mail compatível com smartphones, quando você poderia usá-lo como um meio de incorporar sua marca à atividade móvel do dia-a-dia do destinatário?

payasugym-app-banner-email

Aqui está uma seção de um e-mail de um serviço pré-pago de localização de aulas de ginástica e fitness que faz exatamente isso e com grande efeito.

  • “Encontre o próximo” - o subtítulo apresenta o problema do destinatário, abrindo caminho para a marca apresentar sua solução.
  • Gráficos de estilo marcador de mapa - observe os gráficos no topo da captura de tela, mostrando o número de academias, classes e piscinas. Usar gráficos de estilo marcador de mapa aqui é inteligente, pois evoca os ícones usados ​​em aplicativos extremamente populares como Google Maps e Uber, o que leva a ...
  • Banner do aplicativo - este banner do CTA oferece suporte ao Get the app! mensagem com botões informativos e que aumentam a confiança da App Store da Apple e do Google Play. O banner é grande, atraente e cercado por espaços em branco.

Este e-mail é um exemplo modelo de como posicionar sua marca como o provedor de soluções compatíveis com dispositivos móveis para o problema de um consumidor. A estrutura da sua mensagem é irresistível: “Nós entendemos o que você precisa; estamos muito bem posicionados para dar a você; clique neste link de download claro, simples e confiável e resolveremos o problema para você agora e sempre que precisar no futuro. ” A marca se colocou de maneira muito eficaz para cumprir uma determinada função na atividade móvel do usuário.

Quer sua marca cumpra sua função online por meio de um aplicativo ou de um site otimizado para celular, você pode replicar a abordagem da PayasUgym em seus e-mails de marketing. Tente incluir um CTA em uma estrutura semelhante:

  1. Use um subtítulo para apresentar o problema, por exemplo, “Quer encontrar um novo estilo?”, “Precisa de um novo livro?”
  2. Estabeleça sua autoridade / alcance / qualidade / proposição de valor. Incorpore sutilmente elementos gráficos que imitam elementos de aplicativos ou de comércio eletrônico (como os marcadores de mapa do PayasUgym).
  3. Adicione um banner de CTA, usando as técnicas discutidas anteriormente. Isso pode ser um link para o download de um aplicativo ou outro aspecto digital do seu negócio que pode cumprir uma função útil para o cliente.

American Apparel - preparando-se para a vida na pasta Junk

Todo comerciante de email certamente adora imaginar suas mensagens navegando nas caixas de entrada dos destinatários e direto para o topo da lista - mas o fato é que muitos dos clientes de email dos seus destinatários tratarão suas mensagens como não confiáveis ​​ou lixo eletrônico.

Os destinatários ainda poderão ver essas mensagens, mas, em alguns casos, o conteúdo - especialmente imagens e outras mídias avançadas - não será mostrado. Tendo em mente a alta proporção de imagens para cópia usada na maioria do marketing por e-mail compatível com dispositivos móveis, isso pode significar que o destinatário perderá os principais ganchos em seu e-mail ao folhear a pasta de lixo eletrônico.

roupa americana

Não existe uma solução completamente satisfatória para este problema, mas você pode afetar alguma limitação de danos usando um atributo das imagens usadas em seus e-mails: suas alt tags.

Dê uma olhada nas duas imagens acima. Ambos mostram o mesmo e-mail, de varejistas de moda American Apparel. A versão da esquerda tem imagens ativadas, enquanto a imagem da direita mostra como fica o mesmo e-mail com imagens desativadas. A imagem à direita pode não parecer tão boa, mas consegue transmitir o propósito essencial do e-mail - “Sentimos sua falta. Ganhe 20% de desconto! ” Essas palavras não vêm de uma seção do texto embrulhada em tags <p>; eles vêm dos atributos alt tag das imagens que foram ocultadas.

Ao repetir os ganchos de marketing do e-mail nos atributos alt tag de suas imagens, você pode aumentar a chance de o destinatário receber sua mensagem principal em formato de texto, mesmo se as imagens estiverem desativadas.

Como regra geral, sempre recomendamos reservar um tempo para escrever uma alt tag eficaz para qualquer imagem que você planeja publicar online. As alt tags não apenas ajudam a fazer com que suas mensagens de marketing por e-mail cheguem a mais destinatários, mas também são fundamentais para a experiência de pessoas com deficiência visual na Internet e podem ajudar suas imagens a ter uma boa classificação nos resultados de pesquisa de imagens.

The Trainline - fornecendo um caminho rápido para avaliações

the-trainline-rating-stars

O feedback do cliente é um recurso precioso para os profissionais de marketing que desejam identificar o melhor caminho a seguir para suas campanhas de e-mail. É especialmente eficaz quando usado em um contexto de teste de divisão, como esperamos que fosse o caso com a seção de classificação por estrelas mostrada acima, encontrada em um e-mail de TheTrainline.com.

Não há nada sofisticado nesta seção de avaliações - e é exatamente por isso que gostamos dela. O usuário toca em uma das estrelas para avaliar o e-mail em cinco. A simplicidade do design fará com que deixar uma revisão pareça muito mais gerenciável para os usuários móveis, que podem ser desencorajados por tarefas complicadas, como escrever comentários.

Mas e quanto à falta de feedback detalhado? Bem, sugerimos que duas ou mais variantes deste e-mail provavelmente foram enviadas para públicos diferentes, e as classificações genéricas fornecidas pelos destinatários foram usadas pelos criadores do e-mail para determinar qual das variantes foi mais eficaz.

O teste multivariável pode ser usado para determinar qual tipo de linha de assunto funciona melhor, quais negócios ou produtos um e-mail deve promover, como diferentes tipos de conteúdo podem afetar a experiência do usuário e assim por diante. As informações coletadas podem ser usadas por conta própria ou para fazer backup de descobertas feitas por meio da análise de abertura de e-mail e dados de engajamento.

NatWest

natwest
A chave para o impacto deste e-mail - de uma perspectiva de design - é o atraente mealheiro GIF no topo. Crucialmente, parece bom e nítido se visualizado em um celular, tablet ou desktop.

Os desenvolvedores do e-mail conseguiram isso configurando um algoritmo de interpolação bicúbica para dimensionar a imagem - o que foi conseguido configurando parte do atributo de estilo da imagem para “-ms-interpolation-mode: bicubic”. Isso torna a imagem 'fluida'.

Existem várias maneiras de obter esse efeito, a maioria das quais soa menos técnica do que as anteriores. Faça com que seus desenvolvedores verifiquem se seu modelo de e-mail inclui interpolação bicúbica ou outro mecanismo para dimensionamento de imagem antes de começar a enviar e-mails. Simplesmente tornar suas imagens grandes o suficiente para parecerem nítidas em todos os dispositivos é problemático, pois pode exigir a rolagem horizontal para usuários móveis - exatamente o tipo de coisa que pretendemos evitar.


obtenha sua assinatura gratuita agora - absolutamente nenhum cartão de crédito necessário

  • O kit de ferramentas de marketing digital
  • Sessões exclusivas de aprendizagem por vídeo ao vivo
  • Biblioteca completa do Podcast de Marketing Digital
  • As ferramentas de benchmarking de habilidades digitais
  • Cursos de treinamento online grátis

ASSOCIAÇÃO GRATUITA
infográfico