Видео – мощный инструмент для привлечения и вовлечения пользователей. Видеоформат уже сейчас называют одним из трендов настоящего и будущего, его популярность в рекламе постоянно растет. Уже сейчас на видео приходится более 70% всего потребительского интернет-трафика. Чуть меньше половины пользователей (43%) хотели бы получать еще больше контента в видеоформате. Да и самим маркетологам выгодно использовать видео: 4 из 5 пользователей принимают решение о покупке на основе просмотренного видео. Кроме того, компании, которые используют видео в рекламе, имеют на 27% выше CTR и на 34% выше уровень конверсии.
В общем, есть множество причин использовать видео, в том числе и на своем сайте. Однако тут встает вопрос об оптимизации: как использовать видео не во вред своему сайту? Об этом и пойдет речь в статье.
Выбираем формат видео для сайта
Для платформ YouTube и Vimeo стандартными форматами являются MP4 и WebM. MP4 поддерживают все браузеры, в то время как WebM сейчас поддерживают только Chrome и Firefox. Видеоролики в формате WebM, как правило, весят меньше, чем MP4-файлы, однако MP4 смотрятся чуть лучше на портативных девайсах.
Далее оптимизация разделяется на два пути:
- оптимизация видео для сайта,
- оптимизация сайта под видео.
Рассмотрим оба типа работ.
Оптимизация видео для сайта
Что нужно сделать для того, чтобы видео на сайте грузилось быстро.
Уменьшение веса видеофайла
Специальные программы вроде Blazemp или HandBrake позволяют уменьшить размер файла без ухудшения его качества. Более легкие файлы загружаются быстрее, а это значит, что сжатие файлов поможет сэкономить время, требующееся на загрузку страницы.
Главное, не переборщить и не сделать сильное сжатие в ущерб качеству; все-таки видеоролики с высоким разрешением выглядят более интересно и профессионально, а видео низкого качества может оставить у пользователей плохое впечатление от посещения сайта.
Конвертация в поддерживаемые HTML5-форматы
Используйте онлайн-конвертер для того, чтобы переконвертировать видео в форматы MP4 или WebM.
Удаление звука (если он не используется)
Даже если у вас видео без звука, в нем все равно можно убрать данные об аудио, чтобы уменьшить размер файла. Это можно сделать либо на этапе экспортирования видео (если вы делаете его самостоятельно), либо при помощи простого редактора, например, FFmpeg.
Оптимизация сайта под видео
Что нужно сделать, чтобы видео отображалось корректно.
Точный размер видео
Обязательно укажите в HTML или CSS размеры видео по вертикали и горизонтали – так браузеру будет проще определиться с пропускной способностью.
Загрузка видео после загрузки страницы (Lazy Load)
Если у вас есть видео, которое начинает проигрываться автоматически после того, как пользователь зашел на страницу, отложите его загрузку до того момента, когда загрузятся все остальные элементы на странице. Так у пользователей сложится более приятное впечатление от сайта.
Мобильные пользователи
Все больше людей выходят в сеть через портативные девайсы, поэтому сайты, не оптимизированные под мобильные устройства, изначально проигрывают оптимизированным сайтам.
Следуйте принципам адаптивного дизайна: ваш сайт должен нормально отображаться на дисплеях с разным разрешением и разных размеров; также сайт должен понимать ориентацию устройства для того, чтобы корректно проигрывать видеоролики.
Сделать так, чтобы сайт нормально отображался на разных устройствах, будет непростой даже для опытного фронтендщика. Да, можно сделать отдельную версию сайта специально для мобильных устройств, но есть более простой способ приспособить сайт под портативные нужды.
Допустим, на главной странице сайта есть видео, которое на мобильных устройствах выглядит не очень хорошо. Тогда можно просто запретить видео грузиться на портативных девайсах с небольшими экранами. Надо добавить в CSS такой код:
@media screen and (max-width: 650px) { #hero-video { display: none; } }
Советы для SEO-специалистов
И несколько советов, которые касаются SEO.
Да, сейчас есть популярные площадки для размещения видео – тот же YouTube. Однако если вы хотите продвинуть сайт в Google, размещать видео нужно на своем ресурсе. Если вы разместите видео на YouTube и дадите ссылку на свой сайт, то поисковые системы отдадут предпочтение YouTube, и в результате кто-то, кто ищет вашу компанию в Google, попадет на YouTube, а не на ваш сайт.
Другие советы:
- Пишите метаданные для видеороликов (чтобы они проще индексировались).
- Придумывайте видеороликам описательные (а не общие) названия. При этом название не должно быть длинным; также советую использовать ключевые слова.
- Подбор ключевых слов может потребовать некоторых усилий (и времени), зато это повысит шансы вашего видео появиться в поисковой выдаче.
- Выберите подходящую миниатюру (это важно).
Заключение
Если перед добавлением роликов на сайт вы их оптимизируете, то появление видео на сайте окажет минимальное влияние на производительность – в отличие от конверсии, которая может значительно вырасти.
Экспериментируйте с видео: ставьте его в разные места сайта, анализируйте, что больше нравится вашим пользователям.
В конце концов, оптимизировать видео не так сложно, как сделать по-настоящему интересный ролик. Удачи!
Комментарии