Как вставить видео на сайт

Опубликовано Июн 21, 2012 в HTML/CSS, Разное, Создание сайтов | Нет комментариев

Как вставить видео на сайт

Подробное руководство о том, как вставить видео на свой сайт.

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

В настоящее время есть несколько способов поместить видео на сайте, первый — это поместить обычный файл, непосредственно, у себя на сервере или хостинге, второй – поместить файл на специализированном сервисе, а полученный код  вставить у себя на страницах сайта.

Причем второй способ рекомендуем и очень прост в реализации. Большинство, профессиональных, сервисов предоставляют правильный html код, который вставляется простым копированием в любом месте сайта. Нужно отметить что — современные системы управления контентом сами могут, самостоятельно, распознать код, популярных, сервисов нужна лишь ссылка на страницу с видео.  Приведу, пару примеров таких видеохостингов:   одним из самых популярных является youtube.com, vimeo.com, rutube.ru video.yandex.ru и др.

Большее количество площадок для размещения своих видео роликов можно посмотреть по адресу: http://yaca.yandex.ru/yca/cat/Computers/Internet/Hosting/videohosting/

Принцип интеграции, полученного, кода с сайтом идентичен, поэтому примером будет один из самых популярных видеохостингов «youtube.com». После того как видео загружено его можно посмотреть как на самом сайте «youtube.com» так и реализовать возможность просмотра виде на своем сайте. Для этого нужно перейти на страницу с нужным видео, снизу под плеером есть кнопка с надписью «поделиться» нажав не нее, откроется скрытое окно, в котором будет отображен адрес с расположенным видео и еще две кнопки: «Сгенерировать html код» и «отправить по электронной почте». Для того что бы сайт сгенерировал нужный код отвечает кнопка: «Сгенерировать html код», после её нажатия откроется, дополнительное, окно с настройками.

Видео

После всех настроек нужно скопировать сгенерированный код и вставить в любом месте на своем сайте между тегами «<body>».  В современных системах управления контентом, таких как wordpress, реализована возможность вставлять, только, адрес (выше на рисунке отмечено поле с адресом станицы) в других cms данная возможность реализована с помощью плагинов и расширений.

Примером будет cms «wordpress». Первое что нужно сделать — это убедиться, что, Парметры -> Медиафайлы, включено автоматическое внедрение.

 Убедившись, что все настройки сделаны правильно нужно скопировать ссылку и вставить в визуальном редакторе cms «wordpress».

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

Сейчас поговорим о том, когда файл расположен на сервере. Данная реализация делится на несколько способов: с применением html 5, с помощью плееров или плагинов для cms, которые реализую внедрение данных плееров.

На данный момент, пока html 5 браузеры поддерживают не в полном объеме, многие сайты используют технологию, когда в браузер установлен плагин  «flash» от Adobe или «silverlight» от Micrisoft, а на сайте установлен плеер, который в связке с плагинами проигрывают видео на сайте. Пример таких плееров можно найти на сайте «longtailvideo.com» в разных реализациях как для flash так и silverlight. Подробная инструкция по подключению данного плеера описана на предложенном немного выше сайте.

Поддержка браузерами HTML5-видео это не все проблемы, с которыми может столкнуться вебмастер.  Причиной тому различные видео форматы и не все форматы совместимы с потоковым видео, также есть платные форматы, т.е. разработчик браузера обязан платить за каждую установленную копию браузера у конечного пользователя. И если у таких разработчиков как Microsoft или Apple стоимость лицензии за данные контейнеры входит в состав самой операционной системы или приобретена отдельно, то бесплатные Firefox или Opera отказались оплачивать данную лицензию, соответственно, в разных браузерах поддерживаются разные форматы видео.

Напрашивается вопрос: “как поместить видео на, своем, сервере и его можно, было, смотреть во всех браузерах”?  Чтобы видео можно было смотреть на всех платформах и устройствах, оно должно быть в нескольких форматах, в теге <video> указать ссылку на все форматы.

Оставить комментарий

Ваш e-mail не будет опубликован.