SlideShare une entreprise Scribd logo
1  sur  19
MEDIAMOSA PLAYER Open source html5 weblectures player opensourcewebdevelopment
TODAY who am I and who is One Shoe open source video player definition of HTML 5 the state of HTML 5 video browser adoption components the player challenges ahead future releases questions Introduction CONFERENCE MEDIAMOSA, WEBLECTURES AND OPEN VIDEO mediamosa Html 5 video weblectures MARCH 29th 2011 CONCLUSION
WHO is ONE SHOE 3 WHO am i Thijs Zoon Full service internet company General manager R&D / Product development based in utrecht, 38 employees, web development, advertising, digital branding, mobile, drupal specialist system architect, drupalnerd, research & developmenthoncho, code purist, music enthousiast thijs.zoon@oneshoe.nl +31 (0)30 2317521 www.oneshoe.nl info@oneshoe.nl @oneshoe +31 (0)30 2317521 opensourcewebdevelopment
4 Introduction 4 cooperating divisions webdesign websites intranet communities web applications seo/sea hosting drupal support research & development mobile websites iOS apps iphone/ipad android apps symbian apps windows phone apps qr codes mobile gaming mobile advertising crossmedia concepts online branding online marketing marketing development campaigns pr and advertising guerilla marketing concept development identity design communication strategies search engine strategies outdoor advertising
5 OPEN SOURCE MEDIAMOSA PLAYER opensourcewebdevelopment
OPEN SOURCE MEDIAMOSA PLAYER Multi-stream Captions / subtitles Slides HTML 5 6 MediaMosa
7 definition of HTML 5 opensourcewebdevelopment
8 HTML 5 video History of html Introduction of HyperTextMarkup Language First draft of HTML 5 specs are published HTML 3.2 and 4 specsreleased Standardization, first adoption as open standard, Mosaic browser  A stricter XHTML standard is released HTML 2.0 specsreleased, browser war between Netscape and Internet Explorer WHATWG (Web Hypertext Application Technology Working Group) 1995 1997 1999 2004 2008 1993 1989
DEFINITION OF HTML 5 Ongoing effort toimplement a standard forricher web applications Common name for a combination of JavaScript- HTML, CSS novelties Currently, not a single browser implements 75% of all HTML5 features HTML5 specs are in draft, expected full recommendation in 2022 9 HTML 5 video
HTML 5 The <video> element opensourcewebdevelopment
BROWSER ADOPTION HTML 5 video 55% of visitors have a browser that supports the video element 93% of visitors have Flash 10+ Codec war 11
CODEC WAR <video …>  <source src=”vid.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' /> <source src=”vid.webm" type='video/webm; codecs="vp8, vorbis"' /> <source src=”vid.ogv" type='video/ogg; codecs="theora, vorbis"' /> ... </video> 12 HTML 5 video
WEBLECTURES BEYOND THE <video> element opensourcewebdevelopment
COMPONENTS Video (primary) Video (secondary) Slides Captions / subtitles Timed events, textand images Transcript(s) Additional downloads 14 Weblectures
MEDIAMOSA PLAYER OPEN SOURCE HTML5 WEBLECTURES PLAYER opensourcewebdevelopment
CHALLENGES AHEAD Changing HTML5 specificationsand browser implementations Codec war Bugs in Chrome, Mobile Safari 16 Conclusion
FUTURE RELEASES Better support foriOS (iPadandiPhone) Integratedfallbackplayer (Adobe Flash)  17 Conclusion
THANK YOU QUESTIONS ANYONE? Thijs Zoon Phone: E-mail: +31 (0)302317521 thijs.zoon@oneshoe.nl www.oneshoe.nl @oneshoe Web: Twitter: General manager R&D / Product development opensourcewebdevelopment
MORE INFORMATION In depth information on HTML5 videohttp://diveintohtml5.org/video.html HTML5 andit’s support historyhttp://en.wikipedia.org/wiki/HTML5_video Browser versionstatisticshttp://gs.statcounter.com/#browser_version-ww-monthly-201002-201102 Test a browser’sHTML5 supporthttp://html5test.comor http://caniuse.com VideoJS, HTML5 playerhttp://videojs.com Or contact OneShoe: www.oneshoe.nl 19 More information

Contenu connexe

En vedette

Candace Negril
Candace NegrilCandace Negril
Candace Negrilchglat
 
Breathless Cabo San Lucas
Breathless Cabo San LucasBreathless Cabo San Lucas
Breathless Cabo San Lucaschglat
 
Beaches Turks and Caicos
Beaches Turks and CaicosBeaches Turks and Caicos
Beaches Turks and Caicoschglat
 
St. Thomas and Peter Island
St. Thomas and Peter IslandSt. Thomas and Peter Island
St. Thomas and Peter Islandchglat
 
Brenda Iberostar PUJ
Brenda Iberostar PUJBrenda Iberostar PUJ
Brenda Iberostar PUJchglat
 
Hawaii
HawaiiHawaii
Hawaiichglat
 
Presentació d'ausiàs march
Presentació d'ausiàs marchPresentació d'ausiàs march
Presentació d'ausiàs marchMoneta Jc
 
Blue Diamond Riviera Maya
Blue Diamond Riviera MayaBlue Diamond Riviera Maya
Blue Diamond Riviera Mayachglat
 
Reagan Great Exuma Option
Reagan Great Exuma OptionReagan Great Exuma Option
Reagan Great Exuma Optionchglat
 
Excellence Riviera Cancun
Excellence Riviera CancunExcellence Riviera Cancun
Excellence Riviera Cancunchglat
 
Lauren & Ryan
Lauren & RyanLauren & Ryan
Lauren & Ryanchglat
 
Jamaica Options
Jamaica OptionsJamaica Options
Jamaica Optionschglat
 
Jamaica Honeymoon Options
Jamaica Honeymoon OptionsJamaica Honeymoon Options
Jamaica Honeymoon Optionschglat
 
Dreams Costa Rica
Dreams Costa RicaDreams Costa Rica
Dreams Costa Ricachglat
 
Laura Honeymoon Options
Laura Honeymoon OptionsLaura Honeymoon Options
Laura Honeymoon Optionschglat
 
Jamaica
JamaicaJamaica
Jamaicachglat
 
Royalton Negril
Royalton  NegrilRoyalton  Negril
Royalton Negrilchglat
 
Azul fives destination wedding
Azul fives destination weddingAzul fives destination wedding
Azul fives destination weddingchglat
 

En vedette (20)

Candace Negril
Candace NegrilCandace Negril
Candace Negril
 
Breathless Cabo San Lucas
Breathless Cabo San LucasBreathless Cabo San Lucas
Breathless Cabo San Lucas
 
Beaches Turks and Caicos
Beaches Turks and CaicosBeaches Turks and Caicos
Beaches Turks and Caicos
 
St. Thomas and Peter Island
St. Thomas and Peter IslandSt. Thomas and Peter Island
St. Thomas and Peter Island
 
Brenda Iberostar PUJ
Brenda Iberostar PUJBrenda Iberostar PUJ
Brenda Iberostar PUJ
 
Hawaii
HawaiiHawaii
Hawaii
 
Presentació d'ausiàs march
Presentació d'ausiàs marchPresentació d'ausiàs march
Presentació d'ausiàs march
 
Blue Diamond Riviera Maya
Blue Diamond Riviera MayaBlue Diamond Riviera Maya
Blue Diamond Riviera Maya
 
Reagan Great Exuma Option
Reagan Great Exuma OptionReagan Great Exuma Option
Reagan Great Exuma Option
 
Excellence Riviera Cancun
Excellence Riviera CancunExcellence Riviera Cancun
Excellence Riviera Cancun
 
Lauren & Ryan
Lauren & RyanLauren & Ryan
Lauren & Ryan
 
Maddi
MaddiMaddi
Maddi
 
Jamaica Options
Jamaica OptionsJamaica Options
Jamaica Options
 
Jamaica Honeymoon Options
Jamaica Honeymoon OptionsJamaica Honeymoon Options
Jamaica Honeymoon Options
 
Dreams Costa Rica
Dreams Costa RicaDreams Costa Rica
Dreams Costa Rica
 
Laura Honeymoon Options
Laura Honeymoon OptionsLaura Honeymoon Options
Laura Honeymoon Options
 
Jamaica
JamaicaJamaica
Jamaica
 
Royalton Negril
Royalton  NegrilRoyalton  Negril
Royalton Negril
 
Azul fives destination wedding
Azul fives destination weddingAzul fives destination wedding
Azul fives destination wedding
 
AB Design
AB DesignAB Design
AB Design
 

Dernier

Sports & Fitness Value Added Course FY..
Sports & Fitness Value Added Course FY..Sports & Fitness Value Added Course FY..
Sports & Fitness Value Added Course FY..Disha Kariya
 
APM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across SectorsAPM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across SectorsAssociation for Project Management
 
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Sapana Sha
 
Measures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeMeasures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeThiyagu K
 
Unit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptxUnit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptxVishalSingh1417
 
Beyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global ImpactBeyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global ImpactPECB
 
General AI for Medical Educators April 2024
General AI for Medical Educators April 2024General AI for Medical Educators April 2024
General AI for Medical Educators April 2024Janet Corral
 
Activity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdfActivity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdfciinovamais
 
Arihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdfArihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdfchloefrazer622
 
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 -  Danh muc Sach Giao Khoa 10 . pdf1029 -  Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdfQucHHunhnh
 
Grant Readiness 101 TechSoup and Remy Consulting
Grant Readiness 101 TechSoup and Remy ConsultingGrant Readiness 101 TechSoup and Remy Consulting
Grant Readiness 101 TechSoup and Remy ConsultingTechSoup
 
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...fonyou31
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfAdmir Softic
 
Z Score,T Score, Percential Rank and Box Plot Graph
Z Score,T Score, Percential Rank and Box Plot GraphZ Score,T Score, Percential Rank and Box Plot Graph
Z Score,T Score, Percential Rank and Box Plot GraphThiyagu K
 
Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3JemimahLaneBuaron
 
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxSOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxiammrhaywood
 
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...christianmathematics
 

Dernier (20)

Sports & Fitness Value Added Course FY..
Sports & Fitness Value Added Course FY..Sports & Fitness Value Added Course FY..
Sports & Fitness Value Added Course FY..
 
APM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across SectorsAPM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across Sectors
 
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
 
Measures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeMeasures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and Mode
 
Unit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptxUnit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptx
 
Beyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global ImpactBeyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global Impact
 
General AI for Medical Educators April 2024
General AI for Medical Educators April 2024General AI for Medical Educators April 2024
General AI for Medical Educators April 2024
 
Activity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdfActivity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdf
 
Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"
Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"
Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"
 
Advance Mobile Application Development class 07
Advance Mobile Application Development class 07Advance Mobile Application Development class 07
Advance Mobile Application Development class 07
 
Arihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdfArihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdf
 
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 -  Danh muc Sach Giao Khoa 10 . pdf1029 -  Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
 
Grant Readiness 101 TechSoup and Remy Consulting
Grant Readiness 101 TechSoup and Remy ConsultingGrant Readiness 101 TechSoup and Remy Consulting
Grant Readiness 101 TechSoup and Remy Consulting
 
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdf
 
Z Score,T Score, Percential Rank and Box Plot Graph
Z Score,T Score, Percential Rank and Box Plot GraphZ Score,T Score, Percential Rank and Box Plot Graph
Z Score,T Score, Percential Rank and Box Plot Graph
 
Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3
 
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxSOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
 
Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1
 
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
 

One Shoe - MediaMosa player

  • 1. MEDIAMOSA PLAYER Open source html5 weblectures player opensourcewebdevelopment
  • 2. TODAY who am I and who is One Shoe open source video player definition of HTML 5 the state of HTML 5 video browser adoption components the player challenges ahead future releases questions Introduction CONFERENCE MEDIAMOSA, WEBLECTURES AND OPEN VIDEO mediamosa Html 5 video weblectures MARCH 29th 2011 CONCLUSION
  • 3. WHO is ONE SHOE 3 WHO am i Thijs Zoon Full service internet company General manager R&D / Product development based in utrecht, 38 employees, web development, advertising, digital branding, mobile, drupal specialist system architect, drupalnerd, research & developmenthoncho, code purist, music enthousiast thijs.zoon@oneshoe.nl +31 (0)30 2317521 www.oneshoe.nl info@oneshoe.nl @oneshoe +31 (0)30 2317521 opensourcewebdevelopment
  • 4. 4 Introduction 4 cooperating divisions webdesign websites intranet communities web applications seo/sea hosting drupal support research & development mobile websites iOS apps iphone/ipad android apps symbian apps windows phone apps qr codes mobile gaming mobile advertising crossmedia concepts online branding online marketing marketing development campaigns pr and advertising guerilla marketing concept development identity design communication strategies search engine strategies outdoor advertising
  • 5. 5 OPEN SOURCE MEDIAMOSA PLAYER opensourcewebdevelopment
  • 6. OPEN SOURCE MEDIAMOSA PLAYER Multi-stream Captions / subtitles Slides HTML 5 6 MediaMosa
  • 7. 7 definition of HTML 5 opensourcewebdevelopment
  • 8. 8 HTML 5 video History of html Introduction of HyperTextMarkup Language First draft of HTML 5 specs are published HTML 3.2 and 4 specsreleased Standardization, first adoption as open standard, Mosaic browser A stricter XHTML standard is released HTML 2.0 specsreleased, browser war between Netscape and Internet Explorer WHATWG (Web Hypertext Application Technology Working Group) 1995 1997 1999 2004 2008 1993 1989
  • 9. DEFINITION OF HTML 5 Ongoing effort toimplement a standard forricher web applications Common name for a combination of JavaScript- HTML, CSS novelties Currently, not a single browser implements 75% of all HTML5 features HTML5 specs are in draft, expected full recommendation in 2022 9 HTML 5 video
  • 10. HTML 5 The <video> element opensourcewebdevelopment
  • 11. BROWSER ADOPTION HTML 5 video 55% of visitors have a browser that supports the video element 93% of visitors have Flash 10+ Codec war 11
  • 12. CODEC WAR <video …> <source src=”vid.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' /> <source src=”vid.webm" type='video/webm; codecs="vp8, vorbis"' /> <source src=”vid.ogv" type='video/ogg; codecs="theora, vorbis"' /> ... </video> 12 HTML 5 video
  • 13. WEBLECTURES BEYOND THE <video> element opensourcewebdevelopment
  • 14. COMPONENTS Video (primary) Video (secondary) Slides Captions / subtitles Timed events, textand images Transcript(s) Additional downloads 14 Weblectures
  • 15. MEDIAMOSA PLAYER OPEN SOURCE HTML5 WEBLECTURES PLAYER opensourcewebdevelopment
  • 16. CHALLENGES AHEAD Changing HTML5 specificationsand browser implementations Codec war Bugs in Chrome, Mobile Safari 16 Conclusion
  • 17. FUTURE RELEASES Better support foriOS (iPadandiPhone) Integratedfallbackplayer (Adobe Flash) 17 Conclusion
  • 18. THANK YOU QUESTIONS ANYONE? Thijs Zoon Phone: E-mail: +31 (0)302317521 thijs.zoon@oneshoe.nl www.oneshoe.nl @oneshoe Web: Twitter: General manager R&D / Product development opensourcewebdevelopment
  • 19. MORE INFORMATION In depth information on HTML5 videohttp://diveintohtml5.org/video.html HTML5 andit’s support historyhttp://en.wikipedia.org/wiki/HTML5_video Browser versionstatisticshttp://gs.statcounter.com/#browser_version-ww-monthly-201002-201102 Test a browser’sHTML5 supporthttp://html5test.comor http://caniuse.com VideoJS, HTML5 playerhttp://videojs.com Or contact OneShoe: www.oneshoe.nl 19 More information

Notes de l'éditeur

  1. Open the demo of the player