Encoding Video for Websites


These days there are many more web browsers in active use which are running on different devices. It is important to design and develop websites which are going to work on the majority of these platforms. HTML5 has many new offerings which intend to address many cross-comparability issues, and web browsers have been quite fast the uptake of this standard.

Despite this, there still isn’t a single video encoding which will work across the board (without additional components). I have been reading into this over the past few weeks and stumbled upon a solution. Video which is encoded as MPEG4 AVC (the H.264 codec) will play on just about everything except Mozilla Firefox. But, not to fear because there are Adobe Flash files which are able to stream H.264 encoded videos. So the idea is to utilise HTML5 H.264 video support for all browsers possible, and then fall back to Flash for other browsers.

This approach also means that video will play on devices like the Apple iPad.

When encoding video I found the following configurations to offer sufficient quality results at acceptable file sizes. I found this to be a process of trial and error to find something which was actually going to play smoothly at a good quality for my client.

  • Frame Rate: 25 fps
  • Video Bits per Second: between 300 Kbps and 1500 Kbps (Depending upon quality)
  • Audio Bits per Second: Either 128 Kbps or 256 Kbps
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s