Crear enlaces de números de teléfono en HTML

Usa un ancla HTML con una URI tel: para que se pueda activar un número de teléfono desde una página web. Al seleccionar el enlace, los visitantes pueden abrir un marcador u otra aplicación de llamadas disponible en su dispositivo; el enlace no realiza la llamada por sí solo. Este patrón es útil en una página de contacto cuando quieres que los visitantes puedan llamar a una empresa.

Cómo funcionan los enlaces a números de teléfono

Un enlace telefónico es un elemento de ancla cuyo atributo href comienza con tel: y contiene el número que se marcará. El texto entre las etiquetas de ancla es la etiqueta visible que se puede seleccionar. El valor de destino y el texto mostrado pueden ser distintos: uno proporciona el número que se marcará y el otro ayuda a los visitantes a reconocer el enlace.

Crear un enlace telefónico en el que se pueda hacer clic

Por ejemplo, este HTML en línea crea un enlace con la etiqueta “Call customer support”: <a href="tel:+1234567890">Call customer support</a>. Sustituye +1234567890 por el número de la empresa en el formato de marcación adecuado y elige un texto que describa a quién o a qué llegará el visitante. La etiqueta en inglés del ejemplo es ilustrativa; si usas este enlace en una página en español, localiza el texto visible.

El siguiente JavaScript independiente guarda como cadena un ancla con la misma estructura. Su etiqueta en inglés, “Call customer support”, también es ilustrativa y debe localizarse si el enlace se usa en una página en español. Puede servir si una aplicación necesita construir el valor HTML mediante código; una página web normal puede usar el ancla directamente.

const phoneLink = '<a href="tel:+1234567890">Call customer support</a>';
console.log(phoneLink);

<a href="tel:+1234567890">Call customer support</a>

Dar formato al número para facilitar su lectura y las llamadas internacionales

Procura que el número de href sea adecuado para las personas que esperas que llamen y para el formato de numeración aplicable. Si recibirás llamadas internacionales, incluye el código de país cuando sea necesario para que el destino no dé lugar a dudas. El código de país no es un requisito universal para todos los públicos ni para todos los contextos de numeración.

La etiqueta visible puede usar espacios, paréntesis o guiones habituales para facilitar la lectura. Por ejemplo, el enlace puede mostrar (234) 567-8901 y usar tel:+12345678901 como valor de href. Los separadores ayudan a leer el número, pero no son obligatorios en el texto visible. Mantén claro y coherente el valor que se puede marcar y la presentación para el lector.

Qué ocurre cuando alguien activa el enlace

Cuando un visitante activa un enlace tel:, el dispositivo o el navegador puede abrir un marcador u otra aplicación de llamadas configurada, con el número listo para usar. Por lo general, el visitante decide si realiza la llamada. En una computadora de escritorio, una aplicación de llamadas puede gestionar el enlace si está configurada; de lo contrario, el comportamiento depende del navegador y del software disponible. No des por hecho que todos los dispositivos abrirán la misma interfaz.

Consejos de accesibilidad y pruebas

Usa un texto descriptivo, como “Llamar al servicio de atención al cliente”, en lugar de una etiqueta imprecisa como “Llamar” cuando el destino necesite contexto. Esto ayuda a quienes recorren los enlaces con tecnología de asistencia y a quienes ven la página sin el texto que los rodea. Asegúrate de que se pueda acceder al enlace con el teclado y de que su estilo visual permita identificarlo como tal.

Comprueba el enlace en los dispositivos, navegadores y aplicaciones de llamadas pertinentes para tu público. Confirma que el número visible sea legible, que href contenga el número previsto y que al activar el enlace se ofrezca la aplicación esperada. Estas comprobaciones ayudan a detectar errores de formato y diferencias de comportamiento entre dispositivos antes de que los visitantes dependan de la página de contacto.

Preguntas frecuentes sobre los enlaces a números de teléfono

¿El número mostrado puede incluir paréntesis o guiones?

Sí. Usa separadores habituales en el texto visible si facilitan la lectura del número. Mantén el destino tel: adecuado para marcar; el texto visible no determina el destino.

¿Funcionan los enlaces telefónicos en los navegadores de escritorio?

Pueden funcionar si el navegador o el sistema operativo tiene configurada una aplicación de llamadas. Si no hay ninguna, quizá la computadora de escritorio no ofrezca una acción útil; comprueba los entornos que usan tus visitantes.

¿Qué debo comprobar si el enlace no funciona?

Revisa que el ancla esté escrita correctamente, que incluya el prefijo tel: y que el número de href sea correcto. Luego activa el enlace en un dispositivo pertinente y comprueba si hay un marcador o una aplicación de llamadas disponible. El comportamiento puede variar según la configuración y el software del dispositivo.

¿Todos los enlaces telefónicos deben incluir un código de país?

Incluye un código de país cuando sea necesario para las personas que llaman y el contexto de numeración al que te diriges, especialmente si podrían llamar desde otro país. Las convenciones de marcación local varían, así que elige un formato que deje claro el destino previsto.