SlideShare a Scribd company logo

Introdution to HTML 5

•Download as PPT, PDF•
•
onkar_bhosle
onkar_bhosle

HTML5 is the next version of HTML that is still being developed by the World Wide Web Consortium. It introduces several new features such as native audio and video playback, canvas element for graphics, and semantic elements like header, nav and footer. HTML5 also improves support for forms, introduces new APIs for building web applications, and specifies stricter parsing rules to improve error handling compared to previous versions of HTML. Some popular websites that use HTML5 features include YouTube and Google Wave.

1 of 16
Introduction of Presented by Rakesh Vadnal
Overview What is HTML5 History of HTML5 New features in HTML5 Difference of HTML5 with HTML4 Web applications currently using HTML5
What is HTML 5 is the next version of Hyper Text Markup Language(HTML4) It is developing by World Wide Web consortium W3C. Defined error handling
History of HTML5 HTML 3.0 was developed in 1995 HTML 3.2 was completed by 1997 HTML 4 was developed in the year 1998 HTML5 was first started by Mozilla, Apple, and Opera under a group called the WHATWG(Web Hypertext Application Technology Working Group). In 2006 W3C showed an interest in HTML5 and in 2007 they created a working group to work in HTML5 project. HTML5 is still under development.
New features in HTML5 Video and audio tags Header and Footer Nav, Section, article, aside, Drag and drop HTML canvas 2D context Article and aside HTML5 web messaging
Video and Audio HTML5 include video with video element HTML5 specifies a standard way to include audio, with the audio element. The audio element can play sound files, or an audio stream . Adding native support to browsers
Audio+Video=magic <video src=&quot;movie.ogg&quot; controls=&quot;controls&quot;></video> <audio src=&quot; song.ogg &quot; controls=&quot;controls&quot;></audio>
Video and Audio Implementations Native video support in browsers Opera Safari 3.1 Firefox 3.1
Header and Footer <header> </header> <foooter>www.techanveshan.com</footer>
Canvas Dynamic and interactive graphics Draw images using 2D drawing API Lines, curves, shapes, fills, etc. Useful for:Graphs Applications Games and Puzzles.
Canvas Examples: Games Canvex http://canvex.lazyilluminati.com/ Experimental First-Person Shooter Game 3D Graphics
Form Controls: Numbers < input type = &quot;number&quot; > < input type = &quot;range&quot; > Supports ( safari3.0.3,Opera )
Form Controls: Combo Boxes < input list = &quot;title-list&quot; > < datalist id = &quot;title-list&quot; > < option value = &quot;...&quot; > </ datalist > Supports (Opera) )
Difference between HTML4 and HTML5 HTML4 HTML5 Elements like nav, header were not present. It brought new element for web structure like nav, header etc It was lack of rules of parsing so it is difficult to handle error. Strictly parsing rules introduced in html5 so handle the error. No multimedia supported without third party It inbuilt multimedia element in html5 like Audio,video,canvas It was not available It contains attributes like control menu, spell check etc.
Web sites that using HTML5 YouTube uses HTML5, www.youtube.com/ html5 Google wave, a collaboration tool from Google uses several html5 tags Only some of the browser only supports HTML5 features currently
THANK YOU

More Related Content

Introdution to HTML 5

  • 1. Introduction of Presented by Rakesh Vadnal
  • 2. Overview What is HTML5 History of HTML5 New features in HTML5 Difference of HTML5 with HTML4 Web applications currently using HTML5
  • 3. What is HTML 5 is the next version of Hyper Text Markup Language(HTML4) It is developing by World Wide Web consortium W3C. Defined error handling
  • 4. History of HTML5 HTML 3.0 was developed in 1995 HTML 3.2 was completed by 1997 HTML 4 was developed in the year 1998 HTML5 was first started by Mozilla, Apple, and Opera under a group called the WHATWG(Web Hypertext Application Technology Working Group). In 2006 W3C showed an interest in HTML5 and in 2007 they created a working group to work in HTML5 project. HTML5 is still under development.
  • 5. New features in HTML5 Video and audio tags Header and Footer Nav, Section, article, aside, Drag and drop HTML canvas 2D context Article and aside HTML5 web messaging
  • 6. Video and Audio HTML5 include video with video element HTML5 specifies a standard way to include audio, with the audio element. The audio element can play sound files, or an audio stream . Adding native support to browsers
  • 7. Audio+Video=magic <video src=&quot;movie.ogg&quot; controls=&quot;controls&quot;></video> <audio src=&quot; song.ogg &quot; controls=&quot;controls&quot;></audio>
  • 8. Video and Audio Implementations Native video support in browsers Opera Safari 3.1 Firefox 3.1
  • 9. Header and Footer <header> </header> <foooter>www.techanveshan.com</footer>
  • 10. Canvas Dynamic and interactive graphics Draw images using 2D drawing API Lines, curves, shapes, fills, etc. Useful for:Graphs Applications Games and Puzzles.
  • 11. Canvas Examples: Games Canvex http://canvex.lazyilluminati.com/ Experimental First-Person Shooter Game 3D Graphics
  • 12. Form Controls: Numbers < input type = &quot;number&quot; > < input type = &quot;range&quot; > Supports ( safari3.0.3,Opera )
  • 13. Form Controls: Combo Boxes < input list = &quot;title-list&quot; > < datalist id = &quot;title-list&quot; > < option value = &quot;...&quot; > </ datalist > Supports (Opera) )
  • 14. Difference between HTML4 and HTML5 HTML4 HTML5 Elements like nav, header were not present. It brought new element for web structure like nav, header etc It was lack of rules of parsing so it is difficult to handle error. Strictly parsing rules introduced in html5 so handle the error. No multimedia supported without third party It inbuilt multimedia element in html5 like Audio,video,canvas It was not available It contains attributes like control menu, spell check etc.
  • 15. Web sites that using HTML5 YouTube uses HTML5, www.youtube.com/ html5 Google wave, a collaboration tool from Google uses several html5 tags Only some of the browser only supports HTML5 features currently