Web

5 Great HTML5 Video Players

    Gilad Maayan
    Share

    There has been an increasing demand for creators to develop their own custom video platform which they can use to advance their own advertising, marketing or branding goals. Although YouTube and other similar platforms are generally more promising, hosting videos on your own and using a video player of your choice offers more control over how your videos are used.

    Irrespective of whether you are a YouTube video creator or social media influencer, we’ve compiled a list of 5 of the greatest HTML5 video players. This list has been compiled after taking into consideration a few important needs, such as:

    1. Fast and responsive
    2. Easy to install and use
    3. Compatibility quotient across browsers
    4. Robust and all round playlist options
    5. Ability to include an advertisement at various stages of the video – before, during or after
    6. Ability to integrate self-hosted videos with those from channels like YouTube, Dailymotion, Vimeo, etc.

    Now that we have an idea what to look for, here is a list of the top 5 HTML5 Video Players.

    VideoJS

    VideoJS, an open source HTML5 video player is built using JavaScript and CSS. It’s an HTML5 video player with optional support for Flash. Having Flash as a fallback option is especially helpful when you’re using it on browsers that do not support HTML5. It can extend its support to Vimeo and YouTube.

    Launched in the year 2010, VideoJS currently serves more than 400,000 websites across the internet. VideoJS is equally compatible on mobile devices as well as desktops.

    Some of the top features of VideoJS include:

    1. Plugin Support: VideoJS supports multiple plugins like analytics, advertising, playlists as well as support for advanced formats such as HLS and DASH. A full list of supported plugins can be found VideoJS plugin page.
    2. Skinning: Everything about VideoJS is customizable. You can easily customize the way it looks by editing the CSS style. Steve Heffernan has a codepen demo for customizing VideoJS skin that should help you get started.
    3. Ready adaptability to various plugins makes this player much more useful. Some sample plugins include:
      1. Analytics: Ability to track Google Analytics events from the VideoJS player
      2. Brand: You can add the logo of your brand to the player
      3. Playlist: Support for playlists
      4. Chromecast: Ability to cast a video to a device using a Chromecast device

    JW Player

    JW Player has been around for ages and was one of the most popular Flash video players for the web. Later on, it extended its support for HTML5 video playback. JW Player is completely customizable, has a responsive HTML5 video and has a large variety of features right from analytics support to accessibility and full HTML5 video controls.

    It has perhaps the best website video player with its wide array of video supported solutions. JW player also works very well as an HTML5 video player for WordPress websites. It can also be used as an alternate option for YouTube’s video player. Interestingly, before Google purchased YouTube, the original YouTube video player was based on JW Player.

    One of the key reasons that the JW Player is above its peers in this category because of the sheer amount of features it provides via a number of different add-ons. These can range from advertising partnerships to closed captions as well as popular social networking tools.

    As mentioned earlier, the player is completely customizable and supports a number of custom user-defined themes. It also comes with an integrated API. It has a number of different plugins to support the more popular CMSs, which makes integration fairly simple.

    Kaltura HTML5 Video Player

    Kaltura Player is a free-to-use, open source HTML5 video player that can be used to create multiple and custom inter-browser and inter-device skins that can match or complement the design of your website. The Kaltura player comes with numerous player templates to choose from.

    Some of the key features include:

    1. Robust, all-round Performance
    2. Multi-platform support
    3. Advertising & Analytics: It supports most ad formats including VAST v. 3.0 as well as integrated plugins that can be used across a wide range of video ad networks. These include Google’s Doubleclick Ad Platform, FreeWheel, Eye Wonder, Ad Tech, Tremor Video, AdapTV and many more.

    Flowplayer

    Flowplayer is an extremely simple video player for creators who wish to include video playback on their websites. Integrating and the markup process for Flowplayer is decidedly straightforward, which is one of its major benefits.

    At the outset, it is important to note that Flowplayer is primarily aimed at those creators who host video files independently. In case creators are using a streaming service such as Vimeo or YouTube, both streaming services provide code that can be used to embed the player itself onto the website or landing page.

    Flowplayer is 100% customizable as well as skinnable and comes with support for including subtitles, modifying the playback speed, including video analytics and monetization opportunities.

    Wistia

    Wistia is an HTML5 video player aimed at businesses. It is optimized to provide among the best in class viewer experience by supporting high-resolution videos and adaptive streaming. It prioritizes viewer engagement and can deliver video playback modified to a viewer’s environment and connection speed.

    It’s easy to use and lightweight embed codes allow to quick and simple integration to your website. It also optimizes videos based on the viewer’s screen size.

    Wistia’s inbuilt video analytics provides almost real-time and actionable data on how viewers are interacting with your videos, and which videos are performing the best in terms of conversion rates.

    Additional Tools/Libraries and Players

    Now that we have gone through our top 5 HTML5 video players, here are few more noteworthy mentions.

    Cloudinary Video Player

    Cloudinary HTML5 video player is a JavaScript-based media player that’s customizable and analytics ready. However, Cloudinary video player stands out from rest because it is closely integrated to video manipulation tools and services that they offer. The video transformations happen at the player level and happen on the fly. Moreover, you can plug in their video transcoder library with other HTML5 players using their API endpoints.

    Plyr

    Plyr is a simple, customizable and fairly light HTML5 video player. It also supports the YouTube video player. Its lightweight design makes it fairly popular among professionals and amateur content creators alike.

    Some key features include:

    1. All round support to screen readers as well as VTT
    2. Allows users to change its appearance to match the overall theme of their website
    3. Supports a wide range of editing and processing functionalities

    MediaElement.js

    MediaElement.js is an HTM5 based, highly advanced audio and video player. It makes use of Silverlight shims along with Flash. This enables it to have a consistent UI across all browsers.

    Some key features include:

    1. Designed with complete CSS as well as HTML support
    2. Uses WebTT to provide efficient standards of accessibility

    Afterglow Player

    Given its well-designed player interface, Afterglow Player provides a unique and highly responsive platform. It can support almost video elements with minimal effort, given its simple and straightforward initialization process.

    Its key features include:

    1. Easy setup and interactive user interface
    2. Support for a wide range of video file formats
    3. A comparatively faster response time

    Conclusion

    There is a wide range of options for HTML5 video players available today. The key to identifying the right choice for you is to find a player that can meet most or all of your video playback needs.

    It is important to ensure that you do end up using a video player that ends up being a bloated or unnecessarily heavy solution that is unable to deliver in the key areas you are would like to focus on.