Video Html5 -> Navegadores, códecs y Formatos

Ya algunos habrán leido y escuchado sobre HTML5, y talvés algunos hasta hayan profundizado un poco más y han leido sobre las nuevas características, e inclusive hayan probado lo bueno que es.
Bueno, yo me cuento entre esos, y aquí les traigo un pequeño tutorial sobre como agregar videos, en HTML5 (SIN FLASH), utilizando, obviamente, formatos tipo OPEN SOURCE.



Compatibilidad: Navegadores y Códecs
Según Wikipedia los navegadores que actualmente soportan video en HTML5 son: (Sin tomar en cuenta los códecs):

• Firefox 3.5+
• Google Chrome 3.0+
• Apple Safari 3.1+
• Opera 10.5+(*)

Como vemos, el gran ausente, Internet Explorer, ni aún en su versión más reciente (8) soporta aún HTML5. Esto puede o no puede ser un problema, dependiendo del público meta hacia el que nos dirigimos. Si hay posibilidad de que los usuarios serán algo preparados en informática, no tendremos mucho problema, puesto que es sencillo saber que si saben sobre navegadores, NO utilizarán IE; lo mismo sucedería si por ejemplo nuestro sitio sea orientado a INTRANETS donde podamos exigir que se utilice solamente FF o algún otro navegador compatible. Esto no aplica para el público en general, donde la penetración del molesto Flash Player es de hasta un 99.5%.
Ahora, viene otra parte importante: el soporte de códecs y tipos de videos. Como vimos en el link anterior, hay dos tipos de Videos que se utilizan principalmente en HTML5: Theora/Ogg y H.264/MPEG-4 donde, Theora es Open Source y H.264 es formato propietario. Aunque en HTML5 NO se especifica puntualmente que tipo de video se debe utilizar, se usan estos dos por defecto. A continuación, una pequeña explicación de cada uno y su "matrix" de compatibilidad:
Theora/Ogg
Un formato open source, con soporte NATIVO en FF desde la versión 3.5 (la versión 3.6 es la versión actual), eso significa que no necesitamos nada adicional para reproducirlo. Apple está contra este formato aduciendo "falta de rendimiento", cuando en realidad lo que buscan es ganar dinero porque són parte de los dueños del otro formato, por esto no tienen soporte alguno en su (cuasi)Navegador Safari. Opera y Chrome  lo soportan totalmente.
H.264/MPEG-4
Formato propietario, donde cada persona que quiera hacer un video en este formato, tiene que pagar regalias super altas. Es soportado en Safari, Chrome, y Opera si GStreamer está instalado, lo que significa que tendriamos que usar un "codec-pack" adicional. YouTube lanzó un "preview" de su servicio en versión limitada aquí que sólo soporta este formato, aduciendo faltas de rendimiento en Theora

Ahora, hablaré un poco sobre HTML5. Como mencioné antes, HTML5 no obliga a utilizar este o aquél codec y/o tipo de video, pero estos dos son los que tienen más aceptación. Aunque como, desarrolladores web tenemos que tomar en cuenta ésto, creo que la mejor apuesta para el futuro sería Theora, por múltiples razones, siendo la más importante lo de que es SOFTWARE LIBRE.

Ahora, teniendo en cuenta que, ésto viene a ser lo más importante del POST en general, veamos un poco de código html que funciona a la perfección en Firefox 3.6

<video src="Cuadra.ogv" controls autobuffer>
  <h1>Mierda está usando IE o Safari </h1>
  </video>

Donde, con el H1 que está dentro de los tags de video, sería lo que se mostraría si el tag de video no se reconociera en el navegador que se utilice, por ejemplo, IE6, o si el tipo de video no fuera soportado, como en Safari. Como ven, el filename es Cuadra.ogv, que sería un video en formato Theora/ogg, convertido de un WMV usando ffmpeg2ogg de Ubuntu, usando las configuraciones por defecto.
Ahora, como mencioné anteriormente, esto sólo funcionaria en Chrome, Firefox y Opera, pero que pasa con los demás?
Bueno para eso usariamos algo así:

<video controls autobuffer>
<src="ruta al video ogv" />
<src="ruta al video h.264" />
  <h1>Mierda está usando IE o Safari </h1>
  </video>

Donde, el navegador buscará un archivo que soporte de arriba hacia abajo, hasta encontrar y poder reproducir.

Saludos, si les queda alguna duda, no duden en comentar!