Botones de reserva que funcionan: texto, color y posición
Un botón de reserva invisible es el error más costoso en un sitio de hotel. No un tiempo de carga lento, no fotos pobres, no reseñas faltantes. Un huésped que quiere reservar y no puede ver rápidamente cómo hacerlo vuelve a Booking.com. Esa reserva le cuesta del 15 al 25 por ciento de comisión, y era evitable.
Por qué el botón de reserva tan a menudo se equivoca
La mayoría de los sitios de hotel se construyen con atención a la atmósfera, el texto y las fotos. El botón de reserva se añade después como un detalle técnico posterior. El resultado es un botón que se sienta en la barra de menú, el mismo color que el resto de la navegación, con texto como "Reservar" en una fuente que no destaca.
Los huéspedes no buscan. Escanean. Mueven el ojo por la página buscando algo que reconozcan como "aquí puedo reservar". Si no está allí inmediatamente, no se desplazan más, cierran la pestaña.
Tres cosas determinan si un llamado a la acción (botón que invita a la acción) funciona: el texto, el color y la posición. Todos los tres tienen que ser correctos. El texto perfecto en el lugar equivocado no entrega nada. Un color llamativo con texto vago tampoco.
El texto: qué está en el botón
Esta es el área donde la mayoría de los hoteles ganan más, porque los textos de botón estándar en sitios de hotel son casi universalmente pobres.
| Texto del botón | Por qué funciona (o no) |
|---|---|
| Reservar ahora | Barrera alta, suena final, el huésped aún está orientándose |
| Reservar | Vago, sin urgencia, no ayuda a los indecisos |
| Más información | Sin acción, envía al huésped lejos de la meta |
| Verificar disponibilidad | Barrera baja, se ajusta a la fase de orientación, orientado a la acción |
| Reservar directamente y ahorrar | Funciona solo si realmente ofrece una ventaja sobre la plataforma |
| Ver habitaciones y precios | Invitador, da control al huésped, sin compromiso |
"Verificar disponibilidad" funciona tan bien porque coincide con lo que el huésped está haciendo en ese momento: ver si su hotel está disponible en sus fechas. No pide nada, ofrece algo. Una vez que el huésped está en el módulo de reserva, toma el control.
"Reservar directamente y ahorrar" solo funciona si realmente ofrece algo a cambio. Un descuento del 5 por ciento sin impuesto, una bebida gratis en la llegada, o cancelación flexible que la plataforma no ofrece. Diga "ahorrar" cuando el precio es igual a Booking.com y daña la credibilidad. Ponga la ventaja junto al botón y cómo hacerla creíble está cubierto en confianza y urgencia en su página de reservas.
Evite texto genérico como "Haga clic aquí" o "Ir a la página de reserva". Esos textos no dicen al huésped qué obtiene. Ralentizan la decisión en lugar de acelerarla.
Pruébelo usted mismo
Pídale a alguien que no conoce su sitio que señale el botón de reserva en 5 segundos. Si esa persona duda, su botón no es lo suficientemente bueno.
El color: destacarse sin gritar
El botón de reserva debe ser el único lugar en su página donde aparece el color de énfasis. Si ese color también aparece en su logo, pie de página y subtítulos, ya no es llamativo.
Las reglas son simples:
- Elija un color con suficiente contraste con el fondo. WCAG 2.1 requiere una relación de contraste de al menos 4.5:1 para el texto en un botón. Eso no es una elección estética sino legibilidad.
- Use el color de énfasis solo para el botón de reserva y tal vez un resaltado. No para títulos, no para enlaces en el texto.
- Sitios oscuros: botones claros (blanco, amarillo, naranja). Sitios claros: botones oscuros o brillantes (verde, rojo, azul oscuro).
- Asegúrese de que el texto en el botón sea legible. Texto blanco en un botón amarillo claro no es legible.
El naranja convierte bien en muchos sitios, pero no porque el naranja por sí solo funcione. Convierte porque la mayoría de los sitios de hotel tienen una paleta de colores neutral o fresca, y el naranja como el único color cálido destaca allá.
La posición: sobre la línea de corte y luego de nuevo
Sobre la línea de corte es lo que el visitante ve sin desplazarse. En una pantalla de laptop promedio eso es aproximadamente 600 a 700 píxeles de alto. En móvil menos. Si el botón de reserva solo aparece después de desplazarse, es invisible para una gran parte de sus visitantes.
El botón debe aparecer en tres lugares:
- En la barra de navegación, siempre visible. La navegación pegajosa (que se desplaza junto) mantiene el botón constantemente a la vista. El botón en navegación puede ser un poco más pequeño, pero aún necesita destacarse por color.
- Sobre la línea de corte, en la primera pantalla. No escondido en una esquina, sino central o prominente a la derecha, en o justo debajo de las imágenes de ambiente.
- Después de cada descripción de habitación o sección de precio. El huésped que leyó una habitación que le va bien quiere reservar en ese momento. Si el botón no está a la vista entonces, se desplaza más y pierde el impulso.
En páginas más largas (con múltiples tipos de habitaciones, ofertas de paquetes o arreglos) el botón puede aparecer cuatro o cinco veces. Eso no es spam, eso es diseño reflexivo.
Móvil: más grande de lo que piensa
En móvil nadie hace clic con un cursor, sino con un pulgar. La zona de toque de un pulgar promedio es grande, pero su precisión es baja. Un botón que se ve bien en escritorio a menudo es demasiado pequeño en teléfono o se sienta demasiado cerca de otros botones.
Siga estos mínimos:
- Altura mínima del botón: 48 px
- Ancho mínimo del botón: 120 px, preferiblemente ancho hasta el borde de la pantalla
- Espacio de otros elementos clickeables: al menos 8 px
También verifique si el botón aún es visible en su navegación móvil. En muchos sitios el botón de reserva desaparece en un menú hamburguesa en móvil. Entonces el huésped tiene que tocar dos veces para encontrarlo: una vez para abrir el menú, una en el botón. Cada paso extra cuesta reservas.
Errores comunes seguidos
- Botón del mismo color que la navegación. El huésped no ve un elemento de acción, solo un segundo enlace de menú.
- Texto "Reservar" o "Reservar ahora" sin contexto. Demasiado definitivo para huéspedes aún buscando.
- Botón solo al final de la página. La mitad de sus huéspedes no se desplazan tan lejos.
- En móvil el botón desaparece en el menú hamburguesa. La visibilidad cae bruscamente.
- El color del botón no cambia al pasar. Un botón que cambia al pasar confirma que es clickeable. Sin ese efecto a veces parece un diseño plano.
- Diferentes textos de botón en toda la página. "Reservar ahora" arriba, "Reservar" a mitad de camino, "Verificar disponibilidad" abajo confunde al huésped. Elija un texto y manténgalo.
El error más costoso
Un llamado a la acción vago o invisible no es un problema estético. Es un problema de ingresos. Cada huésped que no ve cómo reservar se va y reserva a través de la plataforma, costándole del 15 al 25 por ciento de comisión.
Prueba A/B en un sitio pequeño
La prueba A/B formal, que muestra dos variantes al mismo tiempo a diferentes visitantes, requiere mucho tráfico. Para la mayoría de sitios pequeños de hoteles eso es miles de visitantes por variante, por variante por separado. Probablemente no llegará allá.
Lo que puede hacer: una prueba secuencial. Use dos semanas de variante A (texto y color de botón actual), luego dos semanas de variante B (texto o color cambiado), y compare el porcentaje de visitantes que hacen clic en el módulo de reserva. No es prueba estadística, pero le da dirección. Si la variante B puntúa consistentemente mejor, manténgala.
Mejore sus posibilidades de un resultado justo cambiando solo una cosa a la vez. Texto o color, nunca ambos en la misma prueba.
El botón es una parte, no la solución
Un buen botón de reserva aumenta sus reservas directas, pero no existe por sí solo. El huésped primero tiene que creer que reservar con usted es más seguro y barato que a través de la plataforma, luego tiene que pasar por un formulario que no lo asuste. Un botón perfecto sobre una página llena de duda entrega poco.
Así que mire su sitio como una cadena. Las fotos y la promesa de precio llevan al huésped a hacer clic, el botón captura ese impulso, el formulario lo completa. Falla un enlace, la reserva aún se filtra a Booking.com. Cambiar el texto del botón de "Verificar disponibilidad" a "Reservar directamente y ahorrar" no ayuda si el huésped se va a mitad de un formulario lento o carece de confianza.
Para abordar toda la cadena en lugar de elementos individuales, comience con optimización de la conversión para su sitio de hotel. Allá ve cómo botón, confianza, formulario y precio juntos establecen su porcentaje de reserva, y qué orden aporta más ganancia.
Lo que puede hacer ahora
Vaya a su propio sitio y verifique tres cosas: ¿Es el botón de reserva visible sin desplazarse? ¿Tiene un color que no aparece en ningún otro lugar de la página? ¿Y tiene texto que invita en lugar de repeler?
Si uno de los tres no es correcto, tiene una mejora concreta que puede hacer hoy.
Quiere profundizar: lea los cinco errores en el 80 por ciento de sitios holandeses de hoteles para el panorama general, o verifique nueve errores en su formulario de reserva para lo que sucede después de que el huésped hace clic en el botón. Quiere revisar su sitio completo para lo que funciona y lo que no, lo que un sitio web de hotel necesita minimalmente lo ayuda. Un resumen de todos los artículos alrededor de reservas directas está en el centro de conversión de sitios web. Calcule qué mejor conversión aporta con la calculadora de ahorro, o déjela implementar a través de construcción de sitios web.
Preguntas frecuentes
¿Qué texto del botón de reserva convierte mejor en un sitio de hotel?
¿Qué color debe tener el botón de reserva?
¿Con qué frecuencia debe aparecer el botón de reserva en una página?
¿Funciona la prueba A/B en un sitio de hotel pequeño?
¿Debe verse diferente el botón en móvil que en escritorio?
¿Es una buena idea una ventana emergente con un botón de reserva?
Mi botón de reserva destaca y funciona bien, pero aún recibo pocas reservas directas. ¿Por qué?
Un consejo concreto en tu bandeja cada mes
Consejos prácticos de marketing y automatización para alojamientos pequeños. Sin charlas de ventas, puedes cancelar cuando quieras.
Tu dirección de correo solo se utiliza para estos correos y nunca se comparte. Puedes desuscribirte de cualquier correo. Consulta la política de privacidad.
