Inicio Marketing Digital Cómo crear un formulario HTML que le envíe un correo electrónico

Cómo crear un formulario HTML que le envíe un correo electrónico


A veces, mejorar UX puede costar mucho dinero.

Y a menudo, algunos de los problemas que tienen los visitantes del sitio web son soluciones fáciles y simples.

Eso plantea la pregunta: ¿cómo puede saber si los clientes disfrutan de su experiencia en el sitio web?

La respuesta puede ser más simple de lo que piensas.

Tener formularios en su sitio web es una forma efectiva de obtener comentarios de los clientes sobre su experiencia durante su visita. Estos formularios le brindan información sobre cómo mejorar la experiencia de usuario de su sitio web para obtener mayores conversiones a largo plazo.

De hecho, el 74% de los vendedores utilizan formularios para generar clientes potenciales, y de esos vendedores, más de la mitad dicen que es la herramienta que conduce a la conversión con mayor frecuencia.

Ya sea que desee convertir más visitantes en clientes potenciales, recopilar información para su equipo de ventas o crear defensores de la marca más leales, los formularios son imprescindibles para una estrategia entrante.

En última instancia, los formularios son críticos para resolver la insatisfacción en la experiencia del cliente, lo que garantiza relaciones más sólidas con el cliente. Si no tiene un formulario en su sitio web, podría estar perdiendo más clientes potenciales, mayores conversiones y clientes más felices a largo plazo.

Aquí, lo guiaremos a través de cómo crear un cierto tipo de formulario, uno que le envíe un correo electrónico a usted, así como al cliente, para garantizar que se recibió el formulario.

Cómo crear un formulario en HTML y enviarlo a un correo electrónico

Eso es es posible crear un formulario HTML que envíe correos electrónicos, pero depende de cómo trabajes y de qué plataforma estés trabajando. Esto quiere decir que las cosas son un poco diferentes si el plan es utilizar una combinación de HTML y diferentes scripts.

Usando lo básico

¿Usando solo HTML? Te tenemos cubierto. Desde un nuevo comienzo, aquí hay un código de muestra para usar:

 

method=”POST”

enctype=”multipart/form-data”

name=”EmailForm”>

Name:



Message:


Este código creará un formulario que solicita el nombre del contacto, el mensaje e incluye un botón de envío. Tenga en cuenta que este código es básico: no se verá súper elegante. Para una más hermosa, tendrá que agregar algunas líneas de código más específicas a sus necesidades.

Otra cosa a tener en cuenta con este código es que no se envía directamente a direcciones de correo electrónico, pero se puede abrir en un cliente de correo electrónico o ventana de herramientas para enviar el formulario.

Mientras tu lata use solo HTML básico, esta no es la opción ideal.

La dificultad de los formularios de correo electrónico en HTML

Idealmente, los navegadores le permitirán enrutar los envíos de formularios directamente a una dirección de correo electrónico. Sin embargo, la razón por la que no lo hacen es que enviar un correo electrónico directamente desde un formulario web HTML revelaría la dirección de correo electrónico del visitante, haciendo que el usuario sea vulnerable a actividades maliciosas, como el phishing.

Si bien el código HTML anterior puede activar el cliente de correo predeterminado en la computadora del usuario, el navegador web lo hace enviando una solicitud al proveedor de servicios de correo electrónico, no a la dirección especificada.

Hay algunos problemas con el mailto: opción. Por ejemplo, no es 100% compatible con todos los navegadores, no es muy fácil de usar y es imposible controlar el formato de los datos cuando el navegador envía el formulario.

Más allá de eso, aparecerá un mensaje de advertencia cuando el usuario vaya a enviar el formulario, haciéndole saber que la información que está a punto de enviar no se cifrará por privacidad. Esto puede asustar al usuario para que no envíe el formulario.

Entonces, ¿qué código HTML le permite enviar envíos de formularios directamente a una dirección de correo electrónico?

Para que el formulario pueda funcionar con su servidor de correo electrónico y enviarlo a un buzón, PHP es la respuesta: exploremos esa opción ahora.

Hacer un formulario completo

Para crear un formulario con el que los suscriptores puedan contactarlo, el script PHP será su mejor amigo. Lo sé, otro acrónimo. Este significa preprocesador de hipertexto, y este lenguaje colabora con HTML para procesar el formulario.

Antes de saltar al proceso, analicemos algunos conceptos básicos de la forma.

Un formulario web tiene dos lados: el front-end, visto en el navegador por los visitantes, y un script de back-end que se ejecuta en el servidor.

El navegador web del visitante utiliza código HTML para mostrar el formulario. Cuando se envía el formulario, el navegador envía la información al backend utilizando el enlace mencionado en el atributo «acción» de la etiqueta del formulario, enviando los datos del formulario a esa URL.

Por ejemplo:

.

El servidor luego pasa los datos al script especificado en la URL de acción: myform-processor.php en este caso. Con estos datos, el script de back-end puede crear una base de datos de envíos de formularios, dirigir al usuario a otra página (por ejemplo, pago) y enviar un correo electrónico.

Hay otros lenguajes de secuencias de comandos que puede usar en la programación de back-end, como Ruby, Perl o ASP para Windows. Sin embargo, PHP es el más popular y lo utilizan casi todos los proveedores de servicios de alojamiento web.

Si necesita completar un formulario, siga los pasos a continuación.

1. Use PHP para crear una página.

Cuando esté creando una página web, en lugar de usar la extensión «.html», escriba «.php». Esto es similar a lo que sucede cuando guarda una imagen como «jpg» versus «png».

Al hacer esto, el servidor sabrá alojar el PHP que escribes. En lugar de guardar la página HTML vacía como tal, guárdela como algo así: «subscriberform.php». Después de crear y guardar su página, podrá crear el formulario.

2. Haga el formulario usando el código.

En este paso, escribirá el código para crear el formulario.

Si no está seguro de cómo crear formularios en HTML, consulte HTML Dog’s recurso para una introducción a los conceptos básicos.

El siguiente código es lo que se necesita para un formulario básico:

 

Debido a que esto es similar a la escritura solo en HTML, estas líneas también crearán un nombre para el formulario y un área para que los suscriptores escriban un mensaje personalizado y se lo envíen.

Una diferencia importante es la parte «action = contact.php». Esta parte del código es lo que hará que la página envíe el formulario cuando se envíe. Recordemos que en el primer ejemplo, esa no era una opción.

3. Haga que los formularios envíen correos electrónicos.

Después de crear el formulario y agregar todas las correcciones adecuadas según sus preferencias de diseño, es hora de crear la parte del correo electrónico.

Para esto, vas a desplazarte hasta el comienzo de la página (el muy principio, incluso antes de definir el Doctype HTML). Para habilitar el envío de datos en el correo electrónico, debemos agregar un código que procesará los datos. Copie este código o cree algo similar:

 

if($_POST["message"]) {

mail("[email protected]", "Here is the subject line",

$_POST["insert your message here"]. "From: [email protected]");

}

?>

Recuerde que todo lo que se encuentre dentro de las líneas primera y última le indicará a la página web que haga que estas funciones funcionen como PHP. Este código también verifica si un suscriptor usa el formulario. Desde allí, verifica si se envió el formulario.

Después de desglosarlo, «mail» envía el formulario completo como un correo electrónico a «[email protected]», y la línea de asunto es lo que sigue. En la siguiente línea, puede escribir una copia del mensaje de correo electrónico dentro de las cotizaciones, para que se envíe desde la dirección de correo electrónico que elija.

Para resumir el proceso para crear formularios de correo electrónico HTML:

Una vez que se envía el formulario, la página se envía los datos a sí misma. Si los datos se han enviado correctamente, la página los envía como un correo electrónico. El navegador carga el HTML de la página, el formulario incluido.

Con eso, tiene el código básico que necesita para crear el formulario.

Tenga en cuenta que esta es solo una forma de hacer esto; alternativamente, también puede crear un formulario utilizando un CRM como HubSpot.

Si es cliente de HubSpot, siga leyendo para aprender cómo usar la herramienta de HubSpot para crear un formulario HTML que le envíe un correo electrónico.

Usando HubSpot

HubSpot Forms es parte de Marketing Hub y no requiere ningún conocimiento técnico previo.

Si desea aprender cómo recibir un correo electrónico después de enviar un formulario, eche un vistazo a nuestro Artículo de la base de conocimiento.

Cuando usa Formularios de HubSpot, puede crear formularios personalizados que se conectan a su lista de contactos. También puede personalizar esos formularios y activar correos electrónicos automáticos en función de la finalización de sus formularios. Tenga en cuenta que este último requiere una actualización premium. Hacer clic aquí para obtener más información sobre los formularios de HubSpot.

Los formularios HTML son un proceso bastante simple y una excelente manera de conectarse con los suscriptores. Tenerlos en su sitio les brinda a los clientes una manera fácil de contactar a su empresa o registrarse para recibir correos electrónicos.

Los formularios que le envían un correo electrónico guardan información en su bandeja de entrada para referencia y facilidad. Recuerde que estas no son sus únicas opciones para crear formularios. Si desea una lista de herramientas que ayudan a crear formularios, consulte nuestra publicación aquí.

Nota del editor: esta publicación se publicó originalmente en diciembre de 2019 y se ha actualizado para que sea exhaustiva.

104 mitos, experimentos e inspiración del marketing por correo electrónico



Versión en Inglés

Deberías leer:   Lo que los especialistas en marketing deben saber

Most Popular

Nueva York entra el lunes a la fase tres de su reapertura económica

Nueva York, 5 jul (EFE).- La ciudad de Nueva York entrará en la fase tres de reapertura económica mañana, lunes, lo que permitirá...

Terremoto: se informó un terremoto de 4.0 cerca de Clearlake, California.

Un terremoto de magnitud 4.0 se informó el domingo a las 9:14 a.m., hora del Pacífico, a 11 millas de Clearlake, California, según el...

Kanye West anuncia que se postula para presidente: «Visión 2020»

El sábado por la noche, Kanye West envió a Twitter a un frenesí, luego de anunciar que se postulaba para presidente. En...

Coronavirus: ¿Se arrepienten los líderes de LA que presionaron para reabrir?

El número de muertos en el condado de Los Ángeles acababa de superar los 2.000 y los funcionarios de salud pública estaban pintando un...
Deberías leer:   10 calendarios, herramientas y plantillas de redes sociales para planificar su contenido