5 советов, как оптимизировать видео для сайта
В одной из прошлых статей мы советовали помещать видео на главную страницу для лучшей конверсии сайта, но многие испугались, что это может понизить его работоспособность и ухудшить функционал. Важно оптимизировать видео вашего сайта для использования в Интернете. Оптимизируя видео как по размеру файла, так и по качеству изображения, вы можете значительно сократить время загрузки страницы и избежать отвлекающих факторов. Ниже вы найдете советы, как избежать замедления работы сайта и недовольных посетителей из-за видео.
Создавайте короткое видео
Одна из самых важных вещей, которые вы можете сделать, чтобы улучшить взаимодействие с пользователем – это минимизировать продолжительность видео. Даже при оптимизации видеофайлы имеют очень большой размер. Самый простой способ его уменьшить – отредактировать содержимое так, чтобы основное сообщение было на переднем плане. Если вы хотите, чтобы люди делились вашим контентом, помните: не говорите за 10 минут то, что можно сказать за две! Да и в целом, короткие видеоролики очень популярны в наши дни, к тому же их можно легко использовать в качестве сообщений почти во всех социальных сетях.
Удалите ненужный звук
Ваше видео служит фоном веб-страницы или воспроизводится с отключенным звуком? Если это так, убедитесь, что звуковая дорожка удалена, так как нет смысла отправлять аудиоданные пользователю, который их никогда не услышит. Для быстрого удаления звука попробуйте AudioRemover. Если ваше видео также нуждается в изменении размера или сжатии, перейдите к разделу «Сжатие видео», чтобы получить инструкции о том, как удалить звук при сжатии видео.
Используйте службу потокового видео
Возможно, самый простой способ оптимизировать постепенно загружаемое видео — удалить его с веб-сайта и разместить на специальном сервисе потокового видео. Эти сервисы действуют как сеть доставки контента, гарантируя, что ваши видео будут транслироваться с ближайших оптимизированных для видео серверов, обеспечивая максимально быстрое соединение. Есть много вариантов, от высокотехнологичных стартапов, таких как LucidVideo, до лидеров рынка, таких как YouTube.
Потоковое видео отличается двумя важными моментами. Во-первых, прогрессивная загрузка часто требует, чтобы большая часть видео была загружена, прежде чем видео начнет воспроизводиться. Это может привести к длительным зависаниям во время загрузки страницы, если соединение пользователя не быстрое и/или видео имеет высокий битрейт. Кроме того, потоковая служба может выбирать из нескольких различных версий видео для потоковой передачи, гарантируя, что зритель получит наилучшее сочетание скорости и качества. Например, сервер потоковой передачи может запускаться с более низким битрейтом и более быстрой загрузкой видеопотока, чтобы не приходилось ждать воспроизведения видео. Затем сервер переключится на поток более высокого качества.
В чем различия между самостоятельной загрузкой и потоковым видео? Большинство видеохостингов будут получать от вас один мастер-видеофайл, а затем динамически транслировать вашим пользователям одну из многих оптимизированных версий. Эти несколько версий вашего мастер-видео оптимизированы для различных сценариев просмотра, чтобы обеспечить наилучшие впечатления пользователей. Например, мобильному пользователю с подключением 3G будет отправлен меньший по размеру видеофайл с более быстрой загрузкой, чем пользователю настольного компьютера в сверхбыстрой корпоративной сети.
Видео можно сжать
Видео имеет диапазон размеров файлов в зависимости от степени сжатия. Это немного упрощение, но, по большей части, чем меньше сжатие применяется к видео, тем выше качество видео и больше размер файла, и наоборот. Это означает, что вам необходимо найти тонкий баланс между степенью сжатия видео и результирующим размером файла. Бесплатные инструменты, такие как Handbrake, сократят размер видео за счет сжатия, это популярный транскодер видео с открытым исходным кодом, используемый для оптимизации видео и конвертирования видеофайлов.
Он очень прост в использовании, но все же поясним:
1. Для начала выберите свое видео, нажав «Источник».
2. Укажите место сохранения видео в поле «Файл».
3. В поле «Качество» установите «Постоянное качество» примерно от 20 (хорошее) до 25 (приличное) . Эта функция автоматически устанавливает хорошее качество видео.
4. Установите флажок «Оптимизировано для Интернета».
5. Теперь нажмите кнопку «Пуск» и начните кодирование.
Если ваши настройки позволяют использовать несколько видеопотоков в зависимости от подключения пользователя, рекомендуется экспортировать три разных потока: один для медленных сотовых соединений, среднюю версию для лучшего мобильного подключения и более медленного Wi-Fi и высокую версию для быстрых соединений.
Измените размер видео
Наши современные камеры способны снимать видео с очень высоким разрешением. От 1080P FHD до 4K UHD. Эти видео отлично смотрятся на большом экране телевизора, но часто не требуют всех своих пикселей при отображении на веб-сайте. Оптимизируйте эти видео, запустив их через тот же Handbrake. Например, если вы сняли минутное видео с частотой 60 кадров в секунду и разрешением 4K на свой новый iPhone, в итоге вы получите файл размером 400 МБ. HD-видео так же чрезмерно велико, как и видео выше, но снятое в формате 1080P, весит оно 175 МБ.
Размер видео должен соответствовать тому, как вы планируете использовать его на своем веб-сайте. Для полноэкранного видео фона вы можете придерживаться разрешения 1920 × 1080 пикселей. Если ваше видео не предназначено для воспроизведения в полноэкранном режиме, а отображается только на небольшой части экрана, вы можете сэкономить значительный объем данных, уменьшив размеры в пикселях, чтобы они лучше соответствовали доступному пространству.
Важные советы!
• Используйте автозапуск только в тех случаях, когда это оправдано с точки зрения дизайна или маркетинга, либо когда видите в этом необходимость.
• Предоставьте пользователям с низкой пропускной способностью варианты: не все будут просматривать ваши видео при высокоскоростном широкополосном соединении. Предложите зрителям с более медленным подключением возможность просмотреть более сжатую версию вашего файла или вообще пропустить видео.
• Изменение размера видео для мобильных устройств. Если размер контента вашей страницы изменяется для мобильных устройств, ваш видеоконтент тоже должен измениться. Обязательно встраивайте видео, которые подстраиваются под возможности дисплея пользователя.
• Уважайте пространство экрана. Точно так же не прерывайте просмотр видео всплывающими окнами или рекламой, которые занимают ценное пространство экрана.