
Puede hacer un vínculo de anclaje de variedad de jardín (<a>
) abre un nuevo correo electrónico. Hagamos un pequeño viaje a esta función. Es bastante fácil de usar, pero como ocurre con cualquier sitio web, hay muchas cosas a considerar.
La funcionalidad básica
<a href="https://css-tricks.com/all-about-mailto-links/mailto:[email protected]">Email Us</a>
¡Funciona!
Pero inmediatamente nos encontramos con un puñado de problemas de UX. Uno de ellos es que hacer clic en ese enlace sorprende a algunas personas de una manera que no les gusta. De la misma manera, al hacer clic en un enlace a un PDF, se abre un archivo en lugar de una página web. Le suspiro. Llegaremos a eso en un momento.
“Abrir en una pestaña nueva” a veces sí importa.
Si un usuario tiene su cliente de correo predeterminado (por ejemplo, Outlook, Apple Mail, etc.) configurado para ser una aplicación nativa, realmente no importa. Hacen clic en un mailto:
enlace, esa aplicación se abre, se crea un nuevo correo electrónico y se comporta de la misma manera si ha intentado abrir ese enlace en una nueva pestaña o no.
Pero si un usuario tiene configurado un cliente de correo electrónico basado en navegador, sí importa. Por ejemplo, puede permitir que Gmail sea su administrador de correo electrónico predeterminado en Chrome. En ese caso, el enlace se comporta como cualquier otro enlace, ya que si no abre en una nueva pestaña, la página se redirigirá a Gmail.
Estoy un poco indeciso al respecto. Antes he intervenido en la apertura de enlaces en nuevas pestañas, pero no específicamente en la apertura de correos electrónicos. Yo diría que me inclino un poco por usar target="_blank"
en los enlaces de correo, a pesar de mis sentimientos sobre su uso en otros escenarios.
<a href="https://css-tricks.com/all-about-mailto-links/mailto:[email protected]" target="_blank" rel="noopener noreferrer">Email Us</a>
Agregar un sujeto y un cuerpo
Esto es algo raro de ver por alguna razón, pero mailto:
Los enlaces también pueden definir el asunto y el cuerpo del correo electrónico. ¡Son solo parámetros de consulta!
mailto:[email protected]?subject=Important!&body=Hi.
Agregue soporte de copia y copia oculta
Puede enviar a varias direcciones de correo electrónico, e incluso copia al carbón (CC) y copia oculta (BCC) personas en el correo electrónico. El truco consiste en más parámetros de consulta y separar las direcciones de correo electrónico con comas.
mailto:[email protected][email protected],[email protected],[email protected]&[email protected]
Este sitio es muy útil
mailtolink.me ayudará a generar enlaces de correo electrónico.