Автовоспроизведение видео без звука поддерживается Chrome для Android, начиная с версии 53. Воспроизведение видео автоматически начинается, как только оно появляется в поле зрения, если включены и autoplay , и muted . Воспроизведение видео без звука можно запустить с помощью функции play() . Ранее воспроизведение на мобильных устройствах приходилось запускать жестом пользователя, независимо от того, был ли звук отключен.
<video playsinline autoplay muted>
<source src="video.webm" type="video/webm" />
<source src="video.mp4" type="video/mp4" />
</video>
Вы можете увидеть это в действии, посетив этот пример . Воспроизведение видео muted начинается автоматически в Chrome 53 и более поздних версиях.
Кроме того, теперь можно запустить воспроизведение без звука с помощью метода play() . Раньше play() запускал воспроизведение только в случае, если оно было вызвано жестом пользователя, например, нажатием кнопки. Сравните следующие две демонстрации для Android — попробуйте их в Chrome 53, а затем в более старой версии:
Мы рекомендуем использовать атрибут autoplay всегда, когда это возможно, а метод play() — только при необходимости.
Можно программно включить звук видео в ответ на жест пользователя, например, click , но если вы попытаетесь включить звук видео программно без жеста пользователя, воспроизведение приостановится.
Изменение muted autoplay также позволит использовать play() с элементом video , не созданным в DOM, например, для управления воспроизведением WebGL .
Метод play() также возвращает обещание , которое можно использовать для проверки того, включено ли программное воспроизведение без звука. Пример можно найти на сайте simpl.info/video/scripted .
Почему произошли изменения?
В предыдущих версиях Chrome на Android автовоспроизведение было отключено, поскольку оно может мешать работе браузера, потреблять много трафика и не нравится многим пользователям .
Отключение автовоспроизведения привело к непреднамеренному эффекту, вынудив разработчиков прибегнуть к альтернативным вариантам, таким как анимированные GIF-изображения, а также к хакам <canvas> и <img> . Эти методы значительно хуже оптимизированного видео с точки зрения энергопотребления, производительности, требований к пропускной способности, стоимости передачи данных и использования памяти. Видео может обеспечивать более высокое качество, чем анимированные GIF-изображения, с гораздо лучшим сжатием: примерно в 10 раз в среднем и до 100 раз в лучшем случае. Декодирование видео в JavaScript возможно , но это сильно расходует заряд батареи.
Сравните следующее: первое — видео, второе — анимированный GIF-файл:
Они выглядят довольно похоже, но размер видео составляет менее 200 КБ, а анимированного GIF-файла — более 900 КБ.
Chrome и другие производители браузеров крайне бережно относятся к пропускной способности интернет-соединения. Для многих пользователей высокая стоимость передачи данных зачастую является более серьёзным препятствием для доступа, чем плохое соединение. Учитывая распространённость обходных путей, отключить автовоспроизведение без звука невозможно, поэтому платформа может предложить только качественные API и настройки по умолчанию.
Интернет становится всё более медиацентричным . Дизайнеры и разработчики продолжают находить новые и непредвиденные способы использования видео, стремясь к единообразию на всех платформах, например, при использовании фонового видео в качестве элемента дизайна. Функция автовоспроизведения без звука обеспечивает такую функциональность как на мобильных устройствах, так и на компьютерах.
Тонкости
- С точки зрения доступности автовоспроизведение может быть особенно проблематичным . В Chrome 53 и более поздних версиях на Android есть возможность полностью отключить автовоспроизведение: в настройках мультимедиа выберите «Автовоспроизведение».
- Это изменение не затрагивает элемент
audio: автовоспроизведение по-прежнему отключено в Chrome на Android, поскольку отключенное автовоспроизведение не имеет особого смысла для аудио. - При включенном режиме экономии трафика автовоспроизведение отключено. Если включен режим экономии трафика, автовоспроизведение отключается в настройках медиафайлов.
- Отключенное автовоспроизведение будет работать для любого видимого видеоэлемента в любом видимом документе, iframe или другом.
- Помните, что для того, чтобы воспользоваться новым поведением, вам нужно добавить как
muted, так иautoplay: сравните simpl.info/video с simpl.info/video/muted .
Поддерживать
- Функция автовоспроизведения без звука поддерживается Safari на устройствах iOS 10 и более поздних версиях.
- Автовоспроизведение, как отключенное, так и выключенное, уже поддерживается на Android браузерами Firefox и UC Browser: они не блокируют никакой вид автовоспроизведения.