Diseño de páginas web Querétaro
CODECS, LA NUEVA GUERRA
Diseño de páginas web Querétaro en los primeros borradores de la especificación de HTML5, se indicaba que se debía de ofrecer soporte para al menos dos codecs multimedia: Ogg Vorbis para audio y Ogg Theora para vídeo. Sin embargo, estos requisitos fueron eliminados después de que Apple y Nokia se opusieran, de modo que la especificación no recomendase ningún codec en concreto. Esto ha creado una situación de fragmentación, con diferentes
navegadores optando por diferentes formatos, basándose en sus ideologías o convicciones comerciales pagina web.
Actualmente, hay dos codecs principales que debemos tener en cuenta: el nuevo formato WebM, construido sobre el formato VP8 que Google compró y ofrece de manera libre, y el formato MP4, que contiene el codec propietario H.264.
WEBM MP4 OGV
Opera Sí No Sí
Firefox Sí Sí Sí
Chrome Sí No Sí
IE9+ No Sí No
Safari No Sí No
WebM funciona en IE9+ y Safari si el usuario ha instalado los codec de manera manual paginas web.
Por lo tanto, la mejor solución en estos momentos es ofrecer tanto el formato libre WebM, como el propietario H.264.
6.2.1 MULTIPLES ELEMENTOS <SOURCE>
Para poder ofrecer ambos formatos, primeramente debemos codificarlos por separado. Existen diversas herramientas y servicios on-line para realizar esta tarea, pero quizás el más conocido sea Miro Video Converter. Este software, disponible para Windows y Mac, nos permite convertir los vídeos en formato Theora, o H.264 (y muchos otros) optimizados para diferentes tipos de dispositivos como iPhone, Android, PS2, etc diseño web Ciudad de México.
Una vez dispongamos el vídeo en los distintos formatos, es necesario indicar todas las localizaciones de estos formatos, para que sea el navegador el que decida que formato reproducir. Evidentemente, no podemos especificarlos todos dentro del atributo scr, por lo que tendremos que hacerlo de manera separada utilizando el elemento <source> diseño web Guadalajara.
<video controls> <source src=»leverage-a-synergy.mp4″ type=’video/mp4; codecs=»avc1.42E01E, mp4a.40.2″‘> <source src=»leverage-a-synergy.webm» type=’video/webm; codecs=»vp8, vorbis «‘> <p>Your browser doesn’t support video. Please download the video in <a href=»leverage-a-synergy.webm»>webM</a> or <a href=»leverage-a-synergy.mp4″>MP4</a> format. </p> </video>
6.2.2 MEDIA QUERIES PARA VIDEO
Los ficheros de vídeo tienden a ser pesados, y enviar un vídeo en alta calidad a un dispositivo con un tamaño de pantalla reducido es algo totalmente ineficiente. No hay ningún inconveniente en hacerlo, pero si comprimimos el vídeo y disminuimos sus dimensiones, conseguiremos reducir su tamaño (en MB), algo de agradecer en entornos móviles y que dependen de una conexión de datos.
HTML5 permite utilizar el atributo media en el elemento <source>, ofreciendo la misma funcionalidad que los Media Queriesen CSS3. Por lo tanto, podemos consultar al navegador por el ancho de la pantalla, la relación de aspecto, colores, etc, y definir el video correcto según las características del dispositivo.
<video controls> <source src=»hi-res.mp4″ media=»(min-device-width: 800px)»> <source src=»lo-res.mp4″> </video> diseño web Df