Calificación:
  • 0 voto(s) - 0 Media
  • 1
  • 2
  • 3
  • 4
  • 5
Etiqueta de Audio y Videos HTML5
#1
Etiqueta audio

Con esta etiqueta puedes añadir audio a tu sitio sin necesidad de plugins. Esta etiqueta permite los codecs de audio ogg (ogg, oga), mp3, wav y AAC, aunque cada navegador soporta diferentes codecs.
Código:
<audio controls>
<source src="demo-audio.ogg" />
<source src="demo-audio.mp3" />
</audio>
Etiqueta video

Esta etiqueta es similar a
Código:
<video width="320" height="240" controls autobuffer autoplay preload="none" poster="videoframe.jpg">
<source src="demo-video.mp4" type="video/mp4" />
<source src="demo-video.ogv" type="video/ogg" />
</video>

Funciones: controls, autobuffer, autoplay

Si el video no tiene los controles como play o pause, el atributo CONTROLS hará que aparezcan los controles por defecto del navegador, claro, eso depende de si por ejemplo fuera Opera o Safari.
Autobuffer hace que se comience a cargar el video en cuanto carga la página
Autplay comienza a reproducir el video en cuanto se carga un poco del buffer
Soporte de Códecs

¿Qué son los codecs? Bueno, en realidad no vamos a entrar en detalles porque sería demasiado extenso todo, pero para dejárselas facil; es una “herramienta" (por así decirlo) que nos permite decodificar el video o contenido multimedia en sí, de manera que el navegador pueda mostrarlo visual y correctamente al usuario.
He aquí los codecs que usa y soporta cada navegador:

Chrome – H.264 y Theora (comúnmente llamado como OGG Vorbis)
Safari – H.264 y todo lo que use Quicktime
Firefox – Sólo Theora

Hay algo que muchos se preguntan; ¿Por qué Firefox solo soporta Theora y Safari sólo H.264? Es algo todavía complicado, pero resumiento todo, es por que H.264 no es software libre, tienes que pagar por su uso, y digamos que los de Safari (apple) son “de dinero". En cambio Theora, como es libre y como Firefox es creada por una fundación que apoya el Software Libre, ya se imaginarán.


Posibles temas similares...
Tema Autor Respuestas Vistas Último mensaje
Música [Aporte] Reproductor de audio html djsmokingcr 11 405 02-05-2017, 03:04 AM
Último mensaje: gassip
  [Aporte] Uso eficiente de la etiqueta meta viewport carlsmartg 2 634 01-10-2016, 05:24 AM
Último mensaje: habacuc78
  [Aporte] Libro html5 De distribucion libre gassip 5 353 04-01-2016, 01:27 PM
Último mensaje: Taquion
  [Tutorial] jQuery HTML5 Form Plugin - jQuery Form Plugin luis.ml 0 231 16-08-2015, 02:02 AM
Último mensaje: luis.ml
  Formulario de inicio de session con html5 luis.ml 0 1,100 16-08-2015, 12:52 AM
Último mensaje: luis.ml
  script simple para embeber videos en sitio canpios 1 297 18-01-2015, 05:58 AM
Último mensaje: garcon
  Como hacer un menu horizontal con html5 y css3 torgar22 4 671 16-12-2014, 02:07 PM
Último mensaje: Demozz
  HTML5: Cómo crear una barra de progreso nativa con estilo imgur 0 344 19-11-2014, 11:17 PM
Último mensaje: imgur
  Cómo hacer un formulario con validación en HTML5 imgur 0 359 19-11-2014, 10:24 PM
Último mensaje: imgur
  Menu HTML5 - CSS3 gamesd 8 871 27-10-2013, 02:20 PM
Último mensaje: ilopezbdn



Usuarios navegando en este tema: 1 invitado(s)