GIFs can be up to 12 times as expensive in bandwidth and twice as expensive in energy use when compared to a modern video codec. Instead, use H.264-encoded MP4 files for animations; for example:
<img src="explosion.mp4" alt="An explosion of colors.">
By placing your videos in elements, the content loads faster, uses less battery power, and gets better performance.
To maintain compatibility with other web browsers, also include a fallback image:
<picture> <source srcset="explosion.mp4" type="video/mp4"> <img src="explosion.jpg" alt="An image of an explosion."> </picture>