Diseñar mails para outlook en html
9 seguidores
Buenas
estoy haciendo una página web para ser enviada por mail. no es nada más típico que aquellos mails que recibes y es como una página web, pero el problema está en cómo se hace. yo trabajo en mac y uso el outlook express (lo sé lo sé) pero si hace falta, instalaré otro.
alguien ha hecho esto antes? hay algun sitio donde explique un poco estas cosas? yo lo habia hecho con pc, pero sólo habia conseguido crear plantillas. en mac no tengo ni idea de como va o que pasos debo seguir
otra es: se puede insertar flash?
gracias
jescortes
Si que se puede. Tienes que diseñar el mail desde tu editor (como el dreamweaver), cuidando de poner todas las rutas apuntando al servidor.
Luego para enviarlo, yo utilizo un programa que descargue de softonic que te permite elegir el archivo html a enviar.
Se puede insertar flash, pero como las imagenes se tiene que poner la ruta absoluta del tipo http://www.mistio.com/animaciones/mianimacion.swf
Espero que esto te sirva de pista para aclarate,
Ciao!
homi
ey pues yo tengo la misma pregunta, tengo que diseñar 2 e-mails genericos para una empresa, la idea seria que fuera automatico de alguna manera, determinando campos etc...
para enviar una web simplemente la diseñas y desde el explorer pones
enviar> enviar por correo electrónico
y nada ha de ser un html. y si que se puede insertar flash aunque quizas no lo puedan ver todos a los que le llega.
Mi propuesta es un poco mas complicada, yo quiero que los de la empresa solo tengan que escribir en un área de texto determinada para el mensaje. Alguien sabe como hacerlo?
gntpwr
y qué programa es el que te bajaste de softonic?
zenks
jescortes
Ahora estoy fuera de casa, cuando llegue a mi pc te digo el nombre.
Ciao!
CarlosJ
Editar mails en html es bastante sencillo, tienes que crear un html perfectamente normal, sólo hay que tener unos pequeños detalles en cuenta:
<ul>- No se deben incluir enlaces a CSS
- No es nada recomendable el uso de capas
- No incluir javascript</ul>
Lo mejor es utilizar tablas y nada más e incluir las especificaciones de css en las propias etiquetas (inline), es decir
<code><font style="font-family:Arial;color:#000000;">Tal cual</font></code>
kokito
¿Y que haces con las imagenes? Como las enlazas.
kkt.
joshuatree
A las imagenes las enlazas subiendolas primero a tu host y referenciandolas desde alli:
Ej: http://www.misitio.com/mi_mail_html/imagenes/mi_imagen.jpg
Y asi con todas las demas ;)
microbians Staff
Tenéis dos opciones o lo hacéis enlazando imagenes a un server o si enviáis el email con outlook lo podéis hacer de la siguiente forma
Crear un html con el layout que queráis, si ponéis imagenes, el html y las imagenes deben estar en la misma carpeta y la ruta debe ser absoluta ha la imagen es decir
<code><img src="c:\windows\miemail\milayout.html" width="200" heoght"200"></code>
(poner el tamaño a todas las imagenes) tener en cuenta estos detalles al hacer el layout, poder vuestra firma si va ser fija, dejar espacio donde escribir, se pueden usar tablas o divs. Mejor no usar CSS, pero si lo hacéis hay un truco que es meter el
<code><style>!-- ....lo que sea ...</code>
meterlo dentro del body y no en el head.. ¿porque? bueno ahora vá... pues despues de hacer la página váis al outlook y añadís el layout al outlook como "firma"
Esto tiene su ventaja y es que puedes tener tantos layouts para esciribir como quiras. Entonces abres un mensaje nuevo y le das a insartar firma (la que hayas añadido)
Luego escribes tu mensaje en el espacio que hayas diseñado para ello con el editor visual de outlook.
la diferencia principal es que así puedes usar varios layouts y las imágenes se envian junto con el mismo email. El problema es que pesan mas los emails (ser minimalistas con el layout, sin imagenes mejor) y lo del css en el body es porque el html insertado como "firma" el outlook le quita el head.
No se si me he explicado bien, si no ir posteado las dudas.
jescortes
Que bueno microbians, no lo sabia!
Gracias por el truquillo :)
homi
bueno pues lo esotoy provando y ya le he pillao er rollete, la putada es que el outlook me deja sus propios margenes...
y claro por ejemplo he descubierto que cuando pongo un texto en el diseño html puedo usarlo con las mismas caracteristicas para escribir el e-mail, pero claro el outlook me deja unos margenes que me joden todo el diseño... como como...
sabeis como lo puedo hacer para quitarlos?
mushaaaaas Gracias!!
CarlosJ
creo que son los mismos márgenes que te deja explorer...
prueba a poner:
<code>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
</code>
También puedes poner por css, pero a lo mejor algún otro cliente de correo no lo reconoce correctamente:
<code>
<style>
body {margin:0px;}
</style></code>
homi
si eso si que lo he hecho
el problema reside que al insertarlo como firma en el outlook
el mismo outlok me deja un espacio arriva abajo al centro y pa dentro :-P
y no se como quitarlo, pero bueno aver que puedo hacer.
muchas gracias igualmente carlos.
microbians Staff
Eso es
<code><STYLE><!--
body { margin: 0px; }
--></STYLE>
</code>
pero añadelo dentro del body no fuera, sino el outlook se lo papea.
CarlosJ
cierto gabriel, se me olvidó ponerlo.
Boris
Hola Gabriel:
Hace una semana posteé un topic relativo a este tema. El problema que tengo es el siguiente:
A pesar de que yo utilizo otro sistema para adjuntar el archivo *.htm que genero para conformar el diseño del mail (lo guardo en stationey y lo importo a outlook desde herramientas > redactar > diseño de fondo) he probado tu sistema y sigo teniendo el mismo problema.
En hotmail, aunque se supone que los graficos van "incrustados" en el mail, estos se muestran como archivos adjuntos. Lo he probado también siguiendo tu consejo... y me surge el mismo problema.
El caso es que el cliente que me ha pedido las plantillas de mail me exige que no se muestren los archivos adjuntos en hotmail... y adjuntando el diseño como firma también ocurre ¿Cómo lo ves?
Un abrazo
microbians Staff
En outlook, "aplicar diseño de fondo" suele funcionar muy mal y no se envian las imagenes con el archivo de email, excepto el fondo, al menos eso pasa hace 2 años, quizás ahora funcione mejor.
Creo que no hay mucha posibilidad para eso de los archivos adjuntos en hotmail, si es asi en ese caso lo mejor sería que las enlazaras a urls externas, ya que creo que hotmail lo hace asi por el analisis del antivirus, unque tampoco te lo aseguraría.
Boris
Gracias muchas Gabriel...
En efecto, la única posibilidad de que en hotmail se muestren correctamente las imgs es haciendo enlaces absolutos al servidor.
Bueno, creo que no me queda otra que intentar convencer a mi cliente que no es posible cubrir todas las posibilidades, por ejemplo en el web mail de yahoo se muestra correctamente, pero hotmail hace perrerías... lo he intentado por casi todos lo medios, pero me resulta imposible adapatar el desarrollo de la plantilla a las posibilidades de cada servicio web mail.
Por cierto, en efecto, "aplicar diseño de fondo" ha mejorado bastante respecto a anteriores versiones de outlook, pero aun así no es del todo efectivo.
Muchas gracias de todas formas.
homi
la historia es la siguiente
en hotmail a mi insertandolo como firma no m aparecen la imagenes , o sea me aparece la tabla que he usado para delimitar una franja roja, pero no la imagen alineada a la derecha con el logo etc..
el tema tambien es que lo de la etiqueta para los margenes no me funciona, siempre outlook sigue mostrando un margen a la derecha de unos 10 centimetros que no logro quitar.
y no entiendo por que
joer tendria que estar mas investigado el tema, es algo esencial para las empresas.
bueno y a parte no entiendo como los de Lastminute.com por ejemplo te adjuntan mails que son paginas web, o la web de publircidad.com..
allanvazz
Al final solucionaste el problema de los espacios?? como te quedó? podrías dejarnos ver el código ? Yo tengo el mismo problema con las firmas de mi empresa. Primero empecé con divs pero después de ver que en outlook hacia lo que le daba la ganas, lo cambié a tablas, y el resultado es bastante parecido, pero los espacios no cuadran, los tengo dentro de la línea de código: <etiqueta style:"margin...etc...."> pero no los respeta... alguna solución??
microbians Staff
Este post es de hace 12 años y ha llovido mucho desde entonces ;) ahora podrías intentar usar un framework como este:
http://zurb.com/ink/
Foundation for Emails | A Responsive Email Framework from ZURB
allanvazz
Ostia 12 años??? WTF!!! y yo sigo anclado en el mismo problema.... :O
voy a probar este framework, pinta bien... lo pruebo y os dejo mi opinión.
Merci
allanvazz
en principio es un framework para emailling, no para firmas... estoy buscando otra opción porque no me convence.
Merci
piglesias Plus
@allanvazz ¿Qué problema tienes concretamente con las firmas de e-mail?
Si es de huecos en las tablas asegúrate de que la tabla lleva todo esto:
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse:collapse">
Si la tabla lleva imágenes, estan deben tener:
display:block;
Hace tiempo escribí un post sobre elloEspero que te sirva de algo. Si no, si me das más detalles, igual se me ocurre qué otra cosa puede ser.
allanvazz
Ok! muchas gracias, lo probaré !! XD