{"id":87652,"date":"2020-01-31T23:20:28","date_gmt":"2020-01-31T17:50:28","guid":{"rendered":"https:\/\/vwo.com\/blog\/sign-up-form-examples\/"},"modified":"2025-11-13T16:25:59","modified_gmt":"2025-11-13T10:55:59","slug":"formularios-de-registro-ejemplos","status":"publish","type":"post","link":"https:\/\/vwo.com\/blog\/es\/formularios-de-registro-ejemplos\/","title":{"rendered":"6 ejemplos de formularios de registro para favorecer la conversi\u00f3n"},"content":{"rendered":"\n

Si hay alg\u00fan elemento esencial en toda p\u00e1gina web, son los formularios de registro. Dependiendo de tu negocio, este formulario se puede utilizar para generar leads, recoger direcciones de correo electr\u00f3nico para tu newsletter y conseguir nuevos clientes. Pero muchos negocios no se molestan en optimizar los formularios de registro<\/a> para mejorar sus conversiones.<\/p>\n\n\n\n

Estos formularios siempre han sido y siguen siendo muy importantes para generar leads (clientes potenciales). Si queremos aumentar una lista de suscriptores comprometidos, el formulario de registro es esencial. Tambi\u00e9n es una parte importante de la estrategia de captaci\u00f3n y retenci\u00f3n de clientes. Es una herramienta muy \u00fatil que se puede utilizar en varios canales del marketing, incluidas las redes sociales, blogs y webs. <\/p>\n\n\n\n

<\/span>Descarga gratis: Gu\u00eda de an\u00e1lisis de formularios<\/em><\/strong><\/a><\/em><\/h2>\n\n\n
\n
\"illustration<\/figure>\n<\/div>\n\n\n

No optimizar el formulario de registro es perder oportunidades de hacer crecer tu negocio.<\/p>\n\n\n\n

Hemos recopilado los mejores ejemplos de estos formularios para evitar que pierdas tiempo, energ\u00eda y dinero. Este art\u00edculo te ense\u00f1ar\u00e1 a crear formularios de registro que mejoren la conversi\u00f3n con ejemplos de los mejores formularios.<\/p>\n\n\n\n

Comencemos.<\/p>\n\n\n

Las mejores pr\u00e1cticas a seguir en formularios de registro para aumentar la conversi\u00f3n<\/strong><\/strong><\/h2>\n\n\n

Necesitas crear formularios llamativos que se puedan enviar por correo electr\u00f3nico que generen m\u00e1s leads e impulsen la conversi\u00f3n. En internet hay millones de distracciones. Tienes que llamar la atenci\u00f3n del usuario en segundos, o es posible que pierdas a ese cliente potencial.<\/p>\n\n\n\n

Para mejorar tus oportunidades de captar la atenci\u00f3n de los visitantes y conseguir que realicen una acci\u00f3n concreta, sigue los siguientes ejemplos y normas de dise\u00f1o de los formularios de registro.<\/p>\n\n\n

Aumenta las dimensiones de los campos del formulario<\/strong><\/strong><\/h3>\n\n
\n
\"an<\/figure>\n<\/div>\n\n\n

En un formulario de registro, tu objetivo principal deber\u00eda ser mejorar al m\u00e1ximo la experiencia del usuario. No todos los usuarios utilizar\u00e1n el teclado para pasar de un campo del formulario a otro. Algunos optar\u00e1n por usar el rat\u00f3n o la pantalla t\u00e1ctil para rellenar sus datos. Para que puedan completar estos campos con facilidad, aseg\u00farate de que est\u00e1n bien visibles.<\/p>\n\n\n

Evita tener los campos en dos columnas<\/strong><\/strong><\/h3>\n\n
\n
\"illustration<\/figure>\n<\/div>\n\n\n

Tenemos que optimizar los formularios tanto para ordenadores como para m\u00f3viles. Organizar el formulario en dos columnas funciona en el formato de escritorio porque la pantalla rectangular lo permite. Sin embargo, en el m\u00f3vil es dif\u00edcil de utilizar y afecta a la legibilidad del texto.<\/p>\n\n\n\n

Tener varias columnas puede confundir al visitante al completar los campos. Si los campos est\u00e1n divididos en dos columnas, hay muchas probabilidades de que el usuario se salte una o dos l\u00edneas. Esto retrasar\u00eda el proceso de registro, provocando que algunos usuarios se frustren y abandonen el formulario.<\/p>\n\n\n

No utilices m\u00e1s de 4 campos<\/strong><\/strong><\/h3>\n\n
\n
\"screenshot
Fuente de la imagen: Tumblr<\/a><\/figcaption><\/figure>\n<\/div>\n\n\n

Cuantos menos campos, mayor participaci\u00f3n en los formularios registros. Y cuantos m\u00e1s, m\u00e1s probabilidades de confusi\u00f3n. Los estudios han demostrado que una cantidad limitada de campos tiene una tasa de conversi\u00f3n mayor.<\/p>\n\n\n

\n
\"bar
Fuente de la imagen: Forbes<\/a><\/figcaption><\/figure>\n<\/div>\n\n\n

La imagen anterior muestra que los formularios con menos de 5 campos tienen un 20 % m\u00e1s de conversi\u00f3n que el resto.<\/p>\n\n\n\n

Limita tu formulario a un m\u00e1ximo de 4 campos. No incluyas informaci\u00f3n que no te ayude a convertir potenciales clientes. Evita un formulario demasiado largo quitando las preguntas innecesarias. Si un usuario se registra a una newsletter<\/a>, no es necesario su n\u00famero de tel\u00e9fono.<\/p>\n\n\n\n

Nadie quiere invertir m\u00e1s de un par de minutos en completar formularios.<\/p>\n\n\n

Evita los campos con asterisco o de confirmaci\u00f3n de contrase\u00f1a<\/strong><\/strong><\/h3>\n\n\n

Como te dec\u00eda, cuanto m\u00e1s corto sea el formulario, mejor. Si sigues esta norma, no necesitar\u00e1s a\u00f1adir los asteriscos que hacen que sea obligatorio rellenar algunos de los campos. Si te ci\u00f1es a poner solo los campos importantes, el usuario no necesitar\u00e1 indicaciones sobre qu\u00e9 campos debe rellenar.<\/p>\n\n\n\n

Evita tambi\u00e9n el apartado \u00abConfirmar contrase\u00f1a\u00bb. Es m\u00e1s sencillo habilitar la opci\u00f3n \u00abMostrar contrase\u00f1a\u00bb en el mismo campo de la contrase\u00f1a para que el usuario pueda comprobarla.<\/p>\n\n\n

\n
\"screenshot<\/figure>\n<\/div>\n\n\n

Consejo: <\/strong>Si utilizas el correo como nombre de usuario te ahorrar\u00e1s pedirle al visitante las dos cosas por separado. Esto ayuda a reducir el n\u00famero de campos del formulario. Esta caracter\u00edstica estar\u00e1 presente en los formularios de registro m\u00e1s efectivos.<\/p>\n\n\n

Evita campos complejos y da instrucciones claras<\/strong><\/strong><\/h3>\n\n
\n
\"an
Fuente de la imagen: Blue<\/figcaption><\/figure>\n<\/div>\n\n\n

Un formulario de registro debe ser claro y f\u00e1cil de entender. Evita el uso de campos complejos que puedan irritar al usuario. Anticipa posibles fallos explicando al usuario los pasos a seguir para rellenar el formulario. Para evitar que el usuario se pierda, coloca instrucciones claras junto al campo a rellenar.<\/p>\n\n\n

El bot\u00f3n de registro debe destacar y enviar un mensaje claro<\/strong><\/strong><\/h3>\n\n\n

Una de las partes m\u00e1s importantes del formulario de registro es el bot\u00f3n CTA. Debe llamar la atenci\u00f3n del usuario y llevarle a realizar una acci\u00f3n determinada. Elige un color vivo que contraste con el color de fondo.<\/p>\n\n\n

\n
\"an
Fuente de la imagen: Treehouse<\/a><\/figcaption><\/figure>\n<\/div>\n\n\n

El texto del bot\u00f3n de registro debe tener una propuesta de valor clara. Sustituye el t\u00edpico bot\u00f3n de \u00abRegistrarse\u00bb o \u00abDescargar\u00bb por \u00abSolicitar prueba gratis\u00bb o \u00abIniciar prueba gratuita\u00bb. Los botones c\u00f3mo estos indican al usuario lo que va a obtener cuando se registre.<\/p>\n\n\n

Registrarse usando las redes sociales<\/strong><\/strong><\/h3>\n\n
\n
\"an
Fuente de la imagen: Treehouse<\/figcaption><\/figure>\n<\/div>\n\n\n

Si permites al usuario registrarse a trav\u00e9s de las redes sociales, acelerar\u00e1s el proceso de registro. La mayor\u00eda de los usuarios prefieren esta opci\u00f3n porque es m\u00e1s r\u00e1pida y f\u00e1cil de usar. De este modo no tendr\u00e1n que volver a recordar la contrase\u00f1a.<\/p>\n\n\n

Ofrece un incentivo por registrarse<\/strong><\/strong><\/h3>\n\n\n

Un incentivo es un gran m\u00e9todo para conseguir m\u00e1s registros. Las investigaciones han demostrado que, ofrecer un incentivo puede aumentar la tasa de conversi\u00f3n de registro un 15 %<\/a>.<\/p>\n\n\n

\n
\"graph
Fuente de la imagen: Ecwid<\/figcaption><\/figure>\n<\/div>\n\n\n

En vez de pedir al usuario que se registre, ofr\u00e9cele un incentivo para que quiera darte su correo. Estos incentivos puede ser cualquier cosa que consideres que sea de valor para el usuario.  Algunos de los ejemplos de formularios m\u00e1s efectivos ofrecen un descuento en el producto por registrarse.<\/p>\n\n\n\n

Para crear incentivos mejores, aprende a crear una propuesta de valor impactante.<\/a><\/p>\n\n\n

Evita el uso de Captcha<\/strong><\/strong><\/h3>\n\n\n

Captcha es una tecnolog\u00eda que ayuda a diferenciar a un ordenador de un humano. Si alguna vez has tenido que rellenar un formulario que usa Captcha, sabr\u00e1s lo molesto que puede llegar a ser.<\/p>\n\n\n

\n
\"screenshot<\/figure>\n<\/div>\n\n\n

Aunque la funci\u00f3n de esta herramienta es reducir el spam, al usuario puede resultarle bastante molesta. Es otro campo que rellenar en el formulario. Y muchas veces no funciona hasta el tercer intento. Si esto pasa, el usuario puede llegar a irse de tu web frustrado. Por ello, es mejor evitar directamente el uso de Captcha. <\/p>\n\n\n\n

Ahora que hemos visto los pasos a seguir para dise\u00f1ar tu formulario de registro, veamos algunos ejemplos destacados.<\/p>\n\n\n\n

<\/span>Descarga gratis: Gu\u00eda de an\u00e1lisis de formularios<\/em><\/strong><\/a><\/em><\/h2>\n\n\n

Ejemplos de formularios de registro que favorecen la conversi\u00f3n<\/strong><\/h2>\n\n

MailChimp<\/strong><\/h3>\n\n
\n
\"example
Fuente de la imagen: Mailchimp<\/a><\/figcaption><\/figure>\n<\/div>\n\n\n

Un gran ejemplo de un buen formulario de registro es el de Mailchimp. Es claro, minimalista e indica al visitante claramente los pasos que debe seguir. Otro bonito detalle es la mascota chimpanc\u00e9. Llama la atenci\u00f3n del usuario y hace que se interese m\u00e1s por el formulario.<\/p>\n\n\n\n

Elementos a destacar de este formulario de registro<\/strong><\/strong><\/h4>\n\n\n\n

Tan solo tiene 3 campos. Esto asegura que el formulario sea corto y que solo contenga informaci\u00f3n relevante.<\/p>\n\n\n\n

Las instrucciones sobre c\u00f3mo completar el formulario son claras. Bajo el campo de \u00abContrase\u00f1a\u00bb hay un esquema que explica al usuario los requisitos que esta debe cumplir. Los requisitos van desapareciendo seg\u00fan el usuario los va cumpliendo. No solo mejora la experiencia del usuario, sino que le ahorra tiempo. <\/p>\n\n\n\n

Otra caracter\u00edstica interesante del formulario es el bot\u00f3n de llamada a la acci\u00f3n (CTA). Este permanece en blanco hasta que el usuario completa el formulario. Una vez completado, el bot\u00f3n CTA pasa de estar en blanco a activarse.<\/p>\n\n\n

Pinterest<\/strong><\/h3>\n\n
\n
\"Pinterest
Fuente de la imagen: Pinterest<\/a><\/figcaption><\/figure>\n<\/div>\n\n\n

Un ejemplo de formulario de registro que convierte bien es el de Pinterest. El bot\u00f3n de CTA destaca por su color sobre un fondo neutro y ofrece la opci\u00f3n de iniciar sesi\u00f3n con Google. <\/p>\n\n\n\n

Elementos a destacar de este formulario de registro<\/strong><\/strong><\/h4>\n\n\n\n

Es un formulario directo y tiene tan solo 3 campos. Cuanta menos informaci\u00f3n tenga que dar un visitante, m\u00e1s probabilidades de convertirle. Tambi\u00e9n te explica la raz\u00f3n por la que necesitan tu fecha de nacimiento. <\/p>\n\n\n\n

El lenguaje informal que utiliza el texto del formulario hace que el registro encaje con la marca. La opci\u00f3n de iniciar sesi\u00f3n con Google hace que el usuario no tenga que recordar otra contrase\u00f1a m\u00e1s. <\/p>\n\n\n\n

Otro elemento que mejora las conversiones en formularios de registro es la evidencia social. Las estad\u00edsticas indican que implementar evidencia social en tu web puede mejorar la conversi\u00f3n hasta un 34 %<\/a>.<\/p>\n\n\n\n

Un buen ejemplo de formulario de registro que utiliza la evidencia social a su favor es el de Single Grain.<\/p>\n\n\n\n


<\/p>\n\n\n

\n
\"example
Fuente de la imagen: SingleGrain<\/figcaption><\/figure>\n<\/div>\n\n\n

En su formulario muestran algunas de las grandes marcas con las que han trabajado. Esto mejora su reputaci\u00f3n y demuestra que ofrecen un servicio de calidad. Las grandes marcas no trabajar\u00edan con ellos si no fueran buenos, \u00bfno?<\/p>\n\n\n\n

Consejo:<\/strong> Si nunca has trabajado con grandes marcas o no llegas a mil suscriptores, puedes utilizar las rese\u00f1as de los clientes como evidencia social<\/a>. Son tambi\u00e9n muy efectivas aumentando la conversi\u00f3n de registro.<\/p>\n\n\n

Google<\/h3>\n\n
\n
\"example
Fuente de la imagen: Gmail<\/figcaption><\/figure>\n<\/div>\n\n\n

Google es un gran ejemplo de un buen formulario de conversi\u00f3n.<\/p>\n\n\n\n

Elementos a destacar de este formulario de registro<\/strong><\/strong><\/h4>\n\n\n\n

Es un formulario neutro, sin muchos colores. El agradable a la vista, con un dise\u00f1o minimalista y con una interfaz de usuario clara. Los campos son cortos. Los \u00fanicos datos que le solicitan al usuario son: nombre, apellido, nombre de usuario y contrase\u00f1a.<\/p>\n\n\n\n

Como en MailChimp, tambi\u00e9n utilizan un copy que indica al usuario las instrucciones que debe seguir para completar el formulario. Para asegurarse de que est\u00e1 bien escrita tambi\u00e9n cuenta con el bot\u00f3n \u00abMostrar contrase\u00f1a\u00bb.<\/p>\n\n\n\n

F\u00edjate que en el lateral del formulario hay una imagen con un microcopy que dice: \u00abUna sola cuenta. Todo Google en tus manos\u00bb. Es un ejemplo de una proposici\u00f3n de valor clara. Esto le indica al usuario que crearse una cuenta en Google, implica tener acceso a todas sus funciones.<\/p>\n\n\n

Quicksprout<\/strong><\/h3>\n\n
\n
\"example
Fuente de la imagen: Quick Sprout<\/a><\/figcaption><\/figure>\n<\/div>\n\n\n

Si hay un formulario que destaque, es el de Quicksprout. No utiliza el formulario habitual que vemos en casi todas las webs. Utiliza una entrada de URL. Antes de pedir ninguna informaci\u00f3n al usuario, le ofrecen valor.<\/p>\n\n\n\n

Elementos a destacar de este formulario de registro<\/strong><\/strong><\/h4>\n\n\n\n

El formulario comienza con una pregunta centrada directamente en el problema que el cliente quiere resolver. Debes conocer a tu p\u00fablico objetivo antes de poder ofrecerle soluciones a su problema. En Quicksprout le preguntan al usuario si quiere tener un mayor tr\u00e1fico e inmediatamente le ofrece una soluci\u00f3n que le ayuda a comprender por qu\u00e9 hasta ahora no lo estaba consiguiendo. Hacer un pregunta al usuario y luego ofrecerle una soluci\u00f3n pr\u00e1ctica es una manera muy \u00fatil de aumentar la conversi\u00f3n.<\/p>\n\n\n\n

Todos estos ejemplos de formularios de registro tienen algo en com\u00fan. El minimalismo. Son minimalistas para evitar que el visitante se distraiga. El color del formulario va en consonancia con la tem\u00e1tica de la web.<\/p>\n\n\n

Glovo<\/strong><\/h3>\n\n
\n
\"Glovo
Fuente de la imagen: Glovo<\/a><\/figcaption><\/figure>\n<\/div>\n\n\n

El formulario de registro de Glovo es bonito y empieza con una instrucci\u00f3n muy siemple.<\/p>\n\n\n\n

Elementos a destacar de este formulario de registro<\/strong><\/strong><\/h4>\n\n\n\n

Para que el formulario sea el centro de atenci\u00f3n y el usuario no se distraiga con los textos de fondo, el fondo se oscurece cuando este aparece. Los apartados son cortos; tan solo te pide el n\u00famero de tel\u00e9fono para empezar.<\/p>\n\n\n\n

Tambi\u00e9n ofrece tres opciones alternativas para registrarse. Es un buen incentivo para que el usuario quiera registrarse.<\/p>\n\n\n

Wise<\/strong><\/h3>\n\n
\n
\"Wise
Fuente de la imagen: Wise<\/figcaption><\/figure>\n<\/div>\n\n\n

Wise es una aplicaci\u00f3n que permite al usuario transferir dinero a cualquier banco del mundo f\u00e1cilmente. Su formulario es uno de los ejemplos de dise\u00f1o m\u00e1s sencillo.<\/p>\n\n\n\n

Elementos a destacar de este formulario de registro<\/strong><\/strong><\/h4>\n\n\n\n

Es obvio que para crear una cuenta bancaria, requerir\u00e1n m\u00e1s informaci\u00f3n que solo el correo electr\u00f3nico, pero para no agobiar al usuario empiezan con tan solo eso. <\/p>\n\n\n\n

Consejo:<\/strong> Si por alguna raz\u00f3n necesitaras m\u00e1s de 4 campos, es mejor optar por un dise\u00f1o muy claro y simple. El uso excesivo de colores y animaciones en el formulario puede hacer que tenga un aspecto saturado.<\/p>\n\n\n\n

\u00bfQuieres saber qu\u00e9 tal funcionan tus formularios? Aprende a usar VWO Forms y analiza c\u00f3mo interact\u00faan los visitantes con tus formularios web.<\/p>\n\n\n\n

\n