HTML admite varios elementos multimedia, como audio o video. Utiliza etiquetas multimedia como <audio>, <video>, <source>, <embed> y <track> para incluir archivos multimedia en documentos HTML. Los archivos multimedia pueden estar en diferentes formatos (por ejemplo, MP3, MP4, WEBM) que se pueden identificar mirando la extensión de estos archivos. Entre todos los formatos disponibles de estos archivos, solo algunos de ellos son compatibles con los estándares HTML.
FORMATOS DE AUDIO:
HTML usa la etiqueta <audio> para agregar archivos de sonido en la página web. Contiene una etiqueta <source> que especifica el nombre y el formato del archivo de audio. Hay muchos formatos para archivos de audio como MIDI, RealAudio, WMA, WAV, Ogg, MP3, etc. pero MP3 es el formato más eficiente para música grabada comprimida. Los siguientes formatos de audio son compatibles con los estándares HTML:
- MP3
- WAV
- Ogg
1. MP3: MPEG audio layer-3 (MP3) es básicamente un formato de compresión de datos para archivos de audio y representa la parte de audio de los archivos MPEG. Es el formato más utilizado para archivos de audio debido a su buena capacidad de compresión junto con audio de alta calidad. Se utiliza para insertar archivos de audio en páginas web o videos web. Los archivos MP3 tienen una extensión .mp3 y son compatibles con todos los navegadores.
Características:
- audio de alta calidad
- Tamaño de archivo pequeño
- datos comprimidos
- Compatible con todos los navegadores
Sintaxis:
<audio> <source src= "filename" type="audio/mpeg"> </audio>
Ejemplo: el siguiente código agregará un archivo de audio MP3 en un documento HTML o mostrará texto escrito entre <audio> y </audio> si el archivo no es compatible con el navegador:
HTML
<!DOCTYPE html> <html> <body> <audio controls> <source src="demo.mp3" type="audio/mpeg"> Your browser does not support the audio element. </audio> </body> </html>
Producción:
2. WAV: El formato de archivo de audio de forma de onda (WAV) es básicamente un formato de audio para almacenar un flujo de bits de audio sin comprimir. Los archivos WAV tienen una mejor calidad de audio, pero su tamaño de archivo es comparativamente más grande que los archivos MP3 debido a sus datos sin comprimir. Se utiliza principalmente para transmitir archivos de música con calidad de CD o para animaciones web. Los archivos WAV tienen una extensión .wav y son compatibles con los navegadores Google Chrome, Firefox, Opera y Safari.
Características:
- audio de alta calidad
- Tamaño de archivo grande
- datos sin comprimir
- Compatible con la mayoría de los navegadores
Sintaxis:
<audio> <source src= "filename" type="audio/wav"> </audio>
Ejemplo: el siguiente código agregará un archivo de audio WAV en un documento HTML o mostrará texto escrito entre <audio> y </audio> si el archivo no es compatible con el navegador:
HTML
<!DOCTYPE html> <html> <body> <audio controls> <source src="demo.wav" type="audio/wav"> Your browser does not support the audio element. </audio> </body> </html>
Producción:
3. Ogg: Ogg es básicamente un formato de archivo audiovisual para almacenar datos comprimidos junto con metadatos sobre el archivo en un contenedor abierto. Tiene la mejor calidad de audio y un tamaño de archivo comparativamente más pequeño que el MP3. Su tasa de bits de compresión puede variar según los requisitos del archivo. Se utiliza para transmitir y manipular datos multimedia digitales de alta calidad. Los archivos Ogg tienen una extensión .ogg y son compatibles con los navegadores Google Chrome, Firefox y Opera.
Características:
- Buena calidad de audio
- Tamaño de archivo pequeño
- Datos comprimidos junto con los metadatos del archivo
- Compatible con Google Chrome, Firefox y Opera
Sintaxis:
<audio> <source src= "filename" type="audio/ogg"> </audio>
Ejemplo: el siguiente código agregará un archivo de audio Ogg en un documento HTML o mostrará texto escrito entre <audio> y </audio> si el archivo no es compatible con el navegador:
HTML
<!DOCTYPE html> <html> <body> <audio controls> <source src="demo.ogg" type="audio/ogg"> Your browser does not support the audio element. </audio> </body> </html>
Producción:
FORMATOS DE VÍDEO:
HTML usa la etiqueta <video> para agregar archivos de video en la página web. Contiene la etiqueta <source> que especifica el nombre y el formato del archivo de video. Hay muchos formatos para archivos de video como MPEG, RealVideo, Flash, WebM, Ogg, MP4, etc. Los siguientes formatos de video son compatibles con los estándares HTML:
- MP4
- WebM
- Ogg
1. MP4: MPEG-4 (MP4) es básicamente un formato de contenedor multimedia digital para almacenar datos comprimidos como audio, video e imágenes fijas. Es el formato recomendado por Youtube para archivos de video debido a su buena capacidad de compresión junto con datos de alta calidad. Se usa comúnmente en cámaras de video y hardware de TV. Los archivos MP4 tienen una extensión .mp4 y son compatibles con todos los navegadores.
Características:
- vídeo de alta calidad
- Tamaño de archivo pequeño
- datos comprimidos
- Compatible con todos los navegadores
Sintaxis:
<video> <source src= "filename" type="video/mp4"> </video>
Ejemplo: el siguiente código agregará un archivo de video MP4 en un documento HTML o mostrará texto escrito entre <video> y </video> si el archivo no es compatible con el navegador:
HTML
<!DOCTYPE html> <html> <body> <video width="320" height="240" controls> <source src="demo.mp4" type="video/mp4"> Your browser does not support the video tag. </video> </body> </html>
Producción:
2. WebM: Web Methods (WebM) es un formato de archivo audiovisual que se utiliza para agregar elementos de audio o video en documentos HTML. Admite video de alta calidad y tiene un tamaño de archivo casi comparable a los archivos MP4. Se puede utilizar con fines de transmisión porque es compatible incluso con máquinas con características técnicas bajas. Los archivos WebM tienen una extensión .webm y son compatibles con los navegadores Google Chrome, Firefox, Opera y Safari.
Características:
- vídeo de buena calidad
- Tamaño de archivo comparable a MP4
- Compatible con todas las máquinas, incluso con características técnicas bajas
- Compatible con la mayoría de los navegadores
Sintaxis:
<video> <source src= "filename" type="video/webm"> </video>
Ejemplo: el siguiente código agregará un archivo de video WEBM en un documento HTML o mostrará texto escrito entre <video> y </video> si el archivo no es compatible con el navegador:
HTML
<!DOCTYPE html> <html> <body> <video width="320" height="240" controls> <source src="demo.webm" type="video/webm"> Your browser does not support the video tag. </video> </body> </html>
Producción:
3. Ogg: Ogg es básicamente un formato de archivo audiovisual para almacenar datos comprimidos junto con metadatos sobre el archivo en un contenedor abierto. Tiene mejor calidad de datos y un tamaño de archivo comparativamente más pequeño que MP4. Su tasa de bits de compresión puede variar según los requisitos del archivo. Se utiliza para transmitir y manipular datos multimedia digitales de alta calidad. Los archivos Ogg tienen una extensión .ogg y son compatibles con los navegadores Google Chrome, Firefox y Opera.
Características:
- Buena calidad de datos
- Tamaño de archivo pequeño
- Datos comprimidos junto con los metadatos del archivo
- Compatible con Google Chrome, Firefox y Opera
Sintaxis:
<video> <source src= "filename" type="video/ogg"> </video>
Ejemplo: el siguiente código agregará un archivo de video Ogg en un documento HTML o mostrará texto escrito entre <video> y </video> si el archivo no es compatible con el navegador:
HTML
<!DOCTYPE html> <html> <body> <video width="320" height="240" controls> <source src="demo.ogg" type="video/ogg"> Your browser does not support the video tag. </video> </body> </html>
Producción:
Publicación traducida automáticamente
Artículo escrito por saxenaanjali239 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA