Если сравнить существующий сегодня YouTube с тем, который был еще 5-7 лет назад, то это совершенно два разных понятия……
Сотни терабайт эксклюзивного контента, постоянно растущая аудитория и – поменялось многое, но об о всем по порядку…………………….
→ Еще в преддверие 2017 года руководство YouTube анонсировало новый проигрыватель HTML5.
Интересно, что первое время у пользователей было право выбора, но теперь всем принудительно навязали новый браузер .
Не удивительно, что у новой функции появились сторонники и противники, поэтому ниже мы расскажем о технологии html5 на YouTube, а также как ее отключить ↓↓↓
Многие пользователи YouTube в конце 2016 года стали наблюдать проблемы с работой сервисом!!!
Как оказалось, причина крылась в очередной новинке – проигрывателе видео html5.
Пример проблемки ↓↓↓
Почему новая функция оказалась обузой для многих и, как ее отключить, — далее подробно ⇓
→ Проигрыватель html5 – новый стандарт воспроизведения видео, который сменил уже морально устаревший flash-плеер.
→ Еще в конце 2016 года все желающие могли протестировать функцию, активировав соответствующую кнопку ().
Разработчики обещали много интересных плюшек, среди которых:
На деле все оказалось намного плачевнее, ведь вместо обещанных «инноваций» пользователи получили много проблем:
Как оказалось, основные причины связаны в:
Теперь по адресу () можно наблюдать надпись «Сейчас используется проигрыватель HTML5 всегда, когда это возможно», следовательно, у большинства зрителей уже нет выбора.
Внимание!
Чтобы проверить, какой проигрыватель используется на данный момент, наведите курсор мыши на видео и кликните на правую кнопку.
Если в нижней части имеется пункт «О проигрывателе html5», то используется соответствующий плеер
Вот ↓
Именно поэтому мы подготовили лучшие способы, как отключить проигрыватель html5 на YouTube в различных браузерах.
Это вполне реально и не займет много времени, поэтому читайте внимательно. ⇓⇓⇓
На Firefox проблему можно решить, как минимум, двумя способами:
1) Посредством специальных дополнений (Disable Youtube HTML5 Player)
2) Или ручным способом.
В первом случае достаточно просто установить соответствующее расширение, чтобы отключить плеер html5 в YouTube.
Но наиболее простой метод мы рассмотрим ниже: ↓↓↓
Вы можете заметить, что теперь воспроизведение роликов осуществляется через flash-плеер !!!
В целом, ничего сложного и уже через 5 минут вы сможете наслаждаться любимыми роликами.
А теперь узнаем, как это выполнить в других браузерах ⇓⇓⇓
Теперь мы рассмотрим другой метод, как отключить этот плеер при помощи специального приложения — Disable Youtube HTML5 Player ↵
Данный способ подойдет для браузеров Opera, а также Chrome.
Ниже мы опишем, как установить этот расширение на примере браузера Google Chrome:
В разделе «Настройки» — «Дополнительные инструменты» — «Расширения» вы можете увидеть, что утилита установлена.
P.S — Убедитесь, что активирован чекбокс «Включить».
Откройте любой ролик и кликните правой кнопкой мыши и заметите, что уже работает Flash-плеер.
При необходимости можно отключить в расширениях disable YouTube html5 player и тогда Flash-плеер снова не будет работать. В браузере Opera процедура аналогична, поэтому описывать ее подробно нет смысла.
Как показывает опыт, этот метод помогает избавиться от постоянного торможения роликов, а также других проблем с воспроизведением.
Таким образом, можно сделать вывод, что руководство YouTube представило достаточно сырой продукт, впрочем, благо, что всегда можно отключить подобные доработки самостоятельно.
Любой предложенный к просмотру аудио или видеофайл нуждается в специальном проигрывателе, которые преобразует цифровую информацию в доступную для пользователя. Одним из таких доступных средств является проигрыватель html5. О том, чем он хорош, и какие у него недостатки – узнаем ниже.
Проигрыватели проигрыватель относятся к новому поколению виртуальных плееров, благодаря которым осуществляется качественная поддержка всех существующих на сегодня видео- и аудиофайлов. Разработчики этого проекта тестировали его на Ютуб, и даже предлагали пользователям сравнить качество подачи видеоряда с проигрывателем на html5 с морально устаревшим flash-плеером. Ввод в действие нового видеоплеера подразумевал решение таких проблем как:
Новый видеоплеер был по умолчанию назначен основным еще в начале 2017 года. Пользователи, планирующие посмотреть видео, натыкались на такую картинку, которую можно извлечь, наведя курсор на ролик.
Но как можно видеть, специально скачивать проигрыватель не нужно: при новом посещении Ютуба, вам его предложат и установят бесплатно.
Но вот беда: текущее использование нового видеоплеера обозначило целый ряд проблем, которые разработчики не спешат исправлять. Стандартные жалобы посетителей ютуба сводятся к:
Во многих случаях провальное использование системы html5 связано с устаревшим железом, которое пользователи не спешат обновлять, ввиду его надежности и сравнительной исправности. Иногда причиной становятся устаревшее ПО, которое не поддерживает драйвера для видеоплеера нового формата. Любая из этих причин может испортить впечатление от просмотра свежего видеоролика. Если вы оказались в числе таких несчастливчиков, мы предлагаем вам решить эту проблему достаточно просто, отключив используемый по умолчанию html5 и поставив устаревший, но простой и надежный flash-плеер. Итак, как отключить html5в популярных браузерах?
Для отключения html5 на этом браузере можно использовать два способа: ручной и при помощи специальных программ.
Программный способ «чище» и удаляет проблему полностью. Для этого можно использовать плагин Disable Youtube HTML5 Player, который скроет с наших глаз новый проигрыватель и поставит по умолчанию флеш плеер. Можно же поменять настройки видеоплеера вручную. Для этого: вводим в строку поиска файрфокс команду about:config , сразу вываливается окно с предупреждением.
Неизвестно, какая именно гарантия на бесплатный браузер, ну да ладно. Идем дальше.
Это – все текущие настройки нашего браузера. Нас интересуют лишь некоторые. Чтоб не искать их, ломая глаза, вводим в поисковую строку такие настройки, как:
Вводим в поисковую строку – и отключаем. Для отключения достаточно навести курсор на настройку и нажать два раза. Если все сделано правильно, изменится состояние настройки – вместо true покажется false.
После этого следует выполнить перезагрузку браузера и при открытии любого ролика мы сможет воспроизводить его со старого флешплеера.
Главным преимуществом видеозаписей в формате HTML-5 является возможность воспроизведения их в браузере даже без плагина Adobe Flash Player. Замечательным инструментом для конвертирования видеофайлов в этот формат является утилита Фри ХТМЛ5 Видео Плеер энд Конвертер. Вы можете наполнить свой сайт мультимедийным контентом, полезными видеороликами и не бояться несовместимости с браузерами посетителей. Для этого вам достаточно скачать бесплатно новую версию Free HTML5 Video Player and Converter и установить ее на компьютер.
теперь ознакомимся с этой программой более детально. В первую очередь, следует отметить наличие русскоязычного меню, которое значительно облегчит использование Фри ХТМЛ5 Видео Плеер энд Конвертер. Его основная функция заключается в преобразовании видеофайлов в HTML-5-формат для корректного воспроизведения на сайтах и блогах. Можно выбирать нужное разрешение видеозаписи, детально настраивать пресеты и сохранять готовые записи в нужную вам директорию.
Установить Free HTML5 Video Player and Converter вы можете для Windows XP, Vista, 7 и 8.
Представленная программа идеально подойдет для владельцев сайтов и блогов. Благодаря оптимизации видео ваши Интернет-проекты будут отображаться корректно даже при отсутствии Adobe Flash Player в браузерах посетителей. Для этого мы рекомендуем вам скачать бесплатно последнюю версию Фри ХТМЛ5 Видео Плеер энд Конвертер. Однако, если вы не являетесь web-мастером, эта программа может быть для вас малополезной. Во всяком случае, программу стоит скачать и попробовать на своей рабочей системе.
В последнее время мы уже не представляем свою жизнь без мобильных устройств. И всем нам хочется максимальной многозадачности и быстрой работы девайса. Но проблема воспроизведения видео и аудио на мобильных устройствах без использования Flash и Silverlight остро назревала уже давно. Поэтому на смену этим стандартам постепенно стал приходить новый - HTML5 плеер для аудио и видео. Эффектривность воспроизведения видео HTML5 связана с нативной поддержкой медиа (чтобы воспроизвести медиафайл наиболее эффективно, нужно воспроизводить его нативно, то есть должна производиться максимальная интеграция между браузером и операционной системой, а последней - с железом).
Перейдем теперь к практической части и разберемся, как добавить видео на сайт HTML.
Для добавления видео на веб-страницу с помощью HTML используется тег video . Применяется он следующим образом:
Примерно так будет выглядеть видео-плеер (в каждом браузере свой стиль):
Но стоит учесть, что:
Если с первым пунктом проблем значительно меньше (большинство современных браузеров, всё-таки, корректно работают с указанным тегом), то на второй пункт стоит обратить пристальное внимание. Поговорим об этом вопросе несколько подробнее.
Для полноты информации стоит привести следующую таблицу:
Браузер | Google Chrome | Mozilla Firefox | Safari | Opera | Internet Explorer |
---|---|---|---|---|---|
WebM | Есть | Есть | Нет | Есть | Нет |
H.264 | Есть | Нет | Есть | Нет | Есть |
ogg/theora | Есть | Есть | Нет | Есть | Нет |
Как вы видите, нет универсального формата, который позволил бы воспроизводить видео во всех браузерах. Данная ситуация решается следующим способом: на сервер загружается видеофайл в нескольких форматах, а затем в теге video указываются несколько кодеков. Выглядит это примерно так:
Таким образом, источник видео будет подгружаться автоматически браузером при наличии подходящего кодека.
К атрибутам тега video следует отнести:
Примечание: наиболее простой способ добавить видео на сайт - использовать сервис YouTube. В конструкторе сайтов "Нубекс" есть подробная статья о добавлении видео из YouTube:
Раньше, если вы хотели добавить видео на веб-страницу, вам приходилось использовать элемент
Второй подход заключался в использовании подключаемого модуля браузера, например Silverlight или Flash . И хотя технология Flash позволяла использовать готовый видеоплеер или создавать собственный, но её использование порождало большое нагромождение HTML-разметки, а видеофайлы нужно было кодировать в требуемый формат.
HTML5-видео — новый стандарт для размещения мультимедийных файлов в сети с оригинальным программным интерфейсом без привлечения подключаемых модулей. С помощью элемента
IE: 9.0, атрибут muted — с 10.0
Edge: 12.0
Firefox: 3.5
Chrome: 4.0, атрибут muted — с 30.0
Safari: 4.0, атрибут muted — с 5.0
Opera: 11.5
iOS Safari: 3.2
Android Browser: 2.3
Chrome for Android: 44
В простом варианте HTML-разметка для размещения видеофайла на странице имеет следующий вид:
Атрибут controls отвечает за появление элементов управления видеоплеером. Вы можете добавить изображение с помощью атрибута poster , которое браузер будет использовать, пока загружается видео или пока пользователь не нажмет на кнопку воспроизведения, а также задать высоту и ширину видео.
Атрибут | |
---|---|
autoplay | Автоматическое воспроизведение видеоофайла сразу же после загрузки страницы. |
controls | Указывает браузеру, что нужно отобразить базовые элементы управления воспроизведением (воспроизведение, пауза, громкость). |
height | Задает высоту окна для отображения видеоданных, возможные значения: px или % |
loop | Циклическое воспроизведение видеофайла. |
muted | Выключает звук при воспроизведении видеофайла. |
poster | URL файла изображения, которое будет отображаться во время загрузки видеофайла или до тех пор, пока пользователь не нажмет на кнопку PLAY. Если атрибут не задан, то будет отображаться первый кадр видеофайла. |
preload | Атрибут, отвечающий за предварительную загрузку видеоконтента. Не является обязательным, некоторые браузеры игнорируют его. Возможные значения: auto — браузер загружает видеофайл полностью, чтобы он был доступен, когда пользователь начнет его воспроизведение. metadata — браузер загружает первую небольшую часть видеофайла, чтобы определить его основные характеристики. none — отсутствие автоматической загрузки видеофайла. |
src | Содержит абсолютный или относительный URL-адрес видеофайла. |
width | Задает ширину окна для отображения видеоданных, возможные значения: px или % |
Элемент
При просмотре видео проигрыватель должен его декодировать. Одни проигрыватели используют программное декодирование видеопотока, другие используют аппаратное декодирование.
Важно! Поскольку каждый браузер поддерживает определенный кодек, поэтому, чтобы обеспечить воспроизведение видео-контента во всех браузерах, видео-файл нужно размещать в нескольких форматах.
H.264 — высококачественный кодек от фирмы MPEG, делится на профили для поддержки как устройств с минимальными возможностями, так и устройств высокого разрешения.
Ogg Theora — открытый бесплатный стандарт для видео, качество и производительность несколько ниже стандарта H.264.
VP8 — открытый бесплатный кодек, сходный по качеству с H.264. Поддерживается в Firefox, Chrome и Opera.
Любой видеофайл является файловым контейнером, в котором хранятся другие файлы. Аудио- и видеодорожки объединяются для воспроизведения видеоролика. Метаданные содержат информацию о данном видеоролике — изображение обложки, субтитры и пр. К популярным форматам видеоконтейнеров относятся следующие:
Ogg
(.ogv, .oga, .ogx, .ogg) — формат-контейнер с открытым исходным кодом для видеокодека Theora и аудио Vorbis. Работает в Firefox, Chrome и Opera.
MIME-тип: video/ogg .
MPEG 4
(.mp4) — формат-контейнер для видеокодека H.264 и аудиокодека AAC. Работает в Safari и Chrome. Кодирует видео, в том числе высокой четкости, для полного спектра устройств, таких как iPhone, iPod и iPad.
MIME-тип: video/mp4 .
WebM
(.webm) — формат-контейнер с открытым исходным кодом для видеокодека VP8 от Google и аудиокодека Ogg Vorbis. Работает в Firefox, Chrome, Opera и Adobe Flash Player.
MIME-тип: video/webm .
Audio Video Interleave
(.avi) — формат предназначен для записи звука и движущихся изображений, соответствует спецификации RIFF.
MIME-тип: video/vnd.avi, video/avi, video/msvideo, video/x-msvideo .
Matroska
(.mkv) — популярный видеоконтейнер, может содержать видео в формате H.264, VP8 или Theora.
MIME-тип: video/x-matroska, audio/x-matroska .
На данный момент браузеры поддерживают три основных видео формата:
Формат | Видеокодек | Аудиокодек |
---|---|---|
.mp4 | H.264 | AAC |
.ogg/.ogv | Theora | Vorbis |
.webm | VP8 | Vorbis |
Видео в формате.avi на сайте средствами HTML5 не воспроизводится . Поэтому его необходимо перекодировать в эти три формата с соответствующими видео и аудиокодеками для вывода на сайте. Для этого можно использовать видеоконвертеры, указанные на странице ниже.
Чтобы убедиться, что браузер умеет обрабатывать видеофайлы, нужно создать файл.htaccess в папке, где находится веб-страница, определяющая MIME-типы для видео:
AddType video/ogg .ogv AddType video/mp4 .mp4 AddType video/webm .webm
Несмотря на то, что HTML5-видео поддерживается современными браузерами, тем не менее для Internet Explorer (9+) и Safari требуются установленные плагины Microsoft Media Player и Apple QuickTime соответственно.
Элемент
Элемент
Атрибут | Описание, принимаемое значение |
---|---|
default | Указывает, что данная дорожка воспроизводится по умолчанию. Только один элемент |
kind | Указывает тип текстовой дорожки, по умолчанию выводятся субтитры (subtitles). Принимаемые значения: captions — перевод диалогов и звуковых эффектов, отображаемый в виде текста поверх видео (для глухих пользователей). chapters — добавляет названия глав в виде списка для навигации по медиафайлу. descriptions — добавляет звуковое описание происходящего в видео (для невидящих пользователей). metadata — метаданные, используемые скриптами, не отображаются для пользователей. subtitles — текстовое дублирование звуковой дорожки видео, отображается в виде субтитров к видео. |
label | Добавляет название дорожки. Если этот атрибут не задан, браузер применит значение по умолчанию. |
src | Содержит абсолютный или относительный URL-адрес аудио- или видеофайла. |
srclang | Язык воспроизводимой дорожки. |
1.
Декодируем видео в три файла с соответствующими видео и аудиокодеками:
для .mp4
— H.264/AAC,
для .webm
— VP8/Vorbis,
для .ogv
— Theora/Vorbis.
2.
Добавляем поддержку MIME-типов в файл.htaccess .
3.
Размещаем код для вставки видео на сайт с помощью HTML5-разметки, используя атрибуты для задания видео требуемых параметров:
4. Если вы хотите выровнять видеоплеер на странице, нужно обернуть элемент