## Hero Videos
1. Try and avoid hero videos
2. Use a Lottie if possible
3. Use handbrake to compress videos
### Optimal Encoding Settings
* Resolution: 1600x900 for Quality, 1280x720 for Speed
* Framerate: 24fps / 30fps
* Codec: VP8. Avoid VP9 or AV1. H.264 when compatibility is a must.
* Container: Use WEBM, avoid MP4 containers.
>[!tip] You can use the `<source>` tag to have multiple elements. Only one will be fetched. ([[#^666953|1]])
# References
1. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/source ^666953