Embed Size (px)
DESCRIPTION
Modern browsers both on the desktop and on mobile devices support HTML Media. Chirs Double works for Mozilla and focuses on HTML Media, Nigel Parker works for Microsoft and is experienced in working with broadcast media on the web and more recently HTML Media. Together Chris and Nigel will take you through how you can leverage HTML Media in todays web applications and talk about what is coming next.
Citation preview
Web & mobile evangelist at Microsoft NZ
Motivated by big ideas & unconventional execution
Auckland based Mozilla Developer
Works on HTML5 video & audio Firefox support
Sponsored by
<audio <video
src= src= The url to the audio or video
width= The width of the video element
height= The height of the video element
poster= The url to the thumbnail of the video
preload= preload= (none, metadata, auto) Start downloading
autoplay autoplay Audio or video should play immediately
loop loop Audio or video should return to start and play
controls controls Will show controls (play, pause, scrub bar)
> >
… …
</audio> </video>
•
•
• application/octet-stream
• video/mp4, video/ogg, video/webm
•• Fall-back content only displayed by browsers that do not support the <video> element
• If the browser supports video but not the given codec, fall-back code won’t fire.
•• Content should be served from a HTTP 1.1-compatible web server to enable seek
ahead.
• Otherwise you must encode the video with key index frames in the file & not at the end.
video {
position: relative;
border-radius:
200px 50px 200px 50px;
box-shadow:
#244766 10px 10px 10px;
transform: rotate(5deg)
translate(15px,10px);
}
Sublime Video – Player as a Service
JW Player
mediaelement.js
LeanBack Player – Keyboard Support
Apple’s
HTTP Live Streaming
Microsoft’s
Smooth Streaming
Adobe’s
HTTP Dynamic Streaming
•
• royalty-free?
•
•
• parts of the mechanisms used to protect content may still be up for standardization
•
•
•
