Menú de navegaciónMenú
Categorías

La mejor forma de Aprender Programación online y en español www.campusmvp.es

?id=464b1883-37ae-4576-8923-1bc234cd5baa

Reproductor gratuito avanzado de vídeo con HTML5 de Paypal

Icono de advertencia ATENCIÓN: este contenido tiene más de 2 años de antigüedad y, debido a su temática, podría contener información desactualizada o inexacta en la actualidad.

botones-reproductor-videoEl vídeo en Internet ha evolucionado mucho desde que la Red nació. Primero se usaban horribles Applets de Java, el famoso y por fortuna olvidado RealPlayer, Quicktime de Apple y los últimos años Flash, antes de la proliferación de HTML5.

Hoy en día el elemento <video> de HTML nos facilita bastante las cosas, pero aún así nos ofrece de serie muy pocas características. Si queremos crear un reproductor personalizado avanzado, con un aspecto muy adaptado a nuestras necesidades, controles propios y características como subtítulos, tendremos que programar mucho y probarlo en muchos dispositivos y navegadores distintos. Otra cosa importante es tener en cuenta los "fallbacks", es decir, cómo actuar cuando un navegador no soporta alguna de las características o formatos de vídeo del reproductor, lo cual es otro trabajo importante.

Por eso han proliferado los reproductores de vídeo comerciales basados en HTML y con "fallback" a Flash.

Ahora la gente de PayPal Engineering ha lanzado un interesante proyecto Open Source para crear un reproductor universal avanzado capaz de gestionar toda esa complejidad por nosotros, y con lo siguientes objetivos:

  • Usar exclusivamente HTML5, para el visor, los controles y los subtítulos
  • Soportar subtítulos en el formato estándar WebVTT
  • Que pese lo menos posible. El resultado final es de tan solo 18 Kb para el JavaScript (¡sin minimizar ni comprimir!) y 5Kb para el CSS. Han hecho un gran trabajo.

Paypal-accessible-html5-video-player

Puedes descargar el código fuente desde la página del reproductor en GitHub. Puede ser una gran alternativa a otras opciones comerciales más caras y también a algunos gratuitos más pesados o con menos opciones.

Nota: Autor de la imagen de portada Nemo. Imagen usada bajo licencia CC

Fecha de publicación:
campusMVP campusMVP es la mejor forma de aprender a programar online y en español. En nuestros cursos solamente encontrarás contenidos propios de alta calidad (teoría+vídeos+prácticas) creados y tutelados por los principales expertos del sector. Nosotros vamos mucho más allá de una simple colección de vídeos colgados en Internet porque nuestro principal objetivo es que tú aprendas. Ver todos los posts de campusMVP
Archivado en: Desarrollo Web | Herramientas

Boletín campusMVP.es

Solo cosas útiles. Una vez al mes.

🚀 Únete a miles de desarrolladores

DATE DE ALTA

x No me interesa | x Ya soy suscriptor

La mejor formación online para desarrolladores como tú

Agregar comentario

Los datos anteriores se utilizarán exclusivamente para permitirte hacer el comentario y, si lo seleccionas, notificarte de nuevos comentarios en este artículo, pero no se procesarán ni se utilizarán para ningún otro propósito. Lee nuestra política de privacidad.