How do I make sure encoded video plays on iPhone, Android, and browser?

To maximize compatibility across iPhone, Android, and browsers, encode to a very standard set of formats and settings:

Best “works almost everywhere” choice

• Container: MP4
• Video codec: H.264/AVC
• Audio codec: AAC-LC
• Pixel format: yuv420p

This is the safest baseline for:

• Safari on iPhone/iPad
• Chrome, Firefox, Edge on desktop
• Most Android browsers and apps

Recommended encoding settings

If you’re using ffmpeg, a good starting point is:

ffmpeg -i input.mov \
  -c:v libx264 -profile:v baseline -level 3.1 -pix_fmt yuv420p \
  -c:a aac -b:a 128k \
  -movflags +faststart \
  output.mp4

Why these settings matter

• libx264: H.264 encoding
• baseline: broad device compatibility, especially older iPhones
• yuv420p: required by many mobile devices/browsers
• +faststart: moves metadata to the start so the video can begin playing before fully downloaded

If you want better quality/compression

You can use a slightly more modern profile while keeping compatibility:

ffmpeg -i input.mov \
  -c:v libx264 -profile:v main -level 4.0 -pix_fmt yuv420p \
  -c:a aac -b:a 128k \
  -movflags +faststart \
  output.mp4

This is usually fine for modern devices, but baseline is the safest for widest support.

Avoid these if you need maximum compatibility

• HEVC/H.265 only: not universally supported in browsers
• VP9/AV1 only: good in browsers, but not as universally supported in all iOS/Safari cases
• MKV, AVI, WebM only: may fail on iPhone/Safari
• Odd pixel formats like yuv422p, yuv444p: can break playback on some mobile devices

Web delivery tips

Use HTML video with MP4 as the primary source:

<video controls playsinline>
  <source src="video.mp4" type="video/mp4">
</video>

Important:

• playsinline helps on iPhone so it doesn’t force fullscreen
• Serve with correct MIME type: video/mp4
• Use HTTPS if possible

For best coverage, provide multiple sources

If you want extra robustness, you can offer:

• MP4 (H.264/AAC) for universal fallback
• WebM (VP9/Opus) for browsers that support it well

Example:

<video controls playsinline>
  <source src="video.webm" type="video/webm">
  <source src="video.mp4" type="video/mp4">
</video>

Browsers will pick the first supported one.

Practical recommendation

If you only want one file, use:

• **.mp4
• H.264 video
• AAC audio
• yuv420p
• +faststart

If you want, I can give you:

1. a single ffmpeg command for your specific input, or
2. a recommended encoding ladder for adaptive streaming.