# How to Optimize Video Encoding for Web Delivery

# How to Optimize Video Encoding for Web Delivery

The video files that come out of your processing pipeline are not automatically ready for the web. Unoptimized video means slow loading times, buffering, excessive bandwidth usage, and poor mobile experience. Here is how to encode video specifically for web delivery.

## The Web Delivery Requirements

Video served on the web needs to satisfy three constraints simultaneously:

**Quality.** The video must look good on the target device. For short-form social content, 1080x1920 at 30fps is the standard.

**File size.** Smaller files load faster and cost less to serve. Every megabyte matters for mobile users on cellular connections.

**Compatibility.** The video must play in all target browsers and platforms without requiring plugins or special codecs.

## The Universal Web Format

H.264 video with AAC audio in an MP4 container remains the safest choice for universal web compatibility. Every browser, every phone, and every social platform supports this combination.

For newer applications where you control the player, H.265 (HEVC) or AV1 offer significantly better compression (30 to 50 percent smaller files at equivalent quality) but with less universal support.

## Key Encoding Settings

### Constant Rate Factor (CRF)

CRF is the primary quality control. Lower values mean higher quality and larger files. The practical range:

- CRF 18: Visually lossless, large files
- CRF 23: Good quality, reasonable file size (FFmpeg default)
- CRF 28: Acceptable quality, small files

For social media Shorts, CRF 23 is the sweet spot. This is the quality level that platforms like [ClipSpeedAI](https://clipspeed.ai) use for their output. The content is viewed on small phone screens where subtle quality differences are invisible, but compression artifacts at CRF 28 and above become noticeable.

### Encoding Preset

FFmpeg's preset setting controls the tradeoff between encoding speed and compression efficiency:

- ultrafast: Very fast encoding, larger files
- medium: Balanced (recommended default)
- slow: Slower encoding, better compression

For production pipelines where encoding speed matters, medium is the right choice. The file size difference between medium and slow is typically under 10 percent, not worth the 3 to 4x increase in encoding time.

### Fast Start

The `-movflags +faststart` flag is critical for web delivery. It moves the video's metadata (moov atom) to the beginning of the file, allowing browsers to start playing before the entire file is downloaded. Without this flag, the browser must download the entire file before playback begins.

This single flag is the most impactful optimization for web video playback experience.

### Bitrate Considerations

For social media platforms that re-encode your uploads, encode at a bitrate slightly above the platform's target. This gives the platform's encoder enough quality headroom to maintain visual fidelity after re-encoding.

For YouTube Shorts: 5 to 8 Mbps for 1080x1920 is appropriate. For direct web delivery where no re-encoding occurs: 2 to 4 Mbps is typically sufficient.

## Audio Optimization

Audio often gets overlooked but impacts both file size and user experience:

- AAC at 128kbps is standard for spoken content
- Stereo is unnecessary for most short-form content; mono halves audio file size
- Normalize audio levels so users do not need to adjust volume
- Remove silent segments at the beginning and end of clips

## Mobile-First Optimization

Most short-form video is consumed on phones. Optimize accordingly:

**Resolution.** 1080x1920 is the standard for vertical content. Higher resolutions waste bandwidth without visible quality improvement on phone screens.

**Frame rate.** 30fps is standard. 60fps doubles the file size with minimal perceptual improvement for most content types.

**Adaptive bitrate.** If you control the player, implement adaptive bitrate streaming (HLS or DASH) to serve different quality levels based on the viewer's connection speed.

## The Processing Pipeline Approach

Platforms like [ClipSpeedAI](https://clipspeed.ai) handle all of these optimizations automatically. When clips are generated, they are encoded with web-optimized settings, fast start enabled, appropriate bitrate and quality settings, and proper format for universal compatibility.

For developers building custom pipelines, encode your web delivery settings as a standard FFmpeg command template that you apply to every output file. Test the output on multiple devices and connection speeds before settling on your settings.

## Verification Checklist

Before deploying encoded video to production:

1. Does the file play in Chrome, Safari, and Firefox?
2. Does playback start quickly without buffering?
3. Is the file size reasonable for the resolution and duration?
4. Is audio properly normalized?
5. Does the video look acceptable on both phone and desktop screens?

Run this checklist against your encoding settings once, or use a platform like [ClipSpeedAI](https://clipspeed.ai) that handles all encoding optimization automatically. After that, your pipeline will produce consistently optimized output for every video it processes.