Botones de email: cómo poner un botón en tu correo para tus campañas

¿Qué es un botón de correo electrónico?

Un botón de correo electrónico es un botón CTA que se incorpora a tu correo electrónico para indicar a los usuarios qué hacer a continuación. Cuando alguien abre tu correo electrónico, se le presentan varios contenidos. Sin embargo, el objetivo principal de tu campaña de marketing por correo electrónico es llevar a los clientes a tu sitio web para que realicen alguna acción en particular. Por ejemplo, una empresa de e-commerce puede promocionar un determinado producto para aumentar las ventas a través de una campaña de correo electrónico dirigida.

Existen varias formas de crear un botón de correo electrónico, incluyendo las que tienen imágenes de fondo y diferentes tamaños y pesos de tipografía. Uno de los tipos más populares de botones de correo electrónico es el botón a prueba de balas.

A diferencia de los botones construidos con imágenes, estos están diseñados con código HTML y CSS, lo cual permite que el botón se muestre en varios clientes de correo electrónico. La ventaja más importante de los botones a prueba de balas es que aparecen en los correos electrónicos incluso cuando las imágenes están desactivadas. Los botones a prueba de balas son fundamentales para la creación de correos electrónicos también de este tipo que pueden aumentar los clics y la interacción en tus campañas de marketing por correo electrónico.

Aunque estos botones están codificados, puedes editar la plantilla HTML para actualizar el tamaño de la tipografía o el peso, la imagen de fondo y los colores para crear botones de correo electrónico HTML a prueba de balas realmente únicos.

Además de mostrarse en todos los clientes incluso cuando las imágenes están desactivadas, los botones HTML se cargan más rápido, haciendo tu correo electrónico más eficaz porque los usuarios verán tu CTA y sabrán qué hacer a continuación. Pero, por supuesto, los botones de correo electrónico HTML son menos únicos que los botones basados en imágenes porque no puedes diseñar el botón con herramientas como Photoshop o Canva.

Ventajas de utilizar botones de correo electrónico en tus campañas

Tanto si utilizas botones de correo electrónico basados en imágenes como HTML a prueba de balas, la ventaja más importante es aumentar tu ROI y CTR. Los botones de correo electrónico animan a los suscriptores a actuar, lo que te permite resaltar tu CTA para atraer más atención.

Los usuarios no harán nada si tu correo electrónico no tiene una CTA sólida. La alternativa a un botón de correo electrónico es el texto con hipervínculo, lo cual puede confundir a los suscriptores porque el texto puede no decirles qué cabe esperar.

Los botones de correo electrónico son increíblemente visuales. Cuando alguien abre tu correo electrónico, es probable que sea una de las primeras cosas que le llamen la atención, animándolo a realizar una acción, efectuar una compra, visitar tu sitio web o recibir una oferta. Un botón cuidadosamente diseñado puede aumentar la probabilidad de que los clientes realicen acciones en tus correos electrónicos, lo cual los hace más eficaces en general.

Por desgracia, si tus CTA tienen imágenes de fondo o son imágenes directamente, es posible que muchos usuarios nunca las vean porque su cliente de correo electrónico tiene las imágenes desactivadas. Por lo tanto, los botones de correo electrónico son fundamentales para el éxito de tus campañas y el aumento de los clics.

Piensa en cómo lee los correos electrónicos la mayoría de la gente. Al igual que a la hora de leer blogs, la mayoría de la gente busca información pertinente en lugar de leer cada palabra y mirar cada imagen. Tu botón de correo electrónico destaca del resto del contenido por varias razones, incluidos el tamaño de la tipografía y el peso.

Los botones suelen ser más grandes, con fuentes más en negrita para captar la atención del usuario. Además, contienen elementos de diseño que los hacen destacar entre el texto y las imágenes. Como resultado, las CTA de los botones de correo electrónico son mucho más eficaces a la hora de atraer la atención de los usuarios, haciendo que les sea más fácil entender lo que quieres que hagan.

Cómo añadir un botón de correo electrónico en HTML y CSS

Hay varias maneras de agregar un botón de correo electrónico en HTML y CSS, y, para asegurarte de que tus botones de correo electrónico sean a prueba de balas, no tienes que ser desarrollador de sitio web o programador experto para hacerlo. Recuerda que las dos formas más populares de añadir botones de correo electrónico son el uso de imágenes con enlaces o HTML.

Mailchimp te facilita el diseño del botón de correo electrónico, incluido el cambio de tipografía con bloques de contenido, lo cual te permite arrastrar y soltar botones con facilidad.

Botones de correo electrónico HTML

Los botones de correo electrónico HTML pueden ser de ancho completo o fijo, dependiendo del aspecto que deseas que tenga el botón con respecto al resto del diseño del correo electrónico.

Para crear botones de correo electrónico HTML, necesitarás codificar tu plantilla de correo electrónico de forma personalizada utilizando el siguiente código:

'''< table border="0" cellpadding="0" cellspacing="0" width="100%" style="background-color:#505050; border:1px solid #353535; border-radius:5px;">

<td align="center" valign="middle" style="color:#FFFFFF; font-family:Helvetica, Arial, sans-serif; font-size:16px; font-weight:bold; letter-spacing:-.5px; line-height:150%; padding-top:15px; padding-right:30px; padding-bottom:15px; padding-left:30px;">
  <a href="http://www.mailchimp.com/blog/" target="_blank" style="color:#FFFFFF; text-decoration:none;">Más información</a>
</td>

Como puedes ver, en este caso, tu botón diría: "Leer más". También puedes cambiar la tipografía para que coincida con la tipografía de tu marca y sitio web como mejor te convenga. Por supuesto, la mejor tipografía para el correo electrónico dependerá de tu marca y diseño general, pero te recomendamos que sea sencilla.

Botones de correo electrónico adaptables

Los botones de correo electrónico adaptables se adaptarán al ancho del correo electrónico, dependiendo del texto existente dentro de la misma celda. Estos botones no tienen un ancho especificado en el código porque tendrán el mismo ancho que el texto. El código para los botones de correo electrónico adaptables es el siguiente:

'''

<td align="center" valign="middle" style="color:#FFFFFF; font-family:Helvetica, Arial, sans-serif; font-size:16px; font-weight:bold; letter-spacing:-.5px; line-height:150%; padding-top:15px; padding-right:30px; padding-bottom:15px; padding-left:30px;">
  <a href="http://www.mailchimp.com/blog/" target="_blank" style="color:#FFFFFF; text-decoration:none;">Lee más historias en nuestro blog</a>
</td>

'''

Por suerte, para crear los botones de correo electrónico perfectos para tus campañas de marketing por correo electrónico, no tienes que saber programar. En su lugar, puedes arrastrar y soltar un bloque de contenido en una plantilla existente y editar el HTML como mejor te convenga.

Qué hacer y qué no hacer con los botones de correo electrónico

Para que tus botones de correo electrónico sean eficaces, debes asegurarte de que se vean bien y funcionen correctamente. Aquí tienes algunos consejos para empezar:

No utilices imágenes

Como ya hemos mencionado, no todas las imágenes se muestran en todos los clientes de correo electrónico. Por lo tanto, es posible que muchos de tus suscriptores no vean tus botones de correo electrónico de CTA si tienen las imágenes desactivadas.

Si bien el uso de imágenes como botones puede hacer que tus botones tengan un aspecto único y destaquen, es más importante que aparezcan para todos tus suscriptores si quieres que realicen una determinada acción.

Elige los tipos de letra adecuados

Al igual que las imágenes, no todas las fuentes se muestran correctamente en todos los clientes de correo electrónico. Por lo tanto, debes elegir fuentes reconocidas universalmente. Puedes utilizar un generador de tipografía para ayudarte a encontrar la tipografía adecuada para tus campañas de marketing por correo electrónico y así asegurarte de que destaquen y se puedan mostrar correctamente.

Además, debes considerar el tamaño de la tipografía y el peso, lo cual afectará a la capacidad de tu botón para destacar del resto del contenido del correo electrónico.

Considera el destino

Cuando utilizas botones de correo electrónico, tienes un objetivo particular en mente, un enlace. Por ejemplo, las empresas de e-commerce que promocionen un producto para aumentar las ventas probablemente tengan un botón de correo electrónico que diga "Comprar ahora" después de resaltar el producto en el resto del contenido. Si tu botón no conduce a la página del producto, los suscriptores se confundirán y abandonarán el sitio web. Por lo tanto, siempre debes asegurarte de establecer las expectativas correctas sobre dónde terminarán los clientes tras hacer clic en tu botón.

Escribe un CTA sólido

Los elementos de diseño de tu botón de correo electrónico son primordiales para ayudar a que este destaque, pero la CTA es esencial para establecer expectativas y animar a los suscriptores a actuar.

Para decirles a los clientes qué hacer, tu CTA debe contener solo unas pocas palabras. Algo tan sencillo como "Comprar ahora" o "Explorar la colección" puede comunicar eficazmente a los clientes qué pueden esperar al hacer clic en el botón.

Aprovecha el poder de un CTA sólido

Una CTA de marketing por correo electrónico sólida es algo más que las palabras que utilizas para atraer a los usuarios a actuar; la simple incorporación de un botón puede atraer su atención a tu CTA para establecer expectativas y ayudarlos a comprender los siguientes pasos.

Los botones son la mejor manera de mostrar a los suscriptores qué hacer a continuación porque destacan del resto del contenido del correo electrónico. Mailchimp facilita el diseño de botones de correo electrónico que fomentan los clics y las ventas. Con el diseño adecuado, puedes mejorar la eficacia de tus campañas.