I am having some trouble getting the banner/background videos to play on mobile on the site I am working on for a small private school: www.applewild.org
The vimeo link is here:
I realize that Squarespace doesn't control whether the background video is shown on mobile devices - it is controlled by the mobile browser, and I have suggested to them that they change the resolution of the video to 720 instead of 1080 to see if that makes the video small enough for more mobile devices to process but they are pushing back, saying "to have beautiful high-res videos and not be able to share them is disappointing. The browsers that we've noticed aren't supporting the videos are actually on NEW phones, not old ones, so I don't think the problem is going to go away until there's a squarespace solution. I'd love to figure out a game plan for how to find a fix as soon as possible." I don't know what "fix" there is, other than what I've already suggested (and they haven't tried). The feature is not designed for high-resolution video streaming, I don't think. Has anyone encountered this issue or have any insight?
Actually, it is controlled at OS level rather than browser level. Android and iOS have both blocked autoplay background video until recent releases.
The attributes needed for autoplay to work are
The first two apply to Android and iOS, the third is iOS only.
Even then there are numerous exceptions that can prevent autoplay from working.
If the video has a soundtrack
if the device is in Low Power or Battery Saver mode
some browsers apply the muted attribute incorrectly and this blocks playback