Curso de HTML
Construye la estructura de la web.
Aprende cada etiqueta con ejemplos interactivos y crea proyectos reales.
La etiqueta <audio> reproduce sonido directamente en el navegador, sin plugins ni reproductores externos. Sus reglas son casi idénticas a las de <video>.
Explicación
La etiqueta <audio> reproduce sonido sin necesidad de plugins externos. Estos son sus atributos más comunes:
controlsMuestra los controles nativos del navegador (play, pausa, volumen). Sin este atributo, el usuario no puede controlar el audio.
<source>Etiqueta hija que indica un archivo de audio. Puedes repetirla con distintos formatos como fallback.
autoplayReproduce el audio automáticamente al cargar la página. La mayoría de navegadores lo bloquean, sobre todo si tiene sonido.
loopRepite el audio en bucle en cuanto termina.
Contenido de fallbackEl texto dentro de <audio>...</audio> solo se muestra si el navegador no soporta la etiqueta.
Reto rápido
A este audio le falta el atributo controls, así que el usuario no puede reproducirlo ni pausarlo. Agrégaselo.
En esta lección
- Ejemplo interactivo
- Explicación de cada etiqueta
- Cuándo usarlo
- Errores comunes
Consejo
Usa <source> en vez de un src directo en <audio> cuando quieras ofrecer más de un formato (mp3, ogg): el navegador probará cada uno hasta encontrar el que soporte.
Dato extra
Los navegadores bloquean el autoplay con sonido para evitar que las páginas reproduzcan audio sin que el usuario lo pida.
Error común
Olvidar el atributo controls: el audio existe (e incluso podría reproducirse con autoplay), pero el usuario no tiene forma de pausarlo ni de saber que está ahí.
Siguiente paso
Ya sabes reproducir audio. El video funciona de forma casi idéntica, pero con una regla extra sobre el autoplay.
Ir a la siguiente lección