Cómo agregar sonido en HTML
Los usuarios de Internet están acostumbrados a interactuar con el contenido en línea a través de la presentación visual, pero también hay muchas oportunidades para añadir audio a tus páginas de HTML. Añadir sonido no es tan difícil como parece. Aquí hay una guía paso a paso que te ayudará a agregar sonido a tu página web o blog en HTML.
Paso 1: Preparar el archivo de audio
El primer paso para incluir sonido en una página web es preparar el archivo de audio. Es importante optimizar el audio para que tenga una excelente calidad en la web. El formato WAV es el mejor, ya que es un formato no comprimido con buena calidad. Si usas un formato comprimido como MP3, el tamaño del archivo se reducirá pero la calidad también.
Paso 2: Subir tu archivo de audio
Ahora que has optimizado tus archivos de audio para la web, es el momento de subirlos a tu servidor web. La ubicación del archivo decide dónde se mostrará en tu sitio web. Esto significa que si el archivo se almacena en una ubicación o directorio específico, se mostrará sólo en ese lugar en tu sitio web. Si deseas cambiar el ubicación del archivo, consulta los documentos del servidor web para saber cómo hacerlo.
Paso 3: Insertar archivo de audio en HTML
Ahora que tu archivo de audio está almacenado en tu servidor web, es hora de insertarlo en tu página de HTML. Aquí hay un ejemplo de cómo puedes hacer esto usando el elemento ‘audio’ de HTML:
En este ejemplo, la palabra ‘sonido’ debe ser reemplazada por el nombre de tu archivo de audio, y la extensión debe ser el mismo formato que usaste al preparar el archivo. Esta línea de código insertará un controles básicos en el navegador para controlar el audio, tales como reproducir, pausar y detener.
Opciones adicionales
También hay algunas opciones de personalización adicionales que puedes configurar para tu elemento de audio. Estas son algunas de las opciones que puedes usar:
- autoplay – Esto hará que el audio se reproduzca automáticamente cuando la página se cargue.
- loop – Esta opción hará que el audio se repita varias veces.
- preload – Esta opción pre-cargará el audio para que esté listo para su reproducción.
Estas opciones se pueden agregar a la línea de código del elemento ‘audio’ como se muestra aquí:
Utilizar estas opciones es la mejor manera de asegurarse de que los usuarios reciban la mejor experiencia sonora posible.
Conclusiones
Agregar sonido a una página de HTML es relativamente fácil. Sigue estos pasos para asegurarte de que tu audio se reproduce correctamente y para que los usuarios tengan la mejor experiencia posible. Puedes experimentar con algunas de las opciones disponibles para mejorar tu página web y hacer que tus contenidos sean más interesantes.
¿Cómo usar etiqueta audio?
Cómo poner un AUDIO en HTML [Curso de HTML desde cero]
Para usar la etiqueta audio en HTML, necesitarás colocarla dentro de la etiqueta
de tu documento HTML. Puedes configurar la etiqueta para aceptar formatos de audio como MP3, WAV y OGG. La sintaxis correcta es la siguiente:En la parte anterior, el atributo src es la URL del archivo de audio y el atributo de control permite a los usuarios interactuar con el elemento. Por último, el contenido entre las etiquetas es el mensaje que el navegador mostrará si el formato de audio no es compatible.
¿Cómo poner audio infinito en HTML?
Para ello vamos a utilizar el primer atributo que es autoplay. Al atributo autoplay del AUDIO le daremos un valor true. Ahora que ya tenemos la canción sonando de fondo vamos a conseguir que la música suene de forma infinita. Para ello añadiremos al AUDIO el atributo loop con un valor true.
Es decir, el código sería el siguiente:
¿Cuál es la etiqueta de audio en HTML?
Audio (modo avanzado)
¿Cómo insertar audio y video en HTML?
Para poder insertar videos en nuestras páginas HTML tenemos que utilizar la etiqueta
Para insertar audio también podemos utilizar la etiqueta , añadiendo un atributo llamado «controls» para activar el panel de control para reproducir/pausar el audio. El código básico sería el siguiente: