La evolución del lenguaje HTML5 ha causado que se implementen diversos recursos multimedia en los sitios web sin tener que preocuparse por peso de los archivos finales como se hacía anteriormente. Ahora, puedes añadir video y audio a tu sitio sin problemas y sin que tus visitantes tengan que lidiar con problemas de carga.
Puedes implementar pistas de audio HTML5 a tu sitio web de manera rápida y sencilla gracias a las propiedades de este lenguaje. Tener esta capacidad es de gran utilidad para radios en línea, plataformas que ofrecen música gratuita o de pago e incluso para cualquier sitio que desee incluir música de fondo como parte de la experiencia para sus visitantes.
Es posible que en algún punto necesites incluir audio en tu sitio web, por ello en este artículo te listamos algunos algunos reproductores de audio HTML5 que poseen no sólo características básicas, sino también diseños modernos y sencillos que puedes personalizar a tu gusto.
Kast
Kast es un reproductor de audio HTML5 que te permite transmitir audio en vivo, de modo que si posees una radio puede usar Kast para implementarla desde tu página web oficial. Tus visitantes podrán escuchar música en tu web accediendo desde ordenadores, tabletas y otros dispositivos móviles.
Admite diversos formatos de audio como MP3, OGG, AAC y AAC+. Además puedes personalizarlo a tu gusto, se ha diseñado siguiendo las guías del Material Design de Google y viene optimizado para pantallas de retina.
El reproductor se mantiene siempre en una esquina del navegador y muestra información sobre la pista. También puedes incluir imágenes sobre el álbum o artista, tal como se ve en la mayoría de reproductores de audio para ordenadores o móviles.
Kast tiene un costo de $18.
sPlayer
sPlayer es un completo reproductor de música donde puedes crear diversas listas de reproducción, compartir canciones mediante enlaces, buscar música, transmitir programas en vivo y calificar canciones.
Admite formatos como MP3, OGG, OGA, AAC, M4A y MP4. Puedes importar archivos y descargar canciones desde el mismo reproductor. Además, las canciones que has marcado como favoritas se quedarán guardadas, de modo que la próxima vez que los usuarios ingresen a tu sitio podrán escuchar sus canciones desde la lista de favoritos.
La licencia de sPlayer tiene un costo de $18.
HTML5 Audio Player with Playlist
HTML5 Audio Player with Playlist es un reproductor de audio que posee opciones para creación de listas de reproducción de manera automática. Cuenta con una API que puedes emplear para elegir las opciones que deseas incluir en este reproductor. Con el uso de CSS puedes personalizar el aspecto para que vaya acorde al estilo de tu sitio web.
La licencia de HTML5 Audio Player with Playlist tiene un costo de $13.
Chameleon HTML5 Audio Player with/without Playlist
Puedes usar Chameleon HTML5 Audio Player como un reproductor de audio completo o para añadir música de fondo en tu sitio web. En la opción de reproductor te permite cambiar los colores de fondo, slider para volumen, título de canción, barra de búsqueda, fuentes para las listas de reproducción
Admite formatos de audio MP3 y OGG, es compatible con dispositivos móviles y te permite incluir varios reproductores en un solo sitio web.
Chameleon HTML5 Audio Player tiene un costo de $10.
ZoomSounds
ZoomSounds es un reproductor de audio de diseño responsive que se encuentra optimizado para pantallas de retina. Posee 3 estilos de cubierta que puedes modificar haciendo uso de CSS. Está optimizado para Android e iOS, de modo que puedes escuchar música con ZoomSounds desde tus dispositivos móviles. También presenta optimización para SEO y te permite incluir pista de Soundcloud y Youtube.
Para obtener la licencia regular de ZoomSounds debes pagar $8.
Responsive HTML5 Audio Player Pro with Playlist
Responsive HTML5 Audio Player Pro es un reproductor de audio compatible con los navegadores más populares. También puede ser usado desde dispositivos móviles, puedes personalizar los colores y otras opciones para que sean similares al estilo de tu sitio web. Admite archivos de audio MP3 y OGG.
Adicionalmente, posee opciones para añadir categorías, compartir música, buscar pistas de audio y activar estadísticas de Google Analytics.
Puedes obtener la licencia regular de este reproductor por $13.
tPlayer
tPlayer es un reproductor de audio HTML5 que puedes incluir en tu sitio. Es compatible con los navegadores más populares y permite la creación de listas de reproducción ilimitadas, cada una de ellas puede tener un número indeterminado de pistas. Posee opciones como reproducción automática, orden aleatorio, repetición de pistas o listas completas y enlaces para compartir en redes sociales. Asimismo, puedes añadir botones para que los usuarios puedan descargar y comprar las pistas que están escuchando.
La licencia de tPlayer tiene un costo de $7.
Vimuse
Vimuse es un plugin jQuery que te permite reproducir tanto audio como video. Posee una interfaz moderna y puedes elegir entre reproducir videos alojados en tu servidor o en plataformas externas como Youtube, Vimeo y Dailymotion.
El reproductor es de diseño responsive de modo que se adapta a cualquier pantalla desde ordenadores hasta dispositivos móviles. Se encuentra optimizado para pantallas de retina y táctiles e incluso ofrece soporte para Flash en navegadores que no aceptan video o audio HTML5.
Puedes añadir subtítulos a los videos, extraer información sobre artistas, año, álbum y demás de las pistas de audio, colocar imágenes de portada, etc. Puedes adquirir Vimuse por $18.
Royal Audio Player
Royal Audio Player es un reproductor de audio que es compatible en los navegaodores más populares y en dispositivos móviles que posean sistema operativo Android, iOS y Windows8. Con Royal Audio Player puedes crear listas de reproducción ilimitadas y añadir un sinnúmero de pistas a cada una de ellas. Estas listas pueden ser creadas de manera manual mediante HTML, archivos XML, enlaces de podcast o usando las listas creadas en Soundcloud.
El reproductor posee todos los botones básicos como reproducción automática, orden aleatorio, repetición de pista o lista de reproducción, selección de lista, etc. Adicionalmente presenta una animación para el ecualizador, si decides activar esta característica en el reproductor.
Royal Audio Player tiene un costo de $11.
ProgressionPlayer
ProgressionPlayer es un reproductor de audio y video fácil de personalizar. Posee 5 cubiertas distintas para que elijas la que mejor se adapta al estilo de tu sitio web, es compatible para pantallas de retina y también para dispositivos móviles debido a su diseño responsive. Puedes añadir listas de reproducción y un número ilimitado de reproductores en cada página de tu sitio web.
ProgressionPlayer tiene un costo de $13.
APlayer
APlayer es un reproductor de audio HTML5 que puedes incluir en tu sitio web. Posee diversas formas, desde un estilo minimizado donde solo se presenta la carátula del álbum y el botón de reproducción/pausa hasta versiones que incluyen listas de reproducción y letras. En sus versiones no minimizadas incluye control de volumen y botón para reproducir en bucle.
APlayer es un proyecto gratuito que se encuentra alojado en GitHub.
En conclusión…
Para poder incluir reproductores de audio modernos y con una gran interfaz gráfica puedes hacer uso de los recursos mencionados en esta lista, en vez de dedicarte desarrollar un reproductor desde cero. Tener a tu disponibilidad opciones como ésta es esencial si eres un desarrollador freelance y debes trabajar en varios proyectos al mismo tiempo. Los reproductores que incluimos en esta lista posee características no sólo poseen las características básicas, sino también opciones adicionales que seguramente te serán de utilidad en determinados proyectos web.