Cómo crear un formulario de contacto para tu tienda online (con ejemplos)
Un formulario de contacto es una herramienta online que permite a las marcas recopilar datos de sus potenciales clientes, como nombre, e-mail y teléfono, para luego generar campañas de conversión y fidelización. Aprendé cómo crear un formulario web para tu e-commerce.
Los formularios de contacto son una herramienta valiosa para cualquier sitio web o tienda online. No solo permiten a los visitantes ponerse en contacto con la marca, sino que también ayudan a construir una base de datos propia de potenciales clientes.
Esta base de datos se convierte en un gran activo para el negocio, ya que proporciona información importante sobre los visitantes (como necesidades o deseos) y permite establecer una comunicación efectiva con ellos.
En este post te contamos cómo crear tu formulario de contacto y, a modo de bonus, vas a aprender a diseñar anuncios en Instagram Lead Ads que te van a ayudar a captar usuarios a través de un formulario web prediseñado.
¡Vamos!
Qué es un formulario de contacto
Un formulario de contacto es una herramienta que se usa en los sitios web o tiendas online para que los visitantes envíen un mensaje a la persona dueña del sitio. Para implementarlo es clave tener claro qué es un lead en marketing. Este formulario suele incluir campos para que los usuarios ingresen su nombre, dirección de correo electrónico y el mensaje que quieran dejar.
Una vez que envían el formulario, el propietario de la página recibe un e-mail o una notificación que le informa que ha recibido una consulta.
5 ventajas de crear un formulario de contacto
Ya sea que tengas una página web o una tienda online, ofrecer un formulario de contacto como vía de comunicación con tu audiencia puede traer muchos beneficios a tu negocio.
Acá detallamos los principales:
1. Facilita la comunicación
Un formulario de contacto permite que tus visitantes se conecten con vos de manera fácil y rápida, sin tener que buscar tu e-mail o número de teléfono.
2. Ayuda a organizar y gestionar las solicitudes
Los formularios de contacto pueden incluir campos adicionales, como una casilla para seleccionar el motivo del mensaje (por ejemplo, consulta, reclamo, cambio, devolución, etc.). Esto facilita la gestión y lectura de los mensajes, ahorrando tiempo tuyo y de tu equipo.
3. Aporta a las métricas de tu negocio
Contar con esa casilla para seleccionar el tipo de mensaje en el formulario de contacto, te puede servir para crear métricas sobre cuántos reclamos, solicitudes de cambio, etc. recibís por mes. Así vas a tener una idea más clara de dónde hacer ajustes.
Por ejemplo, si vendés indumentaria y recibís muchos mensajes de cambio de talle, la pregunta sería: ¿estoy ofreciendo una tabla de talles para cada producto? Esa tabla ¿tiene los datos correctos? ¿Cómo podría mejorarla?
4. Evita el spam
Los formularios de contacto pueden incluir medidas de seguridad como CAPTCHA para evitar que los spammers envíen correos electrónicos no deseados. Quizás el ejemplo más conocido de CAPTCHA es el que requiere de una tilde para informar que “no sos un robot”, ¿lo viste alguna vez?
5. Mejora el posicionamiento de tu marca
Tener un formulario de contacto puede darle una imagen más profesional a tu sitio web o tienda online, generando autoridad y reconocimiento entre los visitantes.
En resumen, tener un formulario de contacto en tu página web puede ayudarte a mejorar la eficiencia de la comunicación en tu negocio y a brindar una experiencia más profesional para tus potenciales clientes. ¡Todas ventajas!
Elementos de un formulario de contacto
Seguramente alguna vez completaste un formulario de contacto, ya sea para hacer una consulta en una tienda virtual, un trámite en tu ciudad o cualquier otra gestión online.
En líneas generales, los elementos que componen un formulario web son:
- Título. Tiene que ser claro y describir el propósito del formulario, por ejemplo “Formulario de contacto” o “Contactanos”.
- Campos de entrada. Son los espacios donde los visitantes van a dejar los datos que solicites, como nombre, dirección de e-mail y mensaje.
💡 Tip: si bien cada marca puede solicitar la información que desee en su formulario de contacto, a las personas no nos gusta “compartir cualquier dato porque sí”. Por eso, te recomendamos que pidas lo mínimo indispensable (es decir, los 3 datos que detallamos en el párrafo anterior). De todas maneras, si tu formulario es, por ejemplo, para potenciales clientes mayoristas, tal vez puedas pedir algún otro dato que creas necesario. - Etiquetas de campo. Estas etiquetas describen lo que se espera que los visitantes ingresen en cada campo de entrada, por ejemplo, “Nombre” o “Correo electrónico”.
- Campos opcionales. Podés incluir campos opcionales para que los visitantes te brinden más información, como su número de teléfono.
- Casilla de verificación de consentimiento. Como el formulario de contacto recopila datos personales, al final de todo tenés que incluir una casilla de verificación para que los visitantes tilden, donde aceptan que estás recopilando sus datos. También tenés que informar brevemente cómo vas a hacer uso de esa información.
- Medida de seguridad CAPTCHA. Como te contamos en la sección anterior, agregar esta medida te va a ayudar a evitar el spam y, al mismo tiempo, vas a estar cuidando los datos de tus clientes o potenciales clientes.
- Botón de envío (o CTA). Se trata del botón que los visitantes tienen que presionar para mandar el formulario una vez que hayan completado todos los campos requeridos. En general, suele tener un copy como “Enviar” o “Enviar formulario”.
- Mensaje de confirmación. Una vez que los visitantes hayan enviado el formulario de contacto, es una buena práctica mostrar un mensaje de confirmación para que sepan que se envió correctamente. Algo corto y directo como “Muchas gracias por tu mensaje. En breve nos vamos a poner en contacto con vos.”
💡 Tip: todos estos elementos que detallamos tienen que diseñarse de manera clara y fácil para que los visitantes puedan completar sus datos sin problemas.
Cómo crear un formulario de contacto
Ya sabés la teoría, ahora pasemos a la práctica: vamos a crear un formulario de contacto para tu tienda online o sitio web.
En este caso, te mostramos cómo hacerlo con HTML y con la herramienta Google Forms. Empecemos.
Cómo crear un formulario de contacto con HTML
El lenguaje HTML (HyperText Markup Language, por sus siglas en inglés) es utilizado para crear y diseñar páginas web.
Permite estructurar el contenido y definir los diferentes elementos que componen una web, como títulos, párrafos, imágenes, tablas, enlaces y otros elementos interactivos.
Para desarrollar un formulario de contacto con HTML, seguí estos pasos:
1) Creá un archivo HTML en blanco: abrí un editor de texto y guardá un nuevo archivo con la extensión .html.
2) Añadí el elemento del formulario: sumá el elemento <form> en el archivo HTML y asegurate de que tenga el atributo “method” y “action“.
El atributo “method” define cómo se va a enviar el formulario mientras que, el atributo “action“, define la página a la que se enviará ese formulario.
Por ejemplo, si querés enviar el formulario de contacto a un archivo PHP llamado “procesamiento.php”, podés usar el siguiente código:
<form method=”POST” action=”procesamiento.php”>
4) Detallá los campos de entrada: esto se hace para que los visitantes puedan compartir su información. Para eso, usá el elemento <input> y asegurate de que cada campo tenga el atributo “name” para que pueda ser identificado por el archivo PHP que procesa el formulario.
También podés agregar etiquetas <label> para describir cada campo. Por ejemplo, podés agregar un campo de entrada para el nombre y otro para el e-mail, así:
<label for=”nombre”>Nombre:</label>
<input type=”text” id=”nombre” name=”nombre”>
<label for=”email”>E-mail:</label>
<input type=”email” id=”email” name=”email”>
5) Sumá un campo de texto para el mensaje: agregá un campo de texto para que los visitantes puedan escribir su mensaje utilizando el elemento <textarea>.
Por ejemplo:
<label for=”mensaje”>Mensaje:</label>
<textarea id=”mensaje” name=”mensaje”></textarea>
6) Adicioná un botón de envío: este botón sirve para que los visitantes puedan enviar el formulario. En este caso, usá el elemento <input> con el atributo “type” y “submit”.
Así:
<input type=”submit” value=”Enviar”>
7) Cerrá el elemento del formulario: esto se hace a través de la etiqueta de cierre </form>.
Entonces, el código HTML final para tu formulario de contacto quedaría así:
<form method=”POST” action=”procesamiento.php”>
<label for=”nombre”>Nombre:</label>
<input type=”text” id=”nombre” name=”nombre”><br><br>
<label for=”email”>E-mail:</label>
<input type=”email” id=”email” name=”email”><br><br>
<label for=”mensaje”>Mensaje:</label>
<textarea id=”mensaje” name=”mensaje”></textarea><br><br>
<input type=”submit” value=”Enviar”>
</form>
Tené presente que el código ”/br” agrega un salto de línea y es opcional. Te recomendamos usarlo para facilitar la lectura del usuario.
💡 Tip: ya sea que elijas crear un formulario de contacto con HTML o con Google Forms, antes de publicarlo te recomendamos probarlo para asegurarte de que funciona bien y que estás recibiendo todos los datos que necesitás.
Cómo crear un formulario de contacto con Google Forms (e insertarlo en tu Tiendanube)
Si no te llevás muy bien con el lenguaje HTML, no te preocupes: Google te facilita las cosas.
A través de su herramienta Google Forms podés crear formularios de contacto gratis con preguntas de opciones múltiples, casillas de verificación, de respuesta corta o larga, entre otras.
También podés personalizar el aspecto y la apariencia de los formularios, elegir un tema y agregar imágenes y videos.
Seguí estos pasos para crear un formulario de contacto con Google Forms:
- Ingresá a la página de Google Forms.
- Luego iniciá sesión con tu cuenta de Gmail (si no tenés una, vas a tener que crearla).
- Presioná en el botón “+ Nuevo formulario en blanco” para crear un formulario.
- En la parte superior del formulario vas a ver 2 campos, uno para el título y otro para una breve descripción del formulario. Completalos según tus necesidades.
- En la sección siguiente, agregá los campos de texto que consideres para recopilar la información.
Para el caso del nombre y del e-mail, seleccioná el tipo de pregunta “Respuesta corta” y, para el caso del mensaje, el tipo de pregunta “Párrafo” (así los usuarios tiene el espacio suficiente para explayarse todo lo que necesiten).
- Tené en cuenta que Google Forms te permite personalizar el diseño del formulario seleccionando diferentes temas y opciones de plantillas. Para eso, presioná el botón “Personalizar tema” que se encuentra en el margen superior derecho y elegí el que mejor se adapte a tu marca. También podés subir una imagen propia.
- En la pestaña “Configuración” vas a ver opciones para ajustar la privacidad del formulario, permitir respuestas anónimas, crear un mensaje de confirmación. etc. Hacé las configuraciones que consideres necesarias.
- Una vez que hayas configurado y personalizado el formulario web, podés compartirlo con otros. Presioná en el botón “Enviar” y elegí cómo hacerlo: puede ser por correo electrónico, a través de un enlace o con el código HTML para insertar donde quieras.
A medida que las personas completen y envíen el formulario de contacto, las respuestas se guardarán automáticamente en una hoja de cálculo de Google Sheets asociada al formulario. Podés acceder a estas respuestas en cualquier momento ingresando a la pestaña “Respuestas” del mismo formulario.
Si tenés una Tiendanube ¡aprovechá para insertar tu formulario de Google en tu e-commerce! Mirá este tutorial y aprendé cómo hacerlo.
Además de Google Forms, hay otras herramientas que podés usar para crear formularios de contacto como Wufoo, JotForm, Typeform y Formstack. Algunas de ellas tienen versión gratuita. Te invitamos a visitarlas para ver los detalles y funcionalidades de cada una.
Ejemplos de formularios de contacto
Te compartimos 3 ejemplos de formularios de contacto:
1) Zoom
Al tratarse de un servicio principalmente B2B, en este formulario la empresa solicita varios datos de los potenciales clientes:
2) Latam
En este caso, Latam brinda la opción de elegir una categoría de solicitud antes de avanzar con el formulario web. De esta manera, organiza y gestiona de forma más eficiente todos los contactos de sus clientes.
3) Puro
Esta Tiendanube optó por crear un Google Forms para ponerse en contacto con sus potenciales clientes mayoristas. Mirá:
Página de contacto: qué es y cómo crear una en mi tienda online
A diferencia del formulario de contacto o formulario web, que podés crear varios y usarlos con diferentes fines (como ponerte en contacto con clientes de venta mayorista o para recibir comentarios sobre tu negocio, por ejemplo), la página de contacto es una sección que está dedicada a brindar información de contacto a los visitantes.
Esta página incluye información de la marca, como una dirección de correo electrónico, un número de teléfono, una dirección física (si hay) y, claro, un formulario de contacto.
Mirá el ejemplo de la Tiendanube Fe:
Si tenés una Tiendanube, podés ingresar a este tutorial para conocer cómo agregar la página de contacto en tu tienda.
Bonus: ¿cómo crear un formulario de contacto en Instagram?
Instagram tiene una funcionalidad que se llama Instagram Lead Ads. Son anuncios que aparecen en la plataforma y que están diseñados específicamente para captar leads (o suscriptores).
Estos anuncios incluyen un formulario integrado en la misma publicación que facilita a los usuarios brindar datos como su nombre, correo electrónico y número de teléfono, sin tener que abandonar la plataforma de Instagram.
Así, los anuncios de Instagram Lead Ads ayudan a las marcas a recopilar información de potenciales clientes de forma rápida y eficiente.
Además, como los formularios están diseñados específicamente para dispositivos móviles, son fáciles de completar, generando una buena experiencia de usuario.
11 pasos para crear un anuncio con formulario de contacto en Instagram Lead Ads
- Abrí tu cuenta de Facebook Ads Manager y presioná en el botón “Crear anuncio”.
- Seleccioná “Recopilar clientes potenciales” como objetivo del anuncio.
- Definí la audiencia.
- Indicá el presupuesto, la fecha y dónde se va a mostrar.
- Seleccioná el formato del anuncio (secuencia, imagen, video, etc.)
- Escribí el texto del anuncio.
- Creá el formulario de contacto presionando “Nuevo formulario”, en la sección “Formato del anuncio”.
- Seleccioná los campos que quieras incluir en tu formulario de contacto, como nombre, e-mail o número de teléfono.
- Definí tu política de privacidad. Con este tipo de anuncios vas a recopilar datos personales de diferentes usuarios, por eso, tenés que tener una política que indique qué vas a hacer con esa información. Podés agregarla a través de un enlace en el anuncio.
- Configurá la recepción de tu formulario de contacto, como una frase de agradecimiento para tu cliente o una página de destino personalizada.
- Esperá a que Instagram lo apruebe, ¡y que empiece a correr el anuncio!
Conclusión
Tanto el formulario de contacto como la página de contacto son herramientas esenciales para todas las marcas que venden por internet. Ellas aseguran un medio de comunicación directo con los clientes, brindándoles tranquilidad y confianza a la hora de comprar, o luego de realizar la compra.
Si todavía no tenés tu e-commerce, Tiendanube te da la posibilidad de crear una tienda virtual gratis para empezar a vender online. Además, a medida que tu negocio crezca, vas a contar con funcionalidades extra que forman parte de los distintos planes de la plataforma.
