Background video siza and quality

Design help General
1

Hi, I have a video that I exported at a nice high quality. i can make it any size and export.

Currently a very wide 3840 x 800 - looping and just 30 seconds long.

The idea is it acts as a nice wide banner on larger format screens and can be moved around as is gets smaller on responsive sizes.

File size is below the upload limit.

I have the following issues:

  1. The quality of the background video once in the component is really poor, artifacts and pixelation. It also appears desaturated slightly as well.
  2. There appears to be no way to move or center the video within the component. I would want to adjust the position in different responsive layouts, as one would with an image or any other asset
  3. It appears to be scaled. so changing the size of the componant simply crops the video rather than scaling it.

i feel I am missing some basic info here on how to get this crisp and working.

Here is my site Read-Only: https://preview.webflow.com/preview/chalk-films?utm_medium=preview_link&utm_source=designer&utm_content=chalk-films&preview=a1ff34e79c70f284a32f4525a861d232&pageId=5eaee20d6c54ed7b4f9bf960&mode=preview
(how to share your site Read-Only link)

2

Background videos set to cover will do just that, cover the background. You additionally can position it vertically and horizontally within the container. As for the quality, you might want to try to export at a quality that is almost at Webflow’s upload limit to compensate for artifacting. But to make the site load with a video of that size, it’s going to compress the crap out of it. I’d suggest changing the size of your video to something smaller because no one is going to load your site at 3840 px wide, ever. My giant ultra wide monitor isn’t even that large.