Etiqueta de audio en html | Explicado

Etiqueta de audio en html | Explicado
HTML5 proporciona una etiqueta para agregar archivos de audio a los sitios web. Agregar multimedia a cualquier sitio web es una forma notable de atraer a la audiencia y el uso apropiado de archivos de audio en cualquier sitio web lleva a una mejor experiencia web. Con la ayuda de elementos multimedia como y, podemos agregar sonidos y imágenes a cualquier sitio web y podemos jugarlos fácilmente sin complementos. Usando la etiqueta podemos incrustar un archivo de audio en nuestros sitios web en varios formatos I.mi. mp3, wav, ogg.

¿Estás dispuesto a aprender cómo funciona la etiqueta? En caso afirmativo, entonces debes entender los siguientes aspectos de la etiqueta HTML:

  • La sintaxis básica de la etiqueta
  • Atributos de la etiqueta
  • Formatos de audio de uso común
  • Soporte del navegador para la etiqueta
  • Cómo usar la etiqueta

Empecemos!

Sintaxis

El fragmento a continuación muestra la sintaxis básica de la etiqueta:

  • SRC y Type son atributos de TAG, aprenderemos sobre ellos en la sección de atributos.
  • Aquí, un punto clave para entender es que cualquier cosa que escribamos dentro de las etiquetas de inicio y finalización se mostrará solo si el navegador no admite el archivo de audio

Atributos

Hay algunos atributos que se pueden usar en la etiqueta como se enumera a continuación:

  • control S: Como su nombre en sí mismo sugiere, nos permite controlar el archivo de audio I.mi. Especifica qué controles deben ser visibles para el usuario E.gramo. jugar, pausa, silenciar, etc.
  • SRC: determina la dirección del archivo de audio.
  • bucle: habilita la estructura de bucle i.mi. Los archivos de audio se reproducirán una y otra vez.
  • apagado: determina si el archivo de audio se silenciará
  • precarga: Determina la opinión del autor sobre cómo se cargará el archivo de audio cuando se carga la página web
  • auto-reproducción: Determina que el archivo se reproducirá instantáneamente

Formatos

La etiqueta es una etiqueta moderna introducida en HTML5, actualmente admite tres formatos de archivo I.mi. "Mp3", "wav", "ogg".

Soporte del navegador

El siguiente es la lista de navegadores para los diversos formatos de archivo de audio:

  • Chrome, Microsoft Edge, Opera y Mozilla Firefox admiten los tres formatos I I.mi. mp3, wav, ogg.
  • Internet Explorer admite solo formato MP3
  • Safari admite formatos WAV y MP3

Cómo usar la etiqueta

Considere el fragmento de código dado a continuación para comprender cómo usar la etiqueta para incrustar un archivo de audio en una página web:


Etiqueta de audio





Archivo no compatible

Este código realiza las siguientes funcionalidades:

  • Agregamos el atributo "Controles" en la etiqueta para que un usuario pueda controlar el archivo en términos de reproducción/pausa, silencio/inmovilizado, etc.
  • Etiqueta Ayúdanos a especificar los múltiples archivos.

El siguiente será la salida del fragmento de código anterior:

Se pueden especificar varios formatos de archivo en la etiqueta en este caso, el navegador reproducirá la primera fuente reconocida.

Modificemos un poco el ejemplo y agregemos el atributo "apagado" en la etiqueta


Etiqueta de audio




Archivo no compatible

Ahora, cuando ejecutamos el código, inicialmente el archivo será silenciado:

Del mismo modo, puede usar el autoplay, el bucle o cualquier otro atributo de acuerdo con su necesidad.

Conclusión

La etiqueta de audio se puede usar para agregar un archivo de audio a cualquier documento/sitio web, se pueden usar diferentes atributos dentro de la etiqueta de audio para realizar diferentes funcionalidades. Si especificamos las direcciones de más de un archivo de audio, el navegador adjuntará el primer archivo al documento. Este artículo demuestra qué es la etiqueta HTML y cómo usar la etiqueta. Además, proporciona una explicación detallada de los formatos de archivo de audio disponibles y los navegadores compatibles.