Las ventanas emergentes son controvertidas. Por un lado, ayudan a los propietarios de negocios y a los especialistas en marketing a publicitar, crear listas de correo electrónico e impulsar a los clientes potenciales a realizar acciones específicas.
Por otro lado, los visitantes del sitio web tienden a odiarlos tanto que el inventor de la ventana emergente, Ethan Zuckerman, se disculpó por crearlos.
Las ventanas emergentes interrumpen la experiencia del usuario y pueden ser intrusivas. Pero no tienen que serlo. Las ventanas emergentes pueden agregarse a su sitio web sin estropear la experiencia del usuario cuando se implementan correctamente.
Las mejores prácticas para una estrategia emergente exitosa son:
- Usar ventanas emergentes solo cuando sea necesario: Cada ventana emergente debe tener un propósito claro. Por ejemplo, si su objetivo es reducir las tasas de rebote de su sitio web, use ventanas emergentes para la reorientación en el sitio.
- Uso de ventanas emergentes para mejorar la experiencia del usuario: Haga que las ventanas emergentes sean relevantes e interactivas, aumentando la participación de los visitantes.
- Hacer que su marca de ventanas emergentes sea consistente: Elegir el mismo color y tipografía que su sitio web hace que las ventanas emergentes sean menos discordantes.
- Garantizar el momento adecuado de la ventana emergente: Las ventanas emergentes mal programadas interrumpen la experiencia del usuario. Pruebe variaciones para encontrar el momento más adecuado para activar las ventanas emergentes.
- Incentivos incluidos: Las ventanas emergentes deben agregar valor para justificar las interrupciones en la navegación. Ofrecer descuentos o acceder a otros contenidos.
Los especialistas en marketing continúan usando ventanas emergentes porque funcionan. Le permiten capturar información de los visitantes para crear sus listas de correo electrónico y fomentar las relaciones con el público objetivo. Por ejemplo, las ventanas emergentes en las páginas de productos llaman la atención de los visitantes sobre descuentos o contenido que les puede encantar. Agregar ventanas emergentes con intención de salida ralentiza la velocidad con la que los visitantes abandonan su sitio web.
Tipos de ventanas emergentes
Desarrollar una estrategia emergente lo ayudará a aprovecharlos al máximo. La estrategia ayudará a identificar los objetivos comerciales que espera lograr con las ventanas emergentes, las mejores ventanas emergentes adecuadas para sus necesidades y cómo usarlas de manera efectiva.
Las ventanas emergentes varían según el formato, la ubicación, el momento y el propósito. Estos son algunos tipos comunes de ventanas emergentes:
- Ventanas emergentes de entrada: Las ventanas emergentes de entrada aparecen justo después de que un visitante llega a la página.
- Ventanas emergentes de intención de salida: Las ventanas emergentes de intención de salida se activan cuando los visitantes mueven el puntero del mouse para abandonar su sitio. Son más efectivos para lograr que los visitantes se queden cuando se usan con incentivos como un código de promoción.
- Ventanas emergentes cronometradas: Las ventanas emergentes programadas se activan cuando los visitantes pasan una cierta cantidad de tiempo en una página, lo que significa que los clientes comprometidos las verán.
- Desplazar ventanas emergentes: Se activa cuando los visitantes se desplazan hacia abajo a una parte específica de una página, lo que también puede indicar un compromiso.
- Ventanas emergentes al hacer clic: Las ventanas emergentes al hacer clic se activan cuando los visitantes hacen clic en imágenes o enlaces específicos en su página.
- Hola barras o barras emergentes: Ventanas emergentes que aparecen en la parte superior o inferior de un sitio web como una barra fija. No distraen a los visitantes del sitio web del contenido de la página, pero tampoco reciben tanta atención como otros tipos de ventanas emergentes.
Estas son solo las opciones emergentes estándar que encontrará en Internet. Experimente con los colores, el formato y la ubicación para descubrir las ventanas emergentes que prefieren sus clientes. Use la microcopia para reducir los temores que las personas puedan tener al interactuar con su ventana emergente. Recuerde que los usuarios de dispositivos móviles representan el 50% de todo el tráfico de Internet. Por lo tanto, también deberá crear ventanas emergentes móviles para sus visitantes móviles.
La conclusión es esta: la mejor ventana emergente cumple con sus objetivos comerciales sin comprometer la experiencia de su cliente.
15 ejemplos inspiradores de diseño de ventanas emergentes
No todas las ventanas emergentes son iguales. Las ventanas emergentes exitosas deben estar bien diseñadas para captar la atención de los visitantes y obligarlos a actuar. Los elementos dinámicos como la animación y los efectos rompen la monotonía de las ventanas emergentes estáticas y es más probable que atraigan la participación de los visitantes del sitio. Por lo tanto, obtener su diseño perfecto es fundamental cuando desea crear ventanas emergentes efectivas.
¿Cómo te aseguras de que tus diseños emergentes sean convincentes y no distraigan? La buena noticia es que no tienes que reinventar la rueda. Simplemente puede inspirarse en los diseños emergentes existentes que han demostrado ser efectivos. En ese sentido, aquí hay 15 ejemplos de diseño de ventanas emergentes para inspirar sus campañas de ventanas emergentes.
- neil patel
- delantal azul
- República bananera
- Marina antigua
- Zappos
- Sephora
- Examinador de redes sociales
- varley
- cuerpo franco
- gatitos explosivos
- Bandeja de entrada colectiva
- Ajetreo
- Información inteligente
- Portal clave
- Correo electrónico el lunes
Ejemplo de diseño emergente #1: Neil Patel
Neil Patel es un famoso experto en marketing digital. Ayuda a empresas como GM, Viacom y Amazon a aumentar sus ingresos a través de campañas pagas, SEO, redes sociales y marketing de contenido. Su ventana emergente de intención de salida recopila información de contacto de manera innovadora. En lugar de pedir información de correo electrónico, Neil involucra a los visitantes con un cuestionario de cinco preguntas sobre cómo aumentar el tráfico web.
Luego, se solicita a los visitantes que compartan su información de teléfono y correo electrónico para recibir los resultados del cuestionario. A la mayoría de los clientes no les importa intercambiar sus datos de contacto por los resultados. Ya han invertido tiempo respondiendo el cuestionario y están intrigados por lo que pueden decir los resultados. Además, Neil promete entregar un plan de acción de siete semanas junto con los resultados.
Conclusiones clave:
Las ventanas emergentes basadas en la interacción no solo atraen la atención de los visitantes, sino que también los invitan a interactuar con la ventana emergente y, con suerte, a realizar la acción deseada. Además, ofrecer un incentivo personalizado mejora el rendimiento de sus ventanas emergentes. Necesita una estrategia similar para crear ventanas emergentes efectivas.
Comience a crear su lista de correo electrónico más rápido con GetResponse Free Popup Creator. Viene con toneladas de plantillas de formularios emergentes preconstruidos, más de 30 opciones de orientación y, lo mejor de todo, se integra automáticamente con todas nuestras funciones de marketing por correo electrónico.
Ejemplo de diseño emergente n.º 2: delantal azul
Blue Apron es una empresa de entrega de alimentos que ofrece kits de comida con ingredientes frescos. Este ejemplo emergente de salida de la página de su producto ofrece a los clientes descuentos irresistibles a cambio de un correo electrónico de suscripción. Los clientes tienen la opción de unirse inmediatamente, unirse más tarde o no unirse. Una imagen de una comida deliciosa lleva a casa el mensaje de irresistibilidad.
Otra cosa brillante acerca de este diseño emergente es su simplicidad. La empresa solo pide una dirección de correo electrónico. Nada más. Esto hace que el formulario sea mucho más pequeño, lo que hace que parezca más conveniente para los posibles clientes.
Conclusiones clave:
Esta ventana emergente funciona porque las ofertas atractivas y las imágenes deliciosas son difíciles de ignorar. Además, realiza múltiples tareas entre la conversión de clientes potenciales y la generación de clientes potenciales al brindarles a los clientes la opción de convertir inmediatamente o en una fecha posterior. Además, siga su modelo y trate de mantener su formulario emergente lo más corto posible. No pidas más información de la necesaria.
Ejemplo de diseño emergente #3: Banana Republic
Banana Republic es una empresa de ropa para hombres y mujeres. Esta ventana emergente de entrada ofrece un 15% de descuento a los clientes para su primera compra. Incluso si los clientes aún no están listos para comprar, aún recibirán la oferta al registrarse para obtener una cuenta gratuita. Este tipo de ventana emergente atrae a los nuevos visitantes a actuar y los prepara para realizar más acciones más adelante.
Conclusiones clave:
La efectividad de las ventanas emergentes de entrada como la anterior depende del contenido o mensaje. Ofrezca descuentos para motivar a los posibles compradores a realizar la acción deseada. Estas ventanas emergentes suelen ser exitosas para las empresas de comercio electrónico.
Ejemplo de diseño emergente #4: Old Navy
Esta ventana emergente deslizable de Old Navy aparece al hacer clic en la barra «Ofertas» en la parte inferior de la página web. Aumenta la conversión de ventas al presentar a los compradores ofertas exclusivas y por tiempo limitado. Debido a que la ventana emergente se activa con las acciones intencionales del cliente, es discreta y no agresiva.
Conclusiones clave:
Las ventanas emergentes no tienen que ser intrusivas para ser efectivas. Las ventanas emergentes que aparecen cuando los clientes demuestran la intención del comprador no interfieren con la experiencia del usuario. Además, pueden ser de alta conversión ya que son activados por las acciones del usuario.
Ejemplo de diseño emergente #5: Zappos
Las ventanas emergentes se pueden utilizar para compartir información en tiempo real. La ventana emergente de clic de Zappos agotado es un ejemplo maravilloso.
Cuando los artículos que buscan los clientes no están disponibles, aparece la ventana emergente al hacer clic en la opción de tamaño no disponible. Los clientes tienen dos opciones: pueden dejar su correo electrónico y recibir una notificación por correo electrónico cuando haya existencias, o pueden elegir un producto alternativo.
El diseño emergente del sitio web de Zappos también es un excelente ejemplo de una ventana emergente personalizada. El sistema Zappos utiliza los detalles ingresados por el cliente para recomendar productos apropiados. Ya conoce la talla y el tipo de calzado que busca el cliente. Por lo tanto, recomiendan un tipo y tamaño de zapato similar disponible en stock.
Conclusiones clave:
El hecho de que un producto esté agotado no significa que la venta se pierda para siempre. Las ventanas emergentes agotadas le permiten comunicarse con los clientes, establecer relaciones y mejorar la experiencia del cliente.
Además, sus ventanas emergentes no tienen que hacer una sola cosa. Zappos, por ejemplo, ofrece a sus compradores la opción de proporcionar sus datos de contacto y recibir una notificación cuando el artículo vuelva a estar disponible o comprar otros artículos disponibles.
Ejemplo de diseño emergente #6: Sephora
Esta ventana emergente de Sephora está hecha para la conversión de ventas. Se activa cuando los clientes agregan artículos a su carrito. Es cierto que tiene más cosas en marcha en comparación con otras ventanas emergentes que discutimos anteriormente. Sin embargo, este diseño emergente tiene como objetivo optimizar la experiencia de compra, así como el proceso de pago.
Además, Sephora usa la ventana emergente para la venta cruzada. Puede verlo desde el carrusel en la sección «Creemos que también le encantará». Cuando los visitantes hacen clic en los elementos recomendados, son redirigidos a esas páginas de productos.
Los clientes también reciben un código de envío gratuito a través de la ventana emergente. El objetivo aquí es motivar el pago y reducir el abandono del carrito. Además, las letras rojas del código de envío y los botones de pago se destacan sobre un fondo blanco, llamando la atención de los visitantes.
Conclusiones clave:
No tenga miedo de experimentar con ventanas emergentes detalladas. Sin embargo, hay que hacerlo de forma creativa, como ha hecho Sephora. Estas ventanas emergentes brindan más información, que puede ser efectiva para impulsar las ventas y reducir el abandono del carrito.
Ejemplo de diseño emergente #7: Examinador de redes sociales
El ejemplo de ventana emergente de Social Media Examiner es una ventana emergente con intención de salida que redirige a los usuarios a la página web.
La ventana emergente se encuentra en la página de inicio del evento empresarial Crypto de la compañía y ofrece a los usuarios una muestra del contenido que experimentarán en el evento. El objetivo es convencer a los visitantes primerizos de que se registren en el evento al obtener una vista previa del contenido valioso.
Conclusiones clave:
La reorientación en el sitio es una excelente manera de mantener a los clientes en su sitio. Justo cuando intentan irse, usted los atrae con contenido que puede resultarles interesante. Las tiendas de comercio electrónico pueden usar cupones para invitar a los clientes a seguir comprando.
Consejo profesional: Aprenda a usar cupones de manera efectiva con nuestra guía de estrategia de descuento de comercio electrónico y tome esta práctica hoja de trucos de descuento para mantenerse al día.
Ejemplo de diseño emergente #8: Varley
La ventana emergente simple pero elegante del boletín de noticias de Varley está cronometrada y aparece después de varios segundos. Como una ventana emergente cronometrada, esta estrategia probablemente atraerá a los visitantes del sitio que ya están comprometidos. Además, es probable que el descuento del 10% atraiga la atención de los prospectos.
Esta ventana emergente es simple pero elegante. La forma en que su ventana emergente coincide con el resto del sitio, haciéndola sentir como una extensión de la página en lugar de una intrusión, es un gran ejemplo de cómo implementar una ventana emergente con clase. Además, la microcopia explica el propósito de la recopilación de datos, lo que reduce la ansiedad por compartir correos electrónicos con terceros o recibir correo no deseado. Los clientes saben lo que están recibiendo.
Conclusiones clave:
Las ventanas emergentes se sienten menos discordantes y más como parte de la experiencia de su sitio cuando coinciden con el estilo, el color y la tipografía de su sitio. Añadiendo texto explicando cómo su empresa…