Imgix Video is now live! Learn more about our latest release here. →
Getting StartedBest PracticesNormalizing Video Input for the Web

Normalizing Video Input for the Web

The Video API accepts various video formats/codecs and will transcode or serve most video files without issues. Imgix will normalize ingested videos and process them through the Video API to do this.

This process takes time for Long-Form Videos, so videos will be unavailable to be streamed until they are normalized and processed by our service. Short-Form Videos, on the other hand, are quickly transcoded on demand.

You can also standardize it before serving videos with the Video API. Standardizing videos beforehand may potentially improve Video API performance.

You can see our requirements for standard video inputs below. Imgix will process the video for non-standard video inputs to ensure that each standard input is met.

Acceptable Video File Formats

We accept any video file format as input. To ensure successful processing of videos, an appropriate video content type should be defined both in the metadata of the video and in the header response when the video is requested from your Origin.

Standard Inputs

For all of the Video API

  • 1080p/2K or smaller: Video resolution up to 2048x2048 are considered standard, including 1080p (1920x1080) video. Any videos considered larger than this will be normalized to 2048x2048.
  • H.264 video codec: H.264 is the video codec most used today and is supported by almost every device. While Imgix accepts other CODECs as input, we will normalize all other CODECs to H.264.  
    We highly recommend using the H.264 codec for your Origin files. You will observe the best performance and quality when using H.264. Processing time will also be faster.  

For Long-Form Videos

  • Max 10-second keyframe interval: Streaming using HTTP-based streaming methods (ex, HLS) requires keyframe intervals to be less than 10 seconds. We will limit it to less than 10 seconds if it is larger.
  • Closed GOP (group-of-pictures): Any open-GOP video will be normalized to closed-GOP. Closed-GOP is the default for most video inputs, so if you’re trying to optimize and are unsure where to find this setting, you can most likely ignore it.
  • 8Mbps or below: We normalized bitrates to 8Mbps and below - bitrates should also not exceed 16Mbps for any single GOP. This is because higher bitrates are typically difficult for most user connections.
  • 8-bit 4:2:0 or below: Color depth and chroma subsampling will be normalized to 8-bit 4:2:0. This means that high dynamic range video (HDR) will be normalized to SDR, which can result in color changes in the video output.
  • Simple Edit Decision Lists: Edit Decision Lists (EDL)‘s added during post-production with complex EDLs will be normalized to Simple EDLs.
  • Frame rate between 5 and 120: Video frame rates within the range of 10 to 120 will be preserved. Video with less than 10 fps or greater than 120 fps will be normalized to 30 fps.
  • Square Pixel Aspect Ratio: Pixel Aspect Ratio is the ratio of a pixel’s width to the height of that pixel. The value 1:1 represents the Square Pixel Aspect Ratio. Videos with other values will be normalized to a 1:1 Square Pixel Aspect Ratio.
  • AAC audio codec: AAC is the audio codec most used today and is supported by almost every device. While Imgix accepts other CODECs as input, Imgix will normalize other audio CODECs to AAC audio.
  • 12-hour duration: Any video’s maximum duration is 12 hours. If a video is longer than this, it will be cut short.

For Short-Form Videos

  • Max 4096x4096 resolution: Video resolution larger than the limit will be normalized to 4096x4096 when processed. This is the maximum resolution for short-form videos.

Modifying Videos for Standard Input

You can use several different tools if you wish to normalize your videos before serving them with the Video API.

Using ffmpeg

ffmpeg is an open-source CLI tool that can modify video files. To use ffmpeg to normalize an Imgix video before using the Video API, follow these instructions:

  1. Install ffmpeg
  2. Using your CLI, navigate to where your video file is
  3. Assuming input.mp4 is your video file and out.mp4 is the output file, if you want to save it, run this command:
ffmpeg -i input.mp4 -c:a copy -vf "scale=w=min(iw\,1920):h=-2" -c:v libx264 \
-profile high -b:v 7000k -pix_fmt yuv420p -maxrate 16000k out.mp4

Feel free to modify this using different presets if they meet Imgix’s standard input guidelines.

Using your mobile device

Most mobile devices capture H.264 8-bit 4:2:0 video by default, though there are some things to watch for when recording video that will be served using the Video API:

  • The total file bitrate should be below 8 Mbps.
  • Use SDR (standard dynamic range) instead of HDR (High dynamic range) for recording.
  • The output file should be 1080p. If it is larger (such as 4k), Imgix will rescale the video so that it is served in 1080p.

Conforming your videos to the standard input guidelines is unnecessary, but it can be done to optimize your video processing times and input fully.

Non-Standard Input

Regardless of whether or not a video meets the Imgix video standards, Imgix will still be able to transcode the video and serve it.

However, in the case of a non-standard video input, Imgix will be required to normalize the video input before transcoding. This means that non-normalized videos will:

  • Take longer to process due to the standardizing process
  • Have static standard input format settings applied
  • For example, if the included frame rate is standard (10-120 fps), Imgix will respect it. If it is non-standard, we will convert it to 30 fps

Playing Videos on the Web

Short-Form Video is designed to be played on the web and can be used with any video player that supports the MP4 format. This includes most modern web browsers, mobile devices, and smart TVs.

Long-Form Video transcodes your videos into a streamable format that requires a specialized video player to play on some browsers and devices.

The example below uses hls.js to create an embeddable web player that can be played on any web page or device.

<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
 
<video
  id="my-player"
  controls
  style="width: 100%; max-width: 1500px;"
  crossorigin="anonymous"
/>
 
<script>
  const video = document.querySelector("#my-player")
  const src =
    "https://assets.imgix.video/videos/girl-reading-book-in-library.mp4?fm=hls"
  if (video.canPlayType("application/vnd.apple.mpegurl")) {
 video.src = src
  } else if (Hls.isSupported()) {
    const hls = new Hls()
 hls.loadSource(src)
 hls.attachMedia(video)
  } else {
 console.error(
      "This is a legacy browser that doesn't support Media Source Extensions",
 )
  }
</script>

This creates the following video element:

 
Ensuring Origin DeliverabilityUnderstanding Origin Images