Template de mail de feedback.
Hoy les dejamos esta plantilla de mail minimalista para responder en a sus consultas de mails de tu CMS o autoresponder.
La plantilla esta probada y funciona consistentemente en los clientes de correo Outlook 2010, 2013, 2016, Thunderbird y Mail de OS X. También está probado en los webmails de outlook.com y gmail.com
El pen esta codificado en Pug (antiguamente Jade) por si quieren implementar la plantilla dentro de un CMS que soporte este HTML preprocesador.
Para un uso más general dejamos el código en HTML a continuación.
<!DOCTYPE html PUBLIC ""-//W3C//DTD XHTML 1.0 Transitional//EN"" ""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"">
<head></head>
<body style=""background-color:#EEEEEE;"">
<div style=""max-width:550px; min-width:320px; background-color: white; border: 1px solid #DDDDDD; margin-right: auto; margin-left: auto;"">
<div style=""margin:30px"">
<p> </p>
<p style=""margin-top:15px;""><a href=""https://logico.com.ar"" style=""text-decoration:none;font-family:Verdana, Geneva, sans-serif;font-weight: bold; color: #3D3D3D;font-size: 15px"">yourwebsite.com</a></p>
<hr style=""margin-top:10px;margin-bottom:65px;border:none;border-bottom:1px solid red"">
<h1 style=""font-family: Tahoma, Geneva, sans-serif; font-weight: normal; color: #2A2A2A; text-align: center; margin-bottom: 65px;font-size: 20px; letter-spacing: 6px;font-weight: normal; border: 2px solid black; padding: 15px;"">THANKS FOR YOUR FEEDBACK!</h1>
<h3 style=""font-family:Palatino Linotype, Book Antiqua, Palatino, serif;font-style:italic;font-weight:500"">Your opinion is <span style=""border-bottom: 1px solid red"">very important</span> to us:</h3>
<p style=""font-family:Palatino Linotype, Book Antiqua, Palatino, serif;font-size: 15px; margin-left: auto; margin-right: auto; text-align: justify;color: #666;line-height:1.5;margin-bottom:75px"">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vel metus eu urna lobortis condimentum vel aenim. Pellentesque malesuada sapien id pellentesque suscipit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean porta tincidunt malesuada. Curabitur ac consectetur tellus. Etiam aliquet ante sed nibh lobortis maximus. In at egestas justo.</p>
<table style=""width:100%;"">
<th>
<td style=""width:25%""></td>
<td style=""background-color:black;with:50%;text-align:center;padding:15px;font-family:'Courier New', Courier, monospace;""><a href=""http://logico.com.ar/"" style=""margin-left: auto; margin-right: auto;text-decoration:none;color: white;text-align:center;font-family:'Courier New', Courier, monospace;font-weight:600;letter-spacing:2px;background-color:black;padding:15px;"">CALL TO ACTION</a></td>
<td style=""width:25%""></td>
</th>
</table>
<hr style=""margin-top:10px;margin-top: 75px;"">
<p style=""text-align:center;margin-bottom:15px""><small style=""text-align:center;font-family:'Courier New', Courier, monospace;font-size:10px;color#666;"">CC BY-SA 4.0 <a href=""http://logico.com.ar/"" style=""color:#666"">Lógico Software</a> | Made with <span style=""color:red"">♥</span> in Argentina</small></p>
<p> </p>
</div>
</div>
</body>
</html>
El código del template se distribuye con una Licencia Creative Commons Atribución-CompartirIgual 4.0 Internacional, así que pueden hacer lo que quieran mientras den crédito y si hacen cambios lo distribuyan con la misma licencia.