Enrique J. Ros

Llamada al hacer clic sobre el número de teléfono

Es difícil erradicar viejas costumbres: cosas que se hacen de una forma porque estamos acostumbrados a ello y no nos damos cuenta, aunque sea algo obvio, de que hay una forma mejor de hacerlo. Pero mejorar implica replantearse estas costumbres.

Esto viene a cuento de que aún hoy, sabiendo que hace ya años que la navegación móvil superó en usuarios a los que lo hacen en ordenadores (al menos en España), sigo viendo que muchas webs, cuando ponen el número de teléfono, no lo hacen de forma que al hacer clic sobre él se lleve al usuario directamente a la llamada.

Por qué tienes que hacer clicable el número de teléfono

Estamos en la era de la usabilidad. Olvídate de hacer o tener una web llena de efectos visuales, eso está sobrevalorado: lo que realmente necesitas es tener una web usable. Hasta Google, desde hace ya tiempo, está dando preferencia a la usabilidad (a través de las métricas de respuesta de usuario) frente a otros factores de posicionamiento.

Y si hablamos de dispositivos móviles, ya no te digo nada: el efecto de la usabilidad se multiplica por mil. Cualquier ayuda extra cuenta más cuando estás intentando hacer las cosas en una pantalla de cuatro pulgadas y con un teclado diminuto.

¿Cuál es el objetivo de tu web? Aquí sólo hay una respuesta correcta: convertir (vale, si tu web es una tienda online admito también vender como correcta, porque esa es la conversión típica en un ecommerce).

Las conversiones y el número de teléfono en una web

Si tu web es una web corporativa o de marca personal, tu conversión es que te contacten, y el teléfono suele ser el medio preferido por el cliente (y sin embargo yo lo tengo prácticamente desterrado de mi vida).

Pero es que además, si lo que tienes es un comercio electrónico, el teléfono también puede influir enormemente en la tasa de conversión como forma inmediata que es de resolución de dudas preventa.

Y eso está claro, porque la mayoría de gestores de webs se afanan (correctamente) en que esté siempre bien visible desde cualquier lugar de la web. Pero, entonces, ¿por qué no facilitar su uso?

El número de teléfono en una web… desde móvil

Te pinto ahora una situación bastante rocambolesca y sin embargo demasiado habitual: estoy visitando una web desde un móvil, es decir, desde un aparato que sirve básicamente (o servía, en sus orígenes) para realizar llamadas telefónicas.

Quiero entonces ponerme en contacto por teléfono con los responsables de la web y, ¿qué tengo que hacer? Memorizar o anotar el número de teléfono, salir del navegador, irme a la aplicación de marcado y marcar manualmente el número.

¿Estamos locos o qué?

Número de teléfono clicable

Seamos realistas: si un usuario se ve en la situación anterior es probable que desista de llamarte, máxime teniendo en cuenta que hay decenas de otras empresas/profesionales/tiendas ahí fuera esperando para tenerle como cliente.

¿Qué hay que hacer? Pues ponérselo fácil. Si en lugar de todo eso, el usuario sólo tiene que poner el dedo sobre el número de teléfono y pinchar en un botón que dice Llámanos para marcar tu número, ¿no mejorará eso la tasa de conversión?

Pues nada, que hay webs a patadas que aún no lo ven… Y no creas que hablo sólo de webs de pequeñas empresas o tiendas con pocos pedidos: grandes empresas e instituciones también cometen este error imperdonable.

Hacer el número de teléfono lleve a la llamada con un enlace o un botón

Y si por lo menos fuera algo difícil de hacer… Pero es que es más sencillo que el mecanismo de un chupete: basta con usar el operador “tel” en la llamada al enlace. Por ejemplo:

Teléfono: 600 000 000

Hecho. De esta forma ese número de teléfono es un enlace de tal forma que, cuando el usuario pone el dedo sobre él, es llevado directamente a la marcación con el número ya marcado, a falta sólo de pulsar la tecla de llamada. Ese usuario te va a llamar, seguro.

No olvides, si tu web está dirigida a un público internacional, añadir el prefijo de país. Por ejemplo:

Teléfono: 600 000 000

Y si quieres ponerlo como un botón basta con añadirle la clase CSS correspondiente, tu plantilla ya se ocupará de darle el estilo que haya establecido específicamente para los botones:

¡Llámanos!

Si quieres un ejemplo práctico, sólo tienes que pulsar en este botón (desde móvil):

¡Llámanos!

No confundir a los usuarios de ordenador

Si lo que quieres es rizar el rizo, puedes hacer que esto no sea visible a los usuarios de ordenador, ya que si un usuario hiciera click desde un escritorio o portátil vería algo así (puedes comprobarlo pulsando en el botón del ejemplo anterior desde un ordenador):

Hay varias formas de hacerlo, pero quizá lo más fácil y rápido es aplicarle una clase CSS específica y, mediante una media query (haciendo uso por ejemplo del ancho de pantalla), hacer que ese enlace sea visible sólo desde dispositivos móviles.

Por si esto te suena a chino, ahí va un ejemplo:

@media screen and (min-width: 800px) {
     .numero-telefono {
          display:none!important;
     }
}

Y listo.

Salir de la versión móvil