Multimedia HTML
Multimedia es casi cualquier cosa que puedas oír o ver (por ejemplo, sonido, música, imágenes, grabaciones, videos, películas, animaciones, etc.). Viene en diferentes formatos. Las páginas web pueden contener elementos multimedia de distintos formatos y tipos.
Etiquetas multimedia
HTML permite añadir diferentes archivos multimedia en tu sitio web mediante varias etiquetas multimedia. Estas etiquetas incluyen:
<audio>para mostrar un archivo de audio en la página web,<video>para mostrar un archivo de video en la página web,<embed>para incrustar archivos multimedia en la página web,<object>para incrustar archivos multimedia en la página web.<iframe>para incrustar otras páginas web.
Aquí tienes un ejemplo básico que usa el atributo controls y las etiquetas <source>:
<audio controls>
<source src="audio.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
<video controls>
<source src="video.mp4" type="video/mp4">
Your browser does not support the video element.
</video>Formatos multimedia
Los elementos multimedia, como audio o video, se almacenan en archivos multimedia. Puedes descubrir el tipo de archivo mirando la extensión del archivo.
Los archivos multimedia tienen formatos y diferentes extensiones: .mp3, .mp4, .mpg, .swf, .wav, .mpg, .wmv y .avi.
Formatos de audio
El formato más reciente para música grabada comprimida es MP3. Este término es sinónimo de música digital.
MP3 es una buena opción si tu sitio web trata sobre música grabada.
| Formato | Archivo | Descripción |
|---|---|---|
| MIDI (Musical Instrument Digital Interface). | .mid .midi | Este es el formato principal para todos los dispositivos de música electrónica (por ejemplo, sintetizadores y tarjetas de sonido de PC). Los archivos MIDI contienen notas digitales que pueden ser reproducidas por dispositivos electrónicos, pero no incluyen sonido. Funciona bien en hardware musical y computadoras, pero no de forma nativa en los navegadores web. Los navegadores modernos pueden manejar MIDI mediante la API Web Audio. |
| RealAudio | .rm .ram | Permite la transmisión de audio con bajo ancho de banda. En los navegadores web, no se reproduce. |
| WMA | .wma | Este formato ha sido desarrollado por Microsoft y normalmente se usa en reproductores de música. Funciona bien en computadoras con Windows, pero no en navegadores web. |
| AAC | .aac | Este formato ha sido desarrollado por Apple como el formato predeterminado para iTunes. Los archivos .aac sin procesar tienen compatibilidad limitada con los navegadores, pero el audio AAC es ampliamente compatible cuando se empaqueta dentro de contenedores .mp4. |
| WAV | .wav | Este formato ha sido desarrollado por IBM y Microsoft. Funciona bien en sistemas operativos Windows, Linux y Macintosh. Compatible con HTML5. |
| Ogg | .ogg | Este formato ha sido desarrollado por la Fundación Xiph.Org. Compatible con HTML5. |
| MP3 | .mp3 | Este es el formato más popular para reproductores de música. El formato tiene buena compresión (archivos pequeños) y alta calidad. Compatible con todos los navegadores. |
| MP4 | .mp4 | Este es un formato de video, pero también puede usarse para audio. El video MP4 es el formato de video del futuro en Internet, lo que lleva a la compatibilidad automática con el audio MP4 en todos los navegadores. |
TIP
HTML5 admite de forma nativa los formatos de audio MP3, AAC (en contenedores MP4), WAV y Ogg.
Formatos de video
| Formato | Archivo | Descripción |
|---|---|---|
| MPEG | .mpg .mpeg | Creado por el Moving Pictures Expert Group. Es el primer formato de video popular en la web. No es compatible con HTML5. |
| AVI (Audio Video Interleave) | .avi | Creado por Microsoft. Normalmente se usa en hardware de TV y cámaras de video. Funciona bien en computadoras con Windows, pero no en navegadores web. |
| WMV (Windows Media Video) | .wmv | Creado por Microsoft. Normalmente se usa en hardware de TV y cámaras de video. Funciona bien en computadoras con Windows, pero no en navegadores web. |
| QuickTime | .mov | Creado por Apple. Normalmente se usa en hardware de TV y cámaras de video. Funciona bien en computadoras Apple, pero no en navegadores web. |
| RealVideo | .rm .ram | Creado por Real Media y permite la transmisión de video con bajo ancho de banda. Todavía se usa para TV por Internet y video en línea, pero no se reproduce en navegadores web. |
| Flash | .swf .flv | Obsoleto. Adobe Flash Player fue eliminado de todos los navegadores modernos en 2020. Este formato ahora se considera heredado y requiere emuladores de terceros para reproducirse. |
| Ogg Theora | .ogg | Creado por la Fundación Xiph.Org. Compatible con HTML5. |
| WebM | .webm | Creado por Mozilla, Opera, Google y Adobe. Compatible con HTML5. |
| MPEG-4 or MP4 | .mp4 | Creado por el Moving Pictures Expert Group. Generalmente se usa en hardware de TV y cámaras de video más recientes. Recomendado por YouTube. Compatible con todos los navegadores HTML5. |
TIP
Solo los formatos de video WebM, MP4 y Ogg son compatibles con el estándar HTML5.
Compatibilidad del navegador
El audio, el video y la animación son manejados de forma nativa por los navegadores modernos. Aunque la compatibilidad de formatos varía, HTML5 ha estandarizado la reproducción sin requerir complementos de terceros.
Practice
What kinds of files can HTML multimedia display?