SlideShare una empresa de Scribd logo
1 de 10
Page 1
HTML5 : Audio/Video Encoding.
Playing Youtube Video
By- Namrata Thakare
Page 2
Introduction
• HTML5 came out in January 2008.
• W3C and the WHATWG are in charge of
developing HTML5.
• Introduced number of new tags.
• HTML5 has support from major websites.
Page 3
HTML5 includes :
• New Elements
• New Attributes
• Full CSS3 Support
• Video and Audio
• 2D/3D Graphics
• Web Applications
Page 4
Audio and Video Encoding
Page 5
Audio Encoding
<audio controls>
<source src=“vid1.ogg“ type="audio/ogg">
<source src=“vid1.mp3“ type="audio/mpeg">
Your browser does not support the audio
element.
</audio>
Page 6
Video Encoding
<video width="320" height="240" controls>
<source src="mov.mp4“ type="video/mp4">
<source src="mov.ogg" type="video/ogg">
Your browser does not support the video
tag.
</video>
Page 7
Playing Youtube Videos
<video width="1000" height="500"
controls="controls">
<source src="**Youtube Video Link Goes
here**" type="video/mp4" />
</video>
Page 8
Browser Compatibility
• Video :
Internet Explorer 9+, Firefox, Opera,
Chrome
• Audio:
Internet Explorer
9+, Firefox, Opera, Chrome, and Safari
Page 9
Conclusion
• The HTML5 is quickly finding its way into
all of the modern browsers.
• Elements in HTML5 have minimized the
scripting in huge extent.
• Audio and video samples have become
very easy to encode in the web page.
Page 10
Thank You

Más contenido relacionado

Similar a HTML5 - Audio/Video Encoding

Video Killed My Data Plan: Helsinki
Video Killed My Data Plan: HelsinkiVideo Killed My Data Plan: Helsinki
Video Killed My Data Plan: HelsinkiDoug Sillars
 
Video performance snowcamp
Video performance snowcampVideo performance snowcamp
Video performance snowcampDoug Sillars
 
Lecture9 web design and development
Lecture9 web design and developmentLecture9 web design and development
Lecture9 web design and developmentRafi Haidari
 
Video performance munichfrontend
Video performance munichfrontendVideo performance munichfrontend
Video performance munichfrontendDoug Sillars
 
Video performance barcelona-js_coders
Video performance barcelona-js_codersVideo performance barcelona-js_coders
Video performance barcelona-js_codersDoug Sillars
 
Video performance glasgow
Video performance glasgowVideo performance glasgow
Video performance glasgowDoug Sillars
 
JS Days HTML5 Flash and the Battle for Faster Cat Videos
JS Days HTML5 Flash and the Battle for Faster Cat VideosJS Days HTML5 Flash and the Battle for Faster Cat Videos
JS Days HTML5 Flash and the Battle for Faster Cat VideosGreg Schechter
 
HTML5 multimedia - where we are, where we're going
HTML5 multimedia - where we are, where we're goingHTML5 multimedia - where we are, where we're going
HTML5 multimedia - where we are, where we're goingbrucelawson
 
Craft 2019 - “The Upside Down” Of The Web - Video technologies
Craft 2019 - “The Upside Down” Of The Web - Video technologiesCraft 2019 - “The Upside Down” Of The Web - Video technologies
Craft 2019 - “The Upside Down” Of The Web - Video technologiesMáté Nádasdi
 
10x10 10 slide presentation
10x10 10 slide presentation10x10 10 slide presentation
10x10 10 slide presentationNickSandy
 
HTML5 Multimedia: where we are, where we're going
HTML5 Multimedia: where we are, where we're goingHTML5 Multimedia: where we are, where we're going
HTML5 Multimedia: where we are, where we're goingbrucelawson
 
HTML5 video & Amazon elastic transcoder - FCIP August 2014
HTML5 video & Amazon elastic transcoder - FCIP August 2014HTML5 video & Amazon elastic transcoder - FCIP August 2014
HTML5 video & Amazon elastic transcoder - FCIP August 2014RZasadzinski
 
HTML5 Video Player - HTML5 Dev Conf 2012
HTML5 Video Player - HTML5 Dev Conf 2012HTML5 Video Player - HTML5 Dev Conf 2012
HTML5 Video Player - HTML5 Dev Conf 2012steveheffernan
 
GDD HTML5, Flash, and the Battle for Faster Cat Videos
GDD HTML5, Flash, and the Battle for Faster Cat VideosGDD HTML5, Flash, and the Battle for Faster Cat Videos
GDD HTML5, Flash, and the Battle for Faster Cat VideosGreg Schechter
 

Similar a HTML5 - Audio/Video Encoding (20)

Video Killed My Data Plan: Helsinki
Video Killed My Data Plan: HelsinkiVideo Killed My Data Plan: Helsinki
Video Killed My Data Plan: Helsinki
 
Video performance snowcamp
Video performance snowcampVideo performance snowcamp
Video performance snowcamp
 
Lecture9 web design and development
Lecture9 web design and developmentLecture9 web design and development
Lecture9 web design and development
 
Html5
Html5Html5
Html5
 
T3fest video
T3fest videoT3fest video
T3fest video
 
Video performance munichfrontend
Video performance munichfrontendVideo performance munichfrontend
Video performance munichfrontend
 
Video performance barcelona-js_coders
Video performance barcelona-js_codersVideo performance barcelona-js_coders
Video performance barcelona-js_coders
 
Html5video
Html5videoHtml5video
Html5video
 
Frontcon video
Frontcon videoFrontcon video
Frontcon video
 
Looking into HTML5 + CSS3
Looking into HTML5 + CSS3Looking into HTML5 + CSS3
Looking into HTML5 + CSS3
 
Video performance glasgow
Video performance glasgowVideo performance glasgow
Video performance glasgow
 
JS Days HTML5 Flash and the Battle for Faster Cat Videos
JS Days HTML5 Flash and the Battle for Faster Cat VideosJS Days HTML5 Flash and the Battle for Faster Cat Videos
JS Days HTML5 Flash and the Battle for Faster Cat Videos
 
HTML5 multimedia - where we are, where we're going
HTML5 multimedia - where we are, where we're goingHTML5 multimedia - where we are, where we're going
HTML5 multimedia - where we are, where we're going
 
Craft 2019 - “The Upside Down” Of The Web - Video technologies
Craft 2019 - “The Upside Down” Of The Web - Video technologiesCraft 2019 - “The Upside Down” Of The Web - Video technologies
Craft 2019 - “The Upside Down” Of The Web - Video technologies
 
Html5 Basics
Html5 BasicsHtml5 Basics
Html5 Basics
 
10x10 10 slide presentation
10x10 10 slide presentation10x10 10 slide presentation
10x10 10 slide presentation
 
HTML5 Multimedia: where we are, where we're going
HTML5 Multimedia: where we are, where we're goingHTML5 Multimedia: where we are, where we're going
HTML5 Multimedia: where we are, where we're going
 
HTML5 video & Amazon elastic transcoder - FCIP August 2014
HTML5 video & Amazon elastic transcoder - FCIP August 2014HTML5 video & Amazon elastic transcoder - FCIP August 2014
HTML5 video & Amazon elastic transcoder - FCIP August 2014
 
HTML5 Video Player - HTML5 Dev Conf 2012
HTML5 Video Player - HTML5 Dev Conf 2012HTML5 Video Player - HTML5 Dev Conf 2012
HTML5 Video Player - HTML5 Dev Conf 2012
 
GDD HTML5, Flash, and the Battle for Faster Cat Videos
GDD HTML5, Flash, and the Battle for Faster Cat VideosGDD HTML5, Flash, and the Battle for Faster Cat Videos
GDD HTML5, Flash, and the Battle for Faster Cat Videos
 

Último

IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsEnterprise Knowledge
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024The Digital Insurer
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsJoaquim Jorge
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking MenDelhi Call girls
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfEnterprise Knowledge
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdfhans926745
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Scriptwesley chun
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes
 
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Servicegiselly40
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CVKhem
 
Handwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed textsHandwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed textsMaria Levchenko
 
A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024Results
 
What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?Antenna Manufacturer Coco
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024Rafal Los
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...Martijn de Jong
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUK Journal
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Drew Madelung
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonAnna Loughnan Colquhoun
 
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountBreaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountPuma Security, LLC
 
Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slidespraypatel2
 

Último (20)

IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and Myths
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
Handwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed textsHandwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed texts
 
A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024
 
What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
 
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountBreaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path Mount
 
Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slides
 

HTML5 - Audio/Video Encoding

  • 1. Page 1 HTML5 : Audio/Video Encoding. Playing Youtube Video By- Namrata Thakare
  • 2. Page 2 Introduction • HTML5 came out in January 2008. • W3C and the WHATWG are in charge of developing HTML5. • Introduced number of new tags. • HTML5 has support from major websites.
  • 3. Page 3 HTML5 includes : • New Elements • New Attributes • Full CSS3 Support • Video and Audio • 2D/3D Graphics • Web Applications
  • 4. Page 4 Audio and Video Encoding
  • 5. Page 5 Audio Encoding <audio controls> <source src=“vid1.ogg“ type="audio/ogg"> <source src=“vid1.mp3“ type="audio/mpeg"> Your browser does not support the audio element. </audio>
  • 6. Page 6 Video Encoding <video width="320" height="240" controls> <source src="mov.mp4“ type="video/mp4"> <source src="mov.ogg" type="video/ogg"> Your browser does not support the video tag. </video>
  • 7. Page 7 Playing Youtube Videos <video width="1000" height="500" controls="controls"> <source src="**Youtube Video Link Goes here**" type="video/mp4" /> </video>
  • 8. Page 8 Browser Compatibility • Video : Internet Explorer 9+, Firefox, Opera, Chrome • Audio: Internet Explorer 9+, Firefox, Opera, Chrome, and Safari
  • 9. Page 9 Conclusion • The HTML5 is quickly finding its way into all of the modern browsers. • Elements in HTML5 have minimized the scripting in huge extent. • Audio and video samples have become very easy to encode in the web page.