Как выбрать формат и кодек для видео на сайте

Если нужно загрузить видео на сайт и рассчитывать на воспроизведение на компьютерах и смартфонах, отправная точка — файл MP4 с видео H.264 и звуком AAC. Это сочетание поддерживается большинством современных браузеров и устройств. Но расширение .mp4 само по себе ничего не гарантирует: в контейнере могут находиться разные кодеки, а размер файла зависит не только от формата, но и от длительности, разрешения и битрейта.

Если ролик будет встроен с YouTube, VK Видео, RuTube или другой платформы, обычно не нужно самостоятельно подбирать формат для сайта: сервис принимает исходный файл по своим правилам и готовит версии для воспроизведения. При самостоятельном размещении видео выбор формата и ответственность за доставку файла остаются на владельце сайта.

Формат и кодек — не одно и то же

Формат файла, или контейнер, объединяет видео, звук и служебные данные. MP4, WebM и MOV — контейнеры. Кодек отвечает за сжатие и последующее декодирование изображения или звука. Например, MP4 может содержать видео H.264 и звук AAC — это распространённый вариант для веба.

При проверке файла важно выяснить не только его расширение, но и кодеки внутри. Один файл с окончанием .mp4 может открываться в браузере, а другой — нет, если использует неподдерживаемый кодек или его вариант. Информацию о кодеках можно посмотреть в свойствах файла через MediaInfo или похожую программу.

Контейнер и кодеки	Где уместны	Что учитывать
MP4: H.264 и AAC	Основной вариант для самостоятельного размещения и HTML5-плеера	Широкая совместимость; качество и размер зависят от настроек кодирования
WebM: VP9 или AV1, звук Opus	Дополнительная версия для браузеров и устройств с поддержкой этих кодеков	Поддержка зависит от браузера и устройства; перекодирование AV1 может занимать больше времени
MOV	Чаще исходник для монтажа, а не готовая версия для сайта	Внутри могут быть кодеки, неудобные для воспроизведения в браузере
HEVC/H.265	Сценарии, где заранее проверена поддержка целевых устройств	Совместимость между браузерами и платформами менее предсказуема, чем у H.264

Что выбрать для обычного сайта

Для одного файла, который нужно разместить в WordPress или подключить через HTML5, выбирайте MP4 с H.264 и AAC. Это практичный вариант, когда важнее всего, чтобы ролик без лишних условий открылся у посетителя. При этом MP4 не означает «маленький файл»: ролик в высоком разрешении с большим битрейтом может весить много.

WebM можно подготовить как дополнительный источник, если вы контролируете плеер и хотите предложить поддерживаемым браузерам альтернативу. Для большинства небольших сайтов не обязательно хранить по две версии каждого ролика: дополнительные файлы занимают место и требуют отдельного контроля. AV1 способен дать эффективное сжатие, но результат зависит от настроек, а декодирование и кодирование — от оборудования и программ. Не стоит переводить всю видеотеку в AV1 без проверки, что целевые устройства его поддерживают.

HEVC также не лучший универсальный выбор для публичной страницы: поддержка зависит от браузера, операционной системы и устройства. Если аудитория использует разную технику, оставьте H.264 основной версией, а альтернативные кодеки добавляйте только после тестирования.

Как уменьшить файл, не испортив ролик

На размер сильнее всего влияют длительность и битрейт — количество данных, используемых для каждой секунды видео. Разрешение и частота кадров тоже важны, но уменьшение разрешения не всегда даёт приемлемое изображение, а повышение битрейта выше необходимого увеличивает файл без заметной пользы. Для динамичной сцены, например спорта, обычно требуется больше данных, чем для статичной записи говорящего человека.

Перед экспортом определите, где и как будут смотреть ролик. Для небольшого видео в статье может быть достаточно 720p; для демонстрации интерфейса, мелких деталей или полноэкранного просмотра может понадобиться 1080p. Не делайте исходник больше, чем требует сценарий: видео 4K, показанное в небольшом блоке страницы, часто не оправдывает увеличенный объём и время загрузки.

Если вы сами перекодируете исходник с помощью FFmpeg, пример базового преобразования в MP4 с H.264 и AAC выглядит так:

ffmpeg -i input.mov -c:v libx264 -crf 23 -preset medium -c:a aac -b:a 128k -movflags +faststart output.mp4

Параметр -crf задаёт компромисс между качеством и размером для кодека H.264: меньшее значение обычно даёт более высокое качество и больший файл. Значение 23 — лишь начальная точка, а не гарантия нужного результата; проверьте готовое видео на сложных и динамичных фрагментах. Если установленная сборка FFmpeg не включает нужные кодеки, команда не выполнится. Флаг +faststart переносит служебные данные MP4 в начало файла, чтобы воспроизведение через HTTP могло начаться до загрузки всего ролика.

Когда лучше использовать видеохостинг

Если видео длинное, его смотрят часто или у сайта ограничены дисковое пространство и трафик, обычно разумнее встроить ролик с видеоплатформы. Сервис хранит и доставляет видео, а также может подбирать качество под соединение и устройство. Возможности, правила загрузки и оформление плеера у YouTube, VK Видео, RuTube и Дзена отличаются; проверяйте требования именно выбранной платформы. Не считайте, что параметры одной платформы автоматически действуют на другой.

В WordPress ролик с платформы можно добавить через блок встраивания, если конкретный сервис поддерживается редактором, либо вставить предоставленный сервисом код iframe. Такой способ не требует самостоятельно готовить версии видео для разных браузеров, но воспроизведение зависит от доступности исходной платформы и самого ролика. Если автор удалит видео, изменит доступ или сервис перестанет показывать его посетителям, на вашей странице ролик тоже может пропасть.

Внешний плеер способен загружать дополнительные скрипты и обращаться к серверам платформы. Поэтому страница с встраиванием не всегда загружается так же быстро, как страница без видео, даже если сам ролик ещё не запущен. Для тяжёлых встраиваний может помочь отложенная загрузка плеера или его появление после нажатия посетителя; конкретная реализация зависит от платформы, темы и используемых плагинов.

Самостоятельная загрузка в WordPress: что проверить

Стандартный блок «Видео» в редакторе WordPress подходит для подключения собственного файла, а блоки встраивания — для поддерживаемых видеосервисов. WordPress не превращает загруженный ролик автоматически в совместимые версии с разными кодеками. Если загрузить неподходящий файл, его обработка в медиатеке не исправит совместимость.

Учитывайте не только формат, но и возможности хостинга. Большие файлы занимают дисковое пространство и при каждом просмотре передаются с сервера, расходуя трафик. Ограничения на размер загрузки и доставку зависят от конфигурации WordPress, PHP, веб-сервера и тарифа. Если ролики крупные или просмотров много, обсудите видеохостинг либо объектное хранилище/CDN с провайдером, а не рассчитывайте, что обычный виртуальный хостинг без последствий будет раздавать любой объём видео.

При вставке собственного файла через HTML5 можно указать несколько источников. Браузер проверит их по порядку и использует тот, который умеет воспроизводить:

<video controls playsinline preload='metadata' poster='/wp-content/uploads/video-poster.jpg'>
  <source src='/wp-content/uploads/video.mp4' type='video/mp4'>
  <source src='/wp-content/uploads/video.webm' type='video/webm'>
  Ваш браузер не поддерживает воспроизведение видео.
</video>

Этот пример не создаёт альтернативные файлы — MP4 и WebM нужно подготовить и загрузить отдельно. Атрибут poster задаёт изображение до запуска ролика, controls показывает элементы управления, а preload='metadata' просит браузер предварительно загрузить сведения о видео, а не весь ролик. Фактическое поведение предварительной загрузки может зависеть от браузера. Если для сайта важнее всего совместимость и у вас только MP4, достаточно одного источника.

Как проверить результат до публикации

Откройте страницу не только в браузере, где готовили публикацию. Проверьте ролик в актуальных версиях Chrome и Safari, а также на смартфоне: мобильные браузеры используют разные устройства декодирования, и поведение может отличаться. Убедитесь, что видео запускается, звук воспроизводится, пропорции не искажены, а постер отображается до нажатия. Проверьте также, что файл доступен без авторизации и не блокируется настройками CDN или сервера.

Для самостоятельного файла оцените страницу при обычной загрузке и при медленном соединении. Если ролик заметно тормозит, сначала проверьте размер и битрейт файла, затем — способ доставки и настройки загрузки плеера. Если видео встроено с платформы, сравните результат с её страницей просмотра: проблема может быть в доступе к ролику или работе сервиса, а не в формате сайта.

Итоговый выбор для большинства случаев прост: для собственного файла используйте MP4 с H.264 и AAC, подбирайте разрешение и качество под размер блока и содержание ролика, а большие видео передавайте через видеохостинг или подходящую инфраструктуру доставки. WebM и другие кодеки добавляйте, только если понимаете, зачем нужна дополнительная версия и проверили её на устройствах своей аудитории.