Call to action en nuestro Email de bienvenida
Clase 17 de 32 • Curso de Diseño HTML y CSS para Emails 2016
Contenido del curso
Bienvenido al curso
Buenas Prácticas en el Diseño de Email
- 4

Configurando el Entorno de Trabajo para Email
08:58 min - 5

Bases de desarrollo para Email
12:33 min - 6

Buenas prácticas en plantilla de estilos para email
10:14 min - 7

Imágenes de“fondo” y VML para Outlook
11:36 min - 8

Imágenes de Alta resolución para Email
05:23 min - 9

¿Cómo organizar tu CSS para email ?
15:35 min - 10

Técnica de Stacking
12:13 min - 11

Técnica de Spacers
04:41 min - 12
Repaso de buenas prácticas para Email
01:33 min
Creando nuestro proyecto
- 13

Introducción al proyecto
07:03 min - 14

Exportando nuestras imágenes desde Photoshop
23:32 min - 15

Header de Email de Bienvenida
18:51 min - 16

Responsive en Email de Bienvenida
18:23 min - 17

Call to action en nuestro Email de bienvenida
Viendo ahora - 18

Terminando el Header del Email
12:16 min - 19

Construyendo el Hero de nuestro Email de bienvenida
06:48 min - 20

Agregando elemento de 3 columnas en el email
12:08 min - 21

Creando un Footer para nuestro Email
08:31 min - 22

Creando un Mail Transaccional
13:35 min - 23

Creando un email de promoción
19:55 min
Mailchimp y Testing con Litmus
Conclusiones
Complementos del curso
Desafíos
Resumen
Call to Action ( CTA )
El llamado a la acción o CTA es un botón o enlace que deseamos que nuestro usuario tenga una interacción. Para el caso de nuestro botón se ve de la siguiente manera:
Es importante volver a recordar que la mayoría de clientes de Email no soporta las propiedades más recientes de HTML5 y CCS3, entonces los bordes redondeados los solucionamos haciendo 4 imágenes:
<table border="0" align="center" cellpadding="0" cellspacing="0" class="mbtn20 mtop10" cellmargin="0"> <tr> <td> <table width="200" border="0" cellpadding="0" cellspacing="0" cellmargin="0"> <tr> <td width="10"><img src="images/PROJEKTO-cta-green-top-left.png" width="10" style="display:block"></td> <td width="180" bgcolor="#91c338" class="w360"></td> <td width="10"><img src="images/PROJEKTO-cta-green-top-right.png" width="10" style="display:block"></td> </tr> </table>