Piensa en todas las veces que te suscribiste a diferentes cosas en tu vida. ¿Alguna vez descargaste Evernote? ¿Dropbox? ¿Spotify? Tal vez incluso te diste de alta en curso de General Assembly.

Es posible que todas estas suscripciones hayan sido el resultado de una llamada a la acción, o CTA, eficaz. Es muy importante guiar a los visitantes a través del recorrido del comprador con CTA creadas estratégicamente. Piénsalo: si el texto o el diseño de las CTA no te hubieran llamado la atención o guiado con tanta eficacia a través del proceso de registro, quizá hoy no usarías tantas aplicaciones y sitios web.

<< Descarga gratis la guía y descubre cómo diseñar y optimizar páginas de  destino >> 

 

Ejemplos de call to action en marketing

Para ayudarte a identificar qué es lo que mejor funciona, creamos una lista de 31 ejemplos de CTA increíbles.

Veamos ejemplos para cada tipo de call to action:

1. Evernote

Botón de CTA: Registrarse (Sign Up)

«Acuérdate de todo» (Remember Everything). Al acceder a la página y ver este mensaje, los visitantes lo entienden de inmediato. El diseño del sitio web de Evernote hace que a los usuarios les resulte muy fácil identificar cuáles son los beneficios de usar la aplicación y cómo registrarse. Además, los botones de CTA principales y secundarios, al igual que el título y el logotipo de Evernote, son del mismo color verde, lo que permite que se destaquen en la página.

Call to action de Evernote

2. Dropbox

Botón de CTA: Registrarse gratis (Sign up for free)

Desde siempre, Dropbox ofrece un diseño simple con mucho espacio negativo. Incluso las imágenes de la página principal son sutiles y sencillas.

Gracias a ello, el CTA «Registrarse gratis» se destaca del resto de los elementos de la página. Como la llamada a la acción y el logotipo de Dropbox son del mismo color, los visitantes pueden reconocer fácilmente el mensaje del CTA: «regístrese gratis en Dropbox». Este es un gran ejemplo de una llamada a la acción eficaz.

Call to action de Dropbox

3. OfficeVibe

Botón de CTA: Suscribirse (Subscribe)

Esta llamada a la acción deslizante de OfficeVibe me pareció muy interesante. Mientras el visitante lee la publicación, un banner se desliza desde la parte inferior de la página con una CTA que lo invita a suscribirse a su blog. ¿Y qué es lo mejor? El texto del banner le promete al visitante que, tras suscribirse, obtendrá consejos sobre cómo mejorar sus capacidades de gestión (que era exactamente el tema de la publicación original). En otras palabras, la oferta es interesante y muy relevante para ese visitante.

Call to action de OfficeVibe

Además, este tipo de CTA destaca por no molestar ni interrumpir a los visitantes. Estas CTA deslizantes ofrecen una experiencia más agradable, porque proporcionan más información, pero permiten al usuario continuar leyendo. 

4. Netflix

Botón de CTA: Prueba un mes gratis (Join Free for a Month)

¿Sabes cuál es uno de los grandes temores de los usuarios antes de comprometerse con una suscripción? Que el proceso de cancelación de la suscripción sea demasiado complicado si deciden no conservarla. Netflix elimina por completo esa preocupación con el texto «Cancela cuando quieras» (Cancel anytime). Me atrevería a decir que solo con esta garantía aumentaron las suscripciones. Como podrás observar, una vez más, las llamadas a la acción principales y secundarias son del mismo color rojo que el logotipo de Netflix.

Call to action de Netflix

5. Square

Botón de CTA: Comenzar (Get Started)

Para lograr un diseño eficaz, no debes centrarte únicamente en el botón: también son muy importantes otros elementos, como el color de fondo, las imágenes y el texto que acompañan a las CTA.

El equipo de Square tiene en cuenta estos componentes de diseño adicionales e incluye una única imagen con una CTA simple para sugerir que su producto es fácil de usar. Si observas detenidamente, el color de la tarjeta de crédito de la imagen coincide con el del botón de la CTA, lo que le permite al visitante asociarla con lo que encontrará si decide hacer clic.

Call to action de Square

6. Prezi

Botón de CTA: Prueba Prezi (Give Prezi a try)

El equipo de Prezi también adopta un diseño minimalista en su sitio web. Al margen del dinosaurio verde y el café marrón oscuro, el único color que acompaña al diseño predominantemente en blanco y negro es el azul brillante: el mismo de su logotipo principal. Ese color se ubica estratégicamente en la página principal: en la llamada a la acción principal, «Prueba Prezi», y en la secundaria «Comencemos». Ambas llevan a los usuarios a la misma página de precios.

Call to action de Prezi

7. Full Bundle

Botón de CTA: Nuestro trabajo (Our Work)

Full Bundle es otra empresa que usa el espacio negativo para destacar su CTA principal. El botón «Nuestro trabajo» sobresale en el fondo oscuro. El texto de la CTA también fue estratégicamente elegido. Dado que el principal objetivo de la empresa es desarrollar la presencia en línea de sus clientes, es importante que muestren su trabajo (en definitiva, esto es lo que la mayoría de los visitantes quieren ver).

Call to action de Full Bundle

8. Panthera

Botón de CTA: Unirse (Join)

El equipo de Panthera intenta atraer usuarios que se preocupen por los felinos salvajes de todo el mundo y quieran unirse a una organización afín. Para dirigirse específicamente a los amantes de este tipo de animales, hacen un uso muy eficaz del lenguaje con frases como «Únase a nuestro orgullo hoy» (Join the pride today). La página en sí es muy sencilla: un formulario en la página con dos campos simples y un botón que le pide al visitante, nuevamente, que se una a la causa.

Call to action de Panthera

CTA con frases atractivas

9. Huemor

Frase de CTA: Iniciar. No presionar. (Launch. Do Not Press).

Si accedes a un sitio web y ves la llamada a la acción «Iniciar», junto a «No presionar», ¿qué harías? Seamos honestos: no te aguantas las ganas de hacerlo. Huemor usa una psicología inversa inofensiva, divertida y totalmente adecuada para la voz de la marca.

Call to action de Huemor

10. Aquaspresso

Frase de CTA: Recibir ofertas del día (Send Me Specials Now!)

El principal objetivo de una llamada a la acción es que los visitantes del sitio sigan un camino determinado (y las mejores lo hacen de una manera útil para los usuarios). La empresa de café Aquaspresso logró ese equilibrio con su llamada a la acción emergente en la página principal del blog.

En este caso, la acción deseada es que los lectores del blog vean sus productos y, en el mejor de los casos, hagan una compra. Podrían haber usado distintas opciones, como una CTA que motive a los visitantes («Explore nuestros productos más populares») u otra llamada a la acción más directa. Sin embargo, eligieron una alternativa práctica y sutil: a cambio de su dirección de correo electrónico, los lectores del blog reciben las ofertas especiales del día.

Aclarar que las ofertas especiales son válidas solo durante el día es un excelente ejemplo de una táctica psicológica conocida como escasez, que nos hace valorar más las cosas si sabemos que hay una cantidad limitada. El temor de que las ofertas especiales de hoy sean mejores que las de mañana puede motivar a los usuarios a completar el formulario y hacer la compra de inmediato.

Call to action de Aquaspresso

11. QuickSprout

Frase de CTA: ¿Está seguro de que su SEO es eficaz? Escriba su URL para averiguarlo. (Are you doing your SEO wrong? Enter your URL to find out)

Nadie quiere estar haciendo las cosas mal. Por eso, un botón deslizante como el de QuickSprout es irresistible para los visitantes. Al leer esta pregunta, el lector duda. Descubrirlo parece fácil: solo tiene que escribir su URL. Usar este tipo de frases marca la diferencia a la hora de atraer a los usuarios para que hagan clic.

Además, incluir una CTA deslizante en el medio de la publicación del blog es una excelente táctica para llamar la atención de los lectores antes de que abandonen la página. Aunque muchos blogs incluyen la llamada a la acción en la parte inferior, debajo de cada publicación, los estudios demuestran que la mayoría de los lectores solo lee un 60% del artículo.

Call to action de QuickSpout

12. Grey Goose

Frase de CTA: Descubra un cóctel perfecto para usted (Discover a cocktail tailored to your taste)

Esta es una CTA divertida y única que logrará que los visitantes hagan clic. En la página principal, los visitantes esperan encontrar una llamada a la acción que los lleve a la página de productos o los comunicados de prensa. Por eso, el texto «Descubra un cóctel perfecto para usted» es una sorpresa agradable. A todos nos encanta la personalización y esta CTA tiene ese toque individual. Además, el visitante sabe qué esperar, ya que el botón de reproducción que acompaña al texto es un indicio de que, cuando se haga clic, aparecerá un video.

Call to action de Grey Goose

13. Treehouse

Frase de CTA: Reclame su prueba gratuita (Claim Your Free Trial)

Muchos sitios web de empresas ofrecen a los usuarios una prueba gratuita. Sin embargo, la CTA de Treehouse no solo ofrece iniciar esta prueba, sino que invita a reclamarla.

La diferencia en la elección de palabras puede parecer trivial, pero resulta mucho más personal. Además, la palabra en inglés «claim» da una sensación de urgencia, como si esa opción no fuese a estar disponible más adelante.

Call to action de Treehouse

14. OKCupid

Frase de CTA: Continuar (Continue)

A simple vista, la llamada a la acción de OKCupid no parece demasiado excepcional, pero la diferencia está en los pequeños detalles.

El botón verde brillante se destaca de manera eficaz en el fondo azul oscuro. Además, dice «Continuar». Esta sencillez sugiere un proceso de registro breve e informal. El CTA transforma un formulario aburrido o intimidante en un juego divertido. Y todo, gracias al texto.

Call to action de OKCupid

15. Blogging.org

Frase de CTA: Cuenta regresiva

No hay nada como el sonido de fondo de las agujas del reloj para lograr que un usuario realice la acción deseada. Tras un momento breve en la página principal de blogging.org, los visitantes nuevos reciben la bienvenida al sitio con una llamada a la acción emergente de una oferta por tiempo limitado y un temporizador con una cuenta regresiva de 2 minutos.

Al igual que el ejemplo de Aquaspresso (número 10), este es un uso clásico de la táctica psicológica conocida como escasez, que nos hace valorar más las cosas que creemos limitadas. Limitar el tiempo que tiene el visitante para completar un formulario hace que quiera completarlo de inmediato y obtener la oferta mientras pueda.

¿Quieres saber qué pasa cuando se acaba el tiempo? Aunque parezca una broma, nada. Cuando la cuenta regresiva llega a cero, la CTA emergente permanece en la página.

Call to action de Blogging

16. IMPACT Branding & Design

Frase de CTA: Lo que hacemos (What We Do)

Si no se cuida la formulación, las CTA pueden resultar agresivas y demasiado centradas en vender. Me encanta el enfoque educativo de IMPACT, que desafía a los visitantes a descubrir qué hace la empresa antes de empujarlos a realizar cualquier otra acción. Esta CTA parece genial, porque ni siquiera usa un verbo de acción para motivar a los usuarios a hacer clic.

Call to action de IMPACT

17. EPIC

Frase de CTA: Empecemos un proyecto nuevo juntos (Let's start a new project together)

El equipo de la agencia EPIC usa la página principal básicamente para mostrar su trabajo. Cuando accedes a la página, puedes ver en un carrusel de videos animados de algunos de los trabajos que han hecho para sus clientes. Si bien los usuarios pueden hacer clic en muchos otros lugares, incluidos los sitios web de sus clientes, la llamada a la acción principal se destaca y contrasta con el video que se reproduce en segundo plano.

El lenguaje amigable e inclusivo de «Empecemos un proyecto nuevo juntos» es atractivo y sugiere a quienes buscan un socio creativo que el equipo de EPIC es una excelente opción.

Call to action de la agencia EPIC

18. Brooks Running

Frase de CTA: Avísenme cuando esté disponible (Find out when we have more)

¿Cuántas veces estuviste buscando desesperadamente un producto que te encanta hasta descubrir que estaba agotado? Esta situación tampoco es ideal para el vendedor. Pero el hecho de que se haya quedado sin stock no significa que deba dejar de promocionarlo.

Brooks Running utiliza una llamada a la acción ingeniosa para garantizar que sus clientes no abandonen su sitio web solo porque su calzado favorito está agotado. En la siguiente captura de pantalla, puedes ver cómo Brooks promociona una zapatilla impresionante con la CTA «Avísenme cuando esté disponible». Lo mejor de este ejemplo es cómo convierte una mala noticia en una oportunidad para retener a los clientes. Sin este botón, los clientes de Brooks probablemente se olvidarían de ese producto y lo buscarían en otra tienda.

Al hacer clic, el usuario accede a una página con un código simple para enviar un mensaje a la empresa y recibir una alerta automática cuando la zapatilla vuelva a estar disponible.

Call to action de Brooks para disponibilidad de productos

19. Condado de Humboldt

Frase de CTA: Descubra la magia (Follow the Magic)

El sitio web del condado de Humboldt es magnífico. Recibe a los visitantes con un video en pantalla completa con imágenes absolutamente hermosas. Sin embargo, lo que más me gusta es la ingeniosa CTA de la parte inferior, con la imagen de un conejo y las palabras «Descubra la magia».

Complementa a la perfección la sensación de fantasía de las fotografías y te hace sentir que estás a punto de entrar en un cuento de hadas.

Call to action de Humboldt

Además, cuando el visitante hace clic en la CTA, el sitio web pasa a una narrativa del tipo «elige tu propia aventura». Así, el equipo del condado de Humboldt motiva a los usuarios a seguir un recorrido muy divertido que empieza con esa CTA y pasar más tiempo en el sitio.

Call to action de Humbolt

Múltiples CTA en una página

20. Uber

Botones de CTA: Regístrate para conducir (Sign up to drive) | Regístrate para viajar (Start riding with Uber)

Uber intenta atraer a dos tipos de visitantes muy diferentes para que se registren en su web: conductores y clientes. Aunque ambos buscan cosas totalmente diferentes, las necesidades específicas de cada uno se combinan a la perfección en el video que se reproduce en segundo plano. En él, se muestra a los conductores y los usuarios de Uber pasando un momento agradable en diferentes lugares del mundo.

También es genial el texto tan directo de la llamada a la acción en la parte superior, «Gana dinero conduciendo» (Make money driving your car). Más claro, imposible.

Call to action de Uber

21. Spotify

Botones de CTA: Hazte Premium (Go Premium) | Obtén Spotify gratis (Play Free)

Al acceder a la página principal de Spotify, queda bastante claro que su objetivo principal es atraer clientes que estén dispuestos a pagar por una cuenta Premium; la CTA para que los usuarios se registren gratis es totalmente secundaria.

No solo el título delata esta intención, sino que también lo hacen los colores de los botones. La CTA «Hazte Premium» es de color verde lima y se destaca en la página, mientras que «Obtén Spotify gratis» es blanco y se mezcla con el resto del texto. Este contraste hace que los usuarios centren su atención en la CTA de la cuenta Premium.

Call to action de Spotify

22. Ugmonk

Botones de CTA: Mándame cupones (Send me the coupons) | No me interesa (I'm not interested)

Las CTA de salida, también conocidas como ventanas emergentes en intento de salida, son distintas de los pop-ups habituales. Monitorizan el comportamiento de los usuarios y solo aparecen cuando detectan que están a punto de abandonar el sitio web. Como se muestran en el momento justo, estas ventanas son una excelente estrategia para llamar la atención del usuario y ofrecerle una razón para quedarse.

Ugmonk incluye una CTA de salida excepcional con dos opciones para los visitantes antes de que abandonen el sitio web definitivamente. En primer lugar, ofrece un 15% de descuento en sus productos. Luego, presenta dos opciones: «Sí. Quiero recibir los cupones» y «No, gracias. No me interesa». Es muy útil que cada CTA aclare lo que realmente significan «Sí» y «No». Además, no usan un lenguaje para generar culpa, como «No, gracias. Odio la naturaleza» (seguro que alguna vez habrás visto algo por el estilo). Por último, observa que el color del botón «Sí» es mucho más brillante y atractivo que el de la otra opción.

Call to action de Ugmonk

23. Pinterest

Botones de CTA: Continuar con Facebook (Continue with Facebook) | Registrarse (Sign Up)

¿Quieres registrarte en Pinterest? Tienes dos opciones: usar tu cuenta de Facebook o tu cuenta de correo electrónico. La intención de Pinterest es que los usuarios se registren con su cuenta de Facebook, si tienen una. ¿Cómo lo sé? Estéticamente: porque la CTA azul de Facebook es lo primero que el usuario ve y es mucho más prominente, colorida y fácil de distinguir gracias al logotipo y el color de la marca. Lógicamente, lo sé porque si el usuario inicia sesión a través de Facebook, Pinterest puede extraer los datos de la API de Facebook y obtener más información sobre el visitante que si inicia sesión con su dirección de correo electrónico.

Aunque esta página de inicio está optimizada para atraer usuarios nuevos, en la parte superior derecha verás una CTA muy sutil para iniciar sesión en Pinterest si ya tienes una cuenta.

Call to action de Pinterest

24. Madewell

Botones de CTA: Llévame allí (Take me there) | ¿Qué más hay? (What's next?)

La web de Madewell (propiedad de J.Crew) siempre ha tenido un diseño memorable, lo que lo diferencia de otros sitios de comercio electrónico. Y la manera en que usan CTA en la página principal no es ninguna excepción.

Cuando el usuario accede por primera vez a la página, ve el título «Estoy buscando...» seguido de una categoría, como «Ropa para viajar a cualquier parte». Debajo, tiene dos opciones: «Sí, llévame allí» o «Hmm... ¿qué más hay?». El usuario puede elegir entre estas dos opciones y explorar la ropa adecuada para viajar o pasar al siguiente tipo de ropa. Allí puede decidir nuevamente qué quiere hacer.

Convertir el sitio web en una clase de juego es una manera excelente de hacerlo interesante para aquellos usuarios que llegan sin una idea clara de lo que buscan.

Call to action de Madewell

25. Instagram

Botones de CTA: Descárgalo en el App Store (Download on the App Store) | Disponible en Google Play (Get it on Google Play)

Instagram es una aplicación que se usa principalmente en dispositivos móviles. Por eso, su sitio web incluye dos CTA de color negro para descargarla: una desde el App Store de Apple y otra desde Google Play. Estas CTA son iguales porque lo importante es que se haga la descarga y no desde dónde. Si el visitante ya tiene Instagram, puede hacer clic directamente en la CTA «Iniciar sesión».

Call to action de Instagram

26. Barkbox

Botones de CTA: Comenzar (Get Started) | Regalar (Give a Gift)

Las dos CTA en la página principal de Barkbox demuestran que conocen a sus clientes. Si bien muchos de los usuarios que visitan el sitio quieren registrarse, muchos otros quieren regalar Barkbox. Para que todos puedan lograr su objetivo de compra fácilmente, el equipo de Barkbox incluye dos botones del mismo tamaño: «Comenzar» y «Regalar».

Además, hay una CTA emergente adorable a la derecha que pide a los usuarios que dejen un mensaje si lo desean. Tras hacer clic, aparece un pequeño cuadro de diálogo con el siguiente mensaje: «¡Guau! Nos fuimos al parque y no estamos en línea. Déjanos un mensaje y te ladraremos a la vuelta». Si eso no es encantador, no sé qué lo es.

Call to action de Barkbox

27. t.c. pharma

Botones de CTA: Más información (Find out more) | Ver productos (View products)

Resulta que Red Bull no es su propia empresa matriz: es propiedad de t.c. pharma, una empresa tailandesa que elabora populares bebidas energéticas y electrolíticas, además de bebidas y refrigerios funcionales.

En la página principal se incluyen dos botones de igual tamaño («Más información» y «Ver productos»), pero está claro por el color amarillo brillante del primer botón que prefieren dirigir a los visitantes a «Más información».

Call to action de t.c. pharma

28. General Assembly

Botones de CTA: Ver cursos de tiempo completo (View Full-Time Courses) | Suscribirse (Subscribe)

A medida que el usuario se desplaza por el sitio web de General Assembly, verá llamadas a la acción de diversos cursos que pueden interesarle. En este caso, me gustaría señalar la CTA que se desliza desde la parte inferior mientras el visitante explora la página, que tiene como objetivo que el usuario se suscriba a las novedades por correo electrónico.

Aunque podría parecer una CTA secundaria, debido a su ubicación y diseño, creo que, en realidad, es la CTA principal, ya que es mucho más colorida y fácil de distinguir que los botones de las clases individuales. Cuando crees tus propias CTA, intenta usar colores intensos, incluso algunos que contrasten con el estilo tradicional de tu sitio web. Así, podrás comprobar si son eficaces para llamar la atención de la audiencia.

Call to action de General Assembly

29. charity: water

Botones de CTA: Donar con tarjeta de crédito (Give by Credit Card) | Donar con PayPal (Give by PayPal)

El objetivo principal de charity: water es que los visitantes donen dinero para el abastecimiento de agua potable, pero no pueden asumir que todos quieren hacerlo de la misma manera.

Las CTA de su página principal adoptan una estrategia realmente única para ofrecer diferentes métodos de pago: se completa automáticamente un formulario de una sola línea con $60 y se incluyen dos botones de llamada a la acción igualmente importantes para pagar con tarjeta de crédito o PayPal. Como puedes ver, ambos botones tienen el mismo diseño y tamaño. Esto se debe a que, seguramente, a charity: water no le importa cómo se hace la donación, siempre y cuando se haga.

Call to action de charity: water

30. Hipmunk

Botones de CTA: Vuelos (Flights) | Hoteles (Hotels) | Vehículos (Cars) | Paquetes (Packages)

Cuando aterrizas en el sitio web de Hipmunk, la opción principal es buscar vuelos. Sin embargo, puedes elegir entre 4 pestañas: vuelos, hoteles, autos y paquetes.

Cuando haces clic en una de estas opciones, el formulario cambia para que puedas completar más información. Para que estés 100% seguro de lo que estás buscando, Hipmunk incluye una CTA de color naranja brillante en el extremo derecho del formulario. En esta llamada a la acción, podrás distinguir fácilmente un avión en el botón de búsqueda. Así, sabrás que estás buscando vuelos y no hoteles. Si accedes a la pestaña de hoteles, el avión se convertirá en un hotel. Lo mismo ocurre con los vehículos de alquiler y los paquetes.

Call to action para reservar vuelos y hoteles en Hipmunk

31. MakeMyPersona

Botones de CTA: Obtener la plantilla (Grab the template!) | No, gracias (No thanks)

Este es otro excelente ejemplo de una ventana emergente con múltiples llamadas a la acción. Sin embargo, en este caso, notarás que el tamaño, el color y el diseño de las dos opciones son muy diferentes entre sí. El equipo de MakeMyPersona creó la llamada a la acción «Obtener la plantilla» de modo que sea mucho más interesante y atractiva que «No, gracias. Estoy bien por ahora», que ni siquiera parece un botón.

Además, me encanta que la opción «No» use un lenguaje cortés. Las empresas que no pretenden generar culpa en los usuarios que no están interesados me resultan mucho más agradables.

Call to action para descargar plantilla de MakeMyPersona

¡Eso es todo! Espero que hayas entendido la importancia que tienen los pequeños detalles en las llamadas a la acción.

Nota: no tenemos manera de saber si todos estos ejemplos te ayudarán a alcanzar el éxito sistemáticamente, pero sí puedo asegurar que van en la misma línea que nuestras buenas prácticas. Si decides usar estas llamadas a la acción en tu sitio web, recuerda que debes probarlas para comprobar si funcionan con tu audiencia.

Si lo que buscas es inspiración para el diseño de tus CTA, consulta algunos de nuestros ejemplos preferidos de llamadas a la acción de HubSpot.

New Call-to-action

 
 New Call-to-action

Publicado originalmente en junio 10 2019, actualizado junio 10 2019

Topics:

Diseño Web