Los enlaces mailto en HTML permiten abrir el programa o aplicación de correo del usuario con determinados campos del mensaje ya preparados.
Podemos utilizarlos para indicar el destinatario y también para rellenar automáticamente el asunto, parte del cuerpo del mensaje o campos como CC y BCC.
Un enlace básico sería:
<a href="mailto:info@ejemplo.com">Enviar correo</a>
Al hacer clic, el navegador intentará abrir la aplicación configurada para gestionar enlaces de correo electrónico.
Es importante entender que mailto: no envía ningún mensaje automáticamente. Únicamente prepara un nuevo correo para que el usuario pueda revisarlo, modificarlo y decidir si quiere enviarlo.
Cómo añadir un asunto a un enlace mailto
Para definir un asunto utilizamos el parámetro subject.
La primera opción se añade después de un signo de interrogación:
<a href="mailto:info@ejemplo.com?subject=Solicitud%20de%20informaci%C3%B3n">
Solicitar información
</a>
Al abrirse el mensaje, el campo del asunto aparecerá con:
Solicitud de información
Los espacios y determinados caracteres especiales deben estar correctamente codificados dentro de la URL. Por ejemplo, %20 representa un espacio y los caracteres no ASCII, como algunas letras acentuadas, deben codificarse mediante UTF-8 y codificación porcentual.
Añadir texto al cuerpo del mensaje
También podemos utilizar el parámetro body para dejar preparado un texto inicial.
Por ejemplo:
<a href="mailto:info@ejemplo.com?body=Hola%2C%20quisiera%20recibir%20m%C3%A1s%20informaci%C3%B3n.">
Contactar
</a>
El cliente de correo abrirá un nuevo mensaje con ese contenido en el cuerpo.
Normalmente resulta mejor utilizar body para mensajes breves o para proporcionar una pequeña estructura que el usuario pueda completar. No es un mecanismo pensado para construir correos HTML complejos.
Mailto con asunto y cuerpo a la vez
Cuando necesitamos combinar varios parámetros, el primero comienza con ? y los siguientes se separan mediante &.
La URL sería conceptualmente:
mailto:info@ejemplo.com?subject=Consulta&body=Hola
Sin embargo, cuando escribimos esa URL dentro de código HTML es recomendable representar el ampersand como &.
Por tanto:
<a href="mailto:info@ejemplo.com?subject=Consulta&body=Hola">
Enviar consulta
</a>
Esta diferencia puede pasar desapercibida porque muchos navegadores toleran el uso directo de &, pero & es la forma adecuada de escribirlo dentro del atributo HTML.
Cómo introducir saltos de línea
Podemos preparar un cuerpo con varias líneas utilizando %0D%0A, que representa un salto de línea en un URI mailto:.
Por ejemplo:
<a href="mailto:info@ejemplo.com?subject=Solicitud%20de%20informaci%C3%B3n&body=Hola%2C%0D%0A%0D%0AQuisiera%20recibir%20informaci%C3%B3n%20sobre%3A%0D%0A%0D%0AGracias.">
Solicitar información
</a>
El mensaje quedaría preparado aproximadamente así:
Hola, Quisiera recibir información sobre: Gracias.
_x000D_ De esta forma podemos proporcionar una pequeña plantilla sin impedir que el usuario añada o modifique el contenido antes de enviarlo._x000D_
Añadir CC y BCC
mailto: también permite incluir destinatarios en copia mediante cc y en copia oculta mediante bcc.
Un ejemplo con CC sería:
<a href="mailto:info@ejemplo.com?cc=administracion@ejemplo.com&subject=Consulta">
Enviar consulta
</a>
Y podemos combinar todos los campos:
<a href="mailto:info@ejemplo.com?cc=ventas@ejemplo.com&bcc=archivo@ejemplo.com&subject=Solicitud%20de%20informaci%C3%B3n&body=Hola%2C%0D%0A%0D%0AQuisiera%20recibir%20m%C3%A1s%20informaci%C3%B3n.">
Contactar por correo
</a>
_x000D_
Hay que tener cuidado con bcc. Aunque el destinatario se comporte como copia oculta dentro del correo, su dirección sigue apareciendo en el código del enlace mailto:. Por tanto, no debemos utilizar este sistema pensando que la dirección quedará oculta para quien pueda consultar el HTML de la página._x000D_
Ejemplo completo de mailto
_x000D_ Si necesitamos una plantilla sencilla para una página web, podríamos utilizar:_x000D_
<a href="mailto:info@ejemplo.com?subject=Consulta%20desde%20la%20web&body=Hola%2C%0D%0A%0D%0AQuisiera%20consultar%20lo%20siguiente%3A%0D%0A%0D%0A">
Enviar consulta por correo
</a>
_x000D_ Este enlace prepara el destinatario, el asunto y un pequeño texto inicial para que el usuario escriba su consulta._x000D_
¿Por qué hay que codificar los caracteres?
Los parámetros de un mailto: forman parte de una URL. Por eso determinados caracteres tienen un significado especial y no conviene introducir directamente cualquier texto.
Entre los casos habituales encontramos:
%20 → espacio
%0D%0A → salto de línea
%26 → & cuando forma parte del contenido
%3F → ? cuando forma parte del contenido
%23 → #
Para textos generados dinámicamente lo recomendable es utilizar las funciones de codificación correspondientes al lenguaje con el que estemos construyendo la URL, en lugar de intentar sustituir manualmente todos los caracteres.
Esto adquiere especial importancia cuando el asunto o el cuerpo proceden de datos introducidos por un usuario.
Limitaciones de los enlaces mailto
Un enlace mailto: depende de que el dispositivo tenga correctamente configurado un cliente o servicio capaz de gestionar ese tipo de enlace.
El comportamiento puede variar según el navegador, el sistema operativo y la aplicación de correo elegida por el usuario.
Además, una dirección incluida directamente en el HTML de una página pública puede quedar expuesta a sistemas automatizados que recopilan direcciones de correo.
Por eso mailto: es útil para enlaces sencillos, pero no sustituye a un formulario de contacto cuando necesitamos validar datos, controlar el envío, registrar solicitudes o ejecutar procesos adicionales.
Mailto es útil cuando la necesidad es sencilla
Para ofrecer al usuario una forma rápida de iniciar un correo, mailto: sigue siendo una solución simple y válida.
Podemos utilizarlo únicamente con un destinatario o añadir asunto, cuerpo, CC y BCC para facilitar determinadas comunicaciones.
La clave está en construir correctamente la URL, codificar los caracteres necesarios y no utilizar mailto: para tareas que requieren realmente un formulario o un sistema de envío desde el servidor.