HTML5 ofrece un estándar para la reproducción de archivos de audio.
HTML5 de audio es un tema de la especificación de HTML 5, la incorporación de entrada de audio, reproducción y síntesis, así como el habla en texto, en el navegador.
De audio en la Web
Antes de HTML5, no había ninguna norma para la reproducción de archivos de audio en una página web.
Antes de HTML5, archivos de audio sólo podían ser jugados con un plug-in (like flash) .
El HTML5 <audio> elemento especifica una forma estándar de audio para incrustar en una página web.
Soporte del navegador
Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con el <audio> elemento.
| Elemento | |||||
|---|---|---|---|---|---|
| <audio> | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
El HTML <audio> Element
Para reproducir un archivo de audio en formato HTML, utilice el <audio> elemento:
Ejemplo
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio> Inténtalo tú mismo " El elemento <audio> representa un sonido, o un flujo de audio. Se utiliza comúnmente para reproducir un archivo de audio en una página web, que muestra un widget de interfaz gráfica de usuario con controles de reproducción / pausa / volumen.
El elemento <audio> tiene los siguientes atributos:
atributos globales (tecla de acceso; clase; contenteditable; ContextMenu; dir; arrastrable; dropzone; escondido; id; lang; corrección ortográfica; estilo; tabIndex; título; translate)
autoplay = "reproducción automática" o "" (cadena vacía) o vacío Indica al agente de usuario para iniciar automáticamente la reproducción del flujo de audio tan pronto como pueda hacerlo sin parar.
precarga = "ninguno" o "metadatos" o "auto" o "" (cadena vacía) o vacío Representa una pista para la User-Agent sobre si descargan optimista del flujo de audio en sí o sus metadatos se considera que vale la pena.
"Ninguno": pistas para el User-Agent que el usuario no se espera que necesita el flujo de audio, o que minimiza el tráfico innecesario es deseable.
"Metadatos": pistas para el User-Agent que el usuario no se espera que necesita el flujo de audio, sino que ir a buscar sus metadatos (duración, etc.) es deseable.
"Auto": pistas para el User-Agent que con optimismo la descarga de todo el flujo de audio se considera deseable.
controles = "controles" o "" (cadena vacía) o vacío instruye al usuario-Agent para exponer una interfaz de usuario para controlar la reproducción de la corriente de audio.
loop = "bucle" o "" (cadena vacía) o vacío Indica al agente de usuario a buscar de nuevo al comienzo del flujo de audio al llegar a la final. MediaGroup = Indica a la cadena de agente de usuario para vincular varios vídeos y / o flujos de audio juntos.
= silenciado o "" (cadena vacía) "silenciado" o vacío representa el estado predeterminado del flujo de audio, lo que podría anular las preferencias del usuario. src = no vacío [URL] potencialmente rodeado por espacios La URL para la secuencia de audio.
HTML Audio - ¿Cómo funciona?
Los controls atribuyen añade controles de audio, como reproducción, pausa y volumen.
Texto entre el <audio> y </audio> etiquetas se mostrará en los navegadores que no soportan el <audio> elemento.
Múltiples <source> elementos pueden enlazar a diferentes archivos de audio. El navegador usará el primer formato reconocido.
HTML audio - Soporte para el navegador
Actualmente, hay 3 formatos de archivo compatibles para la <audio> elemento: MP3, WAV y OGG:
| Navegador | MP3 | wav | Ogg |
|---|---|---|---|
| Internet Explorer | YES | NO | NO |
| Chrome | YES | YES | YES |
| Firefox | YES | YES | YES |
| Safari | YES | YES | NO |
| Opera | YES | YES | YES |
HTML Audio - Tipos de medios
| Formato de archivo | Tipo de medio |
|---|---|
| MP3 | audio/mpeg |
| Ogg | audio/ogg |
| Wav | audio/wav |
HTML Audio - métodos, propiedades y eventos
HTML5 define métodos DOM, propiedades y eventos para el <audio> elemento.
Esto le permite cargar, reproducir y pausar audios, así como la duración y el volumen conjunto.
También hay eventos DOM que se le notifique cuando un audio comienza a jugar, está en pausa, etc.
Para una referencia DOM completa, vaya a nuestra HTML5 Audio / Video Referencia DOM .
HTML5 Audio Tags
| Etiqueta | Descripción |
|---|---|
| <audio> | Define el contenido de sonido |
| <source> | Define múltiples recursos multimedia para elementos multimedia, como <video> y <audio> |
HTML Audio - Web API de voz
La API de voz Web tiene como objetivo proporcionar un método de entrada alternativo para aplicaciones web (sin necesidad de utilizar un teclado). Con esta API, los desarrolladores pueden dar aplicaciones web la capacidad de transcribir la voz a texto, desde el micrófono de la computadora. El audio grabado se envía a los servidores de voz para la transcripción, después de lo cual el texto está escrito a máquina para el usuario. La API es agnóstica de la aplicación de reconocimiento de voz subyacente y puede soportar tanto servidor basado, así como reconocedores embebidos. El grupo HTML Discurso Incubadora ha propuesto la aplicación de la tecnología de audio de voz en los navegadores en forma de API uniforme, multiplataforma. La API contiene:
- API de entrada de voz
- Texto a Voz API