Curso HTML 5.3 Enlaces a correo, teléfono y otros protocolos

Enlaces a correo electrónico (mailto)

El protocolo mailto: permite al usuario abrir su cliente de correo predeterminado con campos precompletados (destinatario, asunto, copia, cuerpo, etc.). Es fundamental url-encodear caracteres especiales (espacios, acentos, saltos de línea).

Ejemplo básico:

Enviar correo a usuario@ejemplo.com

Ejemplo avanzado con parámetros:

Enviar correo con parámetros

Detalles a tener en cuenta:

• Los espacios se codifican como %20.
• Saltos de línea en body como %0A.
• Algunos clientes limitan longitud de la URL.
• Puede funcionar diferente según navegador y cliente de correo.

Enlaces a teléfono (tel)

El protocolo tel: permite iniciar una llamada desde dispositivos con capacidad telefónica (móviles, tablets). No es universal en navegadores de escritorio.

Ejemplo básico:

Llamar al +34 123 456 789

Para marcar una extensión tras la llamada:

Llamar y marcar extensión 1234

• Usar el formato internacional (+CC).
• Comas , ralentizan la marcación; punto y coma ; invoca prompt.
• En iOS existe telprompt: para mostrar confirmación.

Otros protocolos y usos especializados

Enviar SMS
      

Llamar por Skype
      

Ubicación: Madrid
      

Descargar Torrent
      

Abrir lector QR
      

Consideraciones de seguridad y usabilidad

• Los enlaces a protocolos externos pueden no ser válidos si no hay aplicación asociada.
• Evitar inyección de datos dinámicos en href sin sanitizar.
• Usar rel='noopener noreferrer' y target='_blank' al abrir en nueva ventana cuando corresponda.
• Probar en distintos navegadores y dispositivos para garantizar compatibilidad.

Resumen de buenas prácticas

1. Codificar correctamente los parámetros en la URL.
2. Probar cada protocolo en el entorno de uso final.
3. Incluir texto alternativo claro para usuarios y motores de búsqueda.
4. Combinar con atributos ARIA si el enlace realiza acciones especiales.

Con esto dispones de una guía completa para implementar enlaces a correo, teléfono y otros protocolos en HTML5. ¡A practicar!