Резюме

В тази статия ще обсъдим ключовите моменти за HTML5 и неговото въздействие върху медиите в пейзажа на уеб разработката. HTML5 е най -новата версия на спецификацията на HTML и носи значителни промени и подобрения в мрежата. Той осигурява стандартен начин за игра на медии без нужда от приставки за браузър. Въпреки това, HTML5 все още е в ход и поддръжката на браузъра за неговите функции може да варира.

Ключови точки:

HTML5 е първата нова версия на спецификацията HTML от 1999 г.
HTML5 ще бъде новият стандарт за HTML, XHTML и HTML DOM.
HTML5 предоставя стандартен начин за игра на медии без приставки за браузър.
Повечето съвременни браузъри имат някакво ниво на поддръжка на HTML5 маркери.
HTML5 е жизнеспособна алтернатива на Flash за игра на медии.
Видео етикетът HTML5 предлага стандартизиран подход за възпроизвеждане на видеоклипове.
HTML5 поддържа различни медийни формати, включително AAC, MP3, OGG Vorbis, OGG THEORA, WEBM и MPEG-4.
Поддръжката на браузъра за медийни формати може да варира.
Видео етикетът в HTML5 позволява персонализирани контроли за възпроизвеждане.
Видео етикетът поддържа свойства като AutoPlay, Loop и Poster.

Въпроси и отговори

В: Какво е HTML5?

HTML5 е най -новата версия на спецификацията HTML, която носи нови функции и подобрения в уеб разработката.

В: Какво е значението на HTML5 в играта на медиите?

HTML5 предоставя стандартен начин за игра на медии без нужда от приставки за браузър, което го прави по-достъпен и последователен в различни платформи.

В: Как видео етикетът HTML5 се различава от обекта за възпроизвеждане на медия?

Видео етикетът HTML5 е стандартизиран подход за възпроизвеждане на видеоклипове, като се гарантира съвместимост в браузърите, без да е необходимо конкретни приставки.

В: Какви са поддържаните медийни формати в HTML5?

HTML5 поддържа AAC, MP3, OGG Vorbis, OGG THEORA, WEBM и MPEG-4 за аудио и видео.

В: Поддържа ли всеки браузър всички медийни формати на HTML5?

Не, поддръжката на браузъра за медийни формати може да варира. Важно е да се вземат предвид съвместимостта на медийните формати при разработването на HTML5 приложения.

В: Какви са предимствата на използването на видео етикета в HTML5?

Видео етикетът в HTML5 позволява персонализирани контроли за възпроизвеждане и осигурява стандартизиран начин за възпроизвеждане на видеоклипове в различни браузъри.

В: Какви свойства могат да се използват с видео етикета?

Видео етикетът поддържа свойства като AutoPlay, Loop, Controls, Height и Preload.

Въпрос: Как мога да използвам видео етикета в HTML5 страница?

За да възпроизведете видео на страница HTML5, просто използвайте видео етикета и задайте атрибута Source, за да посочите видео файла (ите), които да се възпроизвеждат.

Въпрос: Какво е текущото състояние на внедряването на HTML5 в браузърите?

Повечето съвременни браузъри имат някакво ниво на поддръжка за функции на HTML5. Важно е обаче да се вземат предвид съвместимостта на браузъра, когато използвате специфични HTML5 маркери и функции.

В: HTML5 е заместител на светкавицата?

HTML5 предоставя алтернатива на Flash за игра на медии, но това не е пълна подмяна. Flash все още има по -широка поддръжка на браузъра и предлага допълнителни функции.

Изтеглете HTML 5 за Windows 10 – Най -добър софтуер и приложения

Можете да зададете свойства или в HTML или JavaScript. Следващият код показва как да зададете свойството Boolean Controls в HTML и JavaScript.

HTML5 – Работа с медия в HTML5

Освен ако през последната година не сте живели на отдалечен остров, вероятно сте чували бръмчането и свръх около HTML5. Не, HTML5 няма да излекува повечето болести, нито ще сложи край на глада на света, но е готов да прекрои богатия пейзаж на интернет приложения. С целия шум над новия HTML стандарт е важно да се върне дискусията на земята. Ето важните факти, които трябва да знаете за тази нова спецификация на HTML:

HTML5 е първата нова версия на спецификацията от 1999 г. – мрежата се промени много оттогава.
HTML5 ще бъде новият стандарт за HTML, XHTML и HTML DOM.
HTML5 предоставя стандартен начин за игра на медии-ключово предимство, тъй като нямаше стандарт за игра на медии в уеб страница без плъгин на браузъра и няма гаранция, че всеки браузър ще поддържа приставката.
HTML5 все още е в ход, но повечето съвременни браузъри имат някаква поддръжка на HTML5 маркери.

Когато Silverlight 1.0 Изпратени през 2007 г., Microsoft рекламира своето видео и възпроизвеждане на аудио като основни функции и основна причина да видите Silverlight като алтернатива на Flash – което се поддържа в една или друга версия на 95 процента от браузърите по целия свят. Към този текст Silverlight се поддържа на около 75 процента от браузърите по целия свят или около три от всеки четири компютъра. Но ако ти’търсите да играете медии, а вие не сте’Не искам да се карате или зависимостта на плъгин, HTML5 е отговорът.

За да видите разликата между използването на видео етикета на HTML5 и традиционния обект за възпроизвеждане, помислете за примера в Фигура 1.

Фигура 1 HTML видео етикет срещу. обектният етикет за възпроизвеждане на медия

 Използване на видео етикета HTML5 за възпроизвеждане на видео
 
 Използване на обектния маркер за възпроизвеждане на медия с помощта на флаш плъгина

И така, какво’s Голямата работа? И двата примера са прости и лесни за изпълнение. Но важният момент тук е, че тъй като етикетът е стандарт, няма да има съмнение, че трябва да се използва за игра на медии. Не’Не трябва да се досеща дали браузърът има определена версия на определен плъгин, инсталиран, за да възпроизвежда вашата медия. Стандартната част е какво’липсва от HTML.

Поддържани медийни формати в HTML5

За да използвате медии в следващото си приложение HTML5, трябва да знаете какви формати се поддържат. HTML5 поддържа AAC, MP3 и OGG Vorbis за аудио и OGG теорета, WebM и MPEG-4 за видео.

Въпреки че HTML5 поддържа тези медийни формати, обаче, не всеки браузър поддържа всеки формат. Фигура 2 Показва текущите браузъри и медийните формати, които поддържат.

Фигура 2 Поддръжка на медиите в настоящите браузъри

Браузър	Видео формати			Аудио формати
OGG THEORA	З.264	VP8 (WebM)	Ogg Vorbis	Mp3	Wav
Internet Explorer	Ръчно инсталиране	9.0	Ръчно инсталиране	Не	Да	Не
Mozilla Firefox	3.5	Не	4.0	Да	Не	Да
Google Chrome	3.0	Не	6.0	Да	Да	Да
Сафари	Ръчно инсталиране	3	Ръчно инсталиране	Не	Да	Да
Опера	10.50	Не	10.60	Да	Не	Да

Използване на видео маркера

За да възпроизведете видео на страница HTML5, просто използвайте маркера, както е показано тук:

Атрибутът SRC (https: // www.W3.org/tr/2013/cr-html5-20130806/вградено съдържание-0.html#the-video-element) Задава името или имената на видеото за възпроизвеждане и контрола’S Boolean Switch диктува дали се показва контролите за възпроизвеждане по подразбиране. Можете също да използвате две други булеви свойства – Autoplay и Loop – когато настроите видео етикета. Фигура 3 изброява всеки атрибут на свойството и неговата стойност.

Фигура 3 Свойства на видео етикета

Атрибут	Стойност	Описание
Аудио	Приглушен	Определя състоянието по подразбиране на аудиото. В момента е разрешен само заглушен.
Автоматично изпълнение	Автоматично изпълнение	Ако присъства, видеото започва да се възпроизвежда’е готов.
Контроли	Контроли	Добавя игра за игра, пауза и обем.
Височина	Пиксели	Задава височината на видео плейъра.
Цикъл	Цикъл	Ако присъства, видеото ще започне отначало всеки път, когато приключи.
Постер	URL	Посочва URL адреса на изображение, представящо видеото.
PRELOAD	PRELOAD	Ако присъства, видеото е заредено при натоварване на страницата и е готов за стартиране. Игнорира се, ако присъства автоплайс.
SRC	URL	URL адресът на видеото, който да се играе.
Ширина	Пиксели	Задава ширината на видео плейъра.

Следващият код показва няколко от ключовите свойства на видео плейъра в общ сценарий, който включва задаване на височината и ширината, автоматичните играчи, цикъла и контролите, които ще показват играта, пауза и контрол на силата на звука, както и съобщение за грешка в резервата за грешка.

Можете също да зададете специфичния тип MIME, който типира атрибута и кодек в елемента на източника. Тези примери използват типа атрибут, за да зададат типа MIME и кодирането на медиите:

Можете да зададете свойства или в HTML или JavaScript. Следващият код показва как да зададете свойството Boolean Controls в HTML и JavaScript.

    // 2 начина за показване на контроли във видеоклипа на JavaScript.controls = true; видео.setAttribute (&bdquo;контроли&ldquo;, &bdquo;контроли&ldquo;);

Когато не’не знам дали браузърът ще вине на страницата, имате нужда от резервен механизъм, за да играете на вашата медия. Всичко, което правите, е да изброите видео формати, в които сте направили видеото си, и браузърът играе първия, който поддържа. Можете също да добавите текст в краен случай, за да уведомите потребителя, че използваният браузър не’t Поддържайте родния HTML5 възпроизвеждане на видео. Следният код включва множество видео източници, както и резервно съобщение, което показва, че няма поддръжка на HTML5.

Ако искате да се уверите, че видеото ви възпроизвежда, можете да включите и етикета на обекта, за да възпроизведете и флаш версия, като така:

Можете също да използвате JavaScript, за да проверите дали видео формат се поддържа, като проверите свойството CanPlaytype, както следва:

var video = документ.getElementsByTagname ('видео') [0]; ако (видео.canplaytype) < // video tag supported if (video.canPlayType('video/ogg; codecs="theora, vorbis"')) < // it may be able to play>иначе >

Ако искате да направите нещо по -изразително от простия резервен текст, можете да използвате слушателя на събитието Onerror, за да предадете грешката на:

Използвайки свойството на плакатите, можете да посочите URL адреса на изображение, за да се покаже на мястото на видеото във формата. Обикновено вие’Показване на списък с видеоклипове или един видеоклип във формуляр, така че да имате лесен начин да покажете визуализация на видеото под формата на изображение, доставя по -добро потребителско изживяване. Ето свойството на плакатите в действие:

И накрая, като използвате малко JavaScript и основен HTML, можете да създадете по -интерактивен видео плейър. Фигура 4 Показва как да добавите видео плейър към формуляр с JavaScript и как да отговорите на потребителския вход към контрола.

Фигура 4 Взаимодействие с видео в JavaScript

var video = документ.createeelement (&bdquo;видео“); видео.src = ‘video1.mp4 ‘; видео.controls = true; документ.тяло.AppendChild (видео); var video = нов видео (); видео.src = ‘video1.mp4 ‘; var video = нов видеоклип (‘video1.MP4 ‘)

За пълен списък със събития и възможности за игра на видео, вижте този раздел от спецификацията на https: // www.W3.org/tr/html-markup/видео.html.

Използване на аудио маркера

Използването на аудио маркера е много като използване на видео етикета: Вие предавате един или повече аудио файлове на контрола, а първият, който браузърът поддържа, се възпроизвежда.

Фигура 5 изброява имотите, налични в аудио маркера. Контролът не’не трябва да се показва като видео плейър, така че свойства като височина, ширина и плакат не са включени.

Фигура 5 Свойства на аудио маркери

Атрибут	Стойност	Описание
Автоматично изпълнение	автоматично изпълнение	Ако присъства, аудиото започва да се възпроизвежда’е готов.
Контроли	контроли	Показват се контроли, като бутон за възпроизвеждане.
Цикъл	цикъл	Ако присъства, аудиото започва да възпроизвежда отново (циклиране), когато достигне края.
PRELOAD	PRELOAD	Ако присъства, аудиото се зарежда при зареждане на страницата и е готов за стартиране. То’s игнорирано, ако присъства автоматично възпроизвеждане.
SRC	URL	URL адресът на аудиото да се възпроизвежда.

Както при видео етикета, можете да предавате няколко файла на аудио маркера, а първият, който се поддържа, ще възпроизвежда. Можете също да използвате резервно съобщение, когато браузърът не’t Поддържайте аудио маркера, като този:

Резюме

HTML5 е следващият стандарт за мрежата и в зависимост от браузърите, които сте’Повторно насочване, можете да започнете да използвате някои от новите маркери, като аудио и видео, в момента. Бъдете предпазливи, когато използвате HTML5, тъй като не всеки браузър поддържа новите маркери и дори да го направи, той може да не поддържа всеки медиен формат. Ако ти’Използвайки модерен браузър, който поддържа HTML5, все още трябва да свършите допълнителната работа, за да обработите медиите във всички формати, за да осигурите успех на потребителите. Ето няколко страхотни уеб ресурси, които предоставят информация за поддръжката на браузъра, както и цялата друга информация, от която се нуждаете, за да осигурите успех на HTML5 медии:

https: // www.W3.org/tr/html-markup/видео.html
https: // dev.W3.org/html5/spec/преглед.html
https: // www.W3Schools.com/html/html5_intro.asp
https: // html5test.com/
https: // caniuse.com/

_Джейсън Берес е вицепрезидент по управление на продуктите, общността и евангелизацията в инфрагистиката и ръководенията на клиентите, иновативни характеристики и функционалност във всички инфрагистични продукти. Джейсън е Microsoft .Нетен MVP и е активен член на .Нетна общност. Той говори на десетки събития и конференции по целия свят всяка година. Той е автор на осем книги по теми, вариращи от Visual Basic и C# до SQL Server и Silverlight; Последното му е Professional Silverlight 4 (Wrox, 2010). Можете да стигнете до Джейсън на [email protected] или в twitter @jasonberes._

Изтеглете HTML 5 за Windows 10 – Най -добър софтуер и приложения

Internet Explorer 9 е безплатен интернет браузър за компютърни компютри и лаптопи на Microsoft Windows. Разработен и публикуван от Microsoft, IE 9 е съвместим с.

Windows
браузър
Браузър за Windows
Браузър за Windows 10
Браузър за Windows 7
CSS3