SlideShare a Scribd company logo

Html ppts

•Download as PPTX, PDF•
•
Shivani Gautam
Shivani Gautam

This presentation provides an overview of HTML and HTML5. It discusses the history and invention of HTML by Tim Berners-Lee in 1989. It describes the basic building blocks of HTML including elements, attributes, and data types. It then covers versions of HTML from 2.0 to 5 and new features in HTML5 like canvas, video, geolocation, app cache, and web workers. The presentation compares differences between HTML4 and HTML5 and provides examples of websites using HTML5.

1 of 39
PRESENTATION ON PRESENTED BY : HARPREET SINGH SHIVANI GAUTAM SHWETA ASTHA DHAWAN
Introduction  What is HTML?  Hyper Text Markup Language.  Basic building-blocks of WebPages.  Allows images and objects to be embedded and can be used to create interactive forms.
History  1989: Tim Berners-Lee invents the Web with HTML as its publishing language.  1990- Berners-Lee specified HTML and wrote the browser and server software.  In late 1991 -The first publicly available description of HTML was a document called HTML Tags, first mentioned on the Internet.
Markup  Refers to the sequence of characters or other symbols.  Often called as “TAGS”.  Html Markup consists of several key components:-  Elements  Attributes  Data Types
Example <html> <head> <title>Hello HTML</title> </head> <body> <p>Hello World!</p> </body> </html>
Versions  November 24, 1995 -HTML 2.0  January 1997- HTML 3.2  April 1998 -HTML 4.0  January 2008- HTML5
HTML 5  A core technology of the Internet.  A chance to do things differently.
Logo
Markup  New elements and attributes that reflect typical usage on modern websites.  HTML5 syntax is no longer based on SGML.
FEATURES
Canvas/ Svg Video Geolocation App Cache & Web Database Workers
Html ppts
The canvas element provides a straight and powerful way to draw arbitrary graphics in a web page using java script.
1.3-D view in the web. 2.Big in texture-Game Graphics. 3.The graphics loaded into the CPU in less than 10% time.
SVG -> Canvas -> –High level –Low level –Import/Export –No mouse interaction –Easy UIs –High Animation –Interactive –JS Centric –Medium Animation –More Bookkeeping –Tree of objects –Pixels
HTML 5 Support Chrome Firefox Safari Opera canvas/SVG video geolocation app cache database Web workers
Canvas/ Video Geolocation App Cache & Web SVG Database Workers
Video is Complicated, and Outside Your Control
// HTML 5 makes <video> as easy as <img>
Video in the browser is tough today because it’s about plug-ins. Now a new video tag.  YouTube running entirely using the video tag .No Flash required.
HTML 5 Support Chrome Firefox Safari Opera canvas/SVG video geolocation app cache database Web workers
Canvas/ Video Geolocation App Cache & Web SVG Database Workers
Life’s Better with Location Places 2.8 mi CRM Social Ads Games Photos 2.1 mi 1.1 mi 500 ft 20 ft 75 ft
But GPS & IP aren’t good enough… 1.Too slow 2.Too constrained 3.Too fuzzy
All apps could be better with geolocation. Cell ID and WiFi solve the problem of getting the data. They’ve mapped really the entire world. Again all the browsers but IE support this now.
HTML 5 Support Chrome Firefox Safari Opera canvas/SVG video Geolocation app cache database workers
Canvas/ Video Geolocation App Cache & Web SVG Database Workers
Html ppts
Html ppts
Web Apps Need to Work Everywhere
Html ppts
HTML 5 Support Chrome Firefox Safari Opera canvas/SVG video geolocation app cache database Web workers
Canvas/ Video Geolocation App Cache & Web SVG Database Workers
A More Powerful Web == More Powerful Apps
HTML 5 Support Chrome Firefox Safari Opera canvas/SVG video Geolocation app cache database Web workers
Difference Between HTML4 And HTML5 HTML4 HTML5  Elements like nav, header were not  It brought new element for web present. structure like nav, header etc.  It was lack of rules of parsing so it  Strictly parsing rules introduced in is difficult to handle error. html5 so handle the error.  No multimedia supported without  It inbuilt multimedia element in third party. html5 like Audio, video, convas.  These controls were not present.  It contains attributes like control menu, spell check etc.
Websites 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.
QUESTIONS
Html ppts

More Related Content

Html ppts

  • 1. PRESENTATION ON PRESENTED BY : HARPREET SINGH SHIVANI GAUTAM SHWETA ASTHA DHAWAN
  • 2. Introduction  What is HTML?  Hyper Text Markup Language.  Basic building-blocks of WebPages.  Allows images and objects to be embedded and can be used to create interactive forms.
  • 3. History  1989: Tim Berners-Lee invents the Web with HTML as its publishing language.  1990- Berners-Lee specified HTML and wrote the browser and server software.  In late 1991 -The first publicly available description of HTML was a document called HTML Tags, first mentioned on the Internet.
  • 4. Markup  Refers to the sequence of characters or other symbols.  Often called as “TAGS”.  Html Markup consists of several key components:-  Elements  Attributes  Data Types
  • 6. Versions  November 24, 1995 -HTML 2.0  January 1997- HTML 3.2  April 1998 -HTML 4.0  January 2008- HTML5
  • 7. HTML 5  A core technology of the Internet.  A chance to do things differently.
  • 9. Markup  New elements and attributes that reflect typical usage on modern websites.  HTML5 syntax is no longer based on SGML.
  • 11. Canvas/ Svg Video Geolocation App Cache & Web Database Workers
  • 13. The canvas element provides a straight and powerful way to draw arbitrary graphics in a web page using java script.
  • 14. 1.3-D view in the web. 2.Big in texture-Game Graphics. 3.The graphics loaded into the CPU in less than 10% time.
  • 15. SVG -> Canvas -> –High level –Low level –Import/Export –No mouse interaction –Easy UIs –High Animation –Interactive –JS Centric –Medium Animation –More Bookkeeping –Tree of objects –Pixels
  • 16. HTML 5 Support Chrome Firefox Safari Opera canvas/SVG video geolocation app cache database Web workers
  • 17. Canvas/ Video Geolocation App Cache & Web SVG Database Workers
  • 18. Video is Complicated, and Outside Your Control
  • 19. // HTML 5 makes <video> as easy as <img>
  • 20. Video in the browser is tough today because it’s about plug-ins. Now a new video tag.  YouTube running entirely using the video tag .No Flash required.
  • 21. HTML 5 Support Chrome Firefox Safari Opera canvas/SVG video geolocation app cache database Web workers
  • 22. Canvas/ Video Geolocation App Cache & Web SVG Database Workers
  • 23. Life’s Better with Location Places 2.8 mi CRM Social Ads Games Photos 2.1 mi 1.1 mi 500 ft 20 ft 75 ft
  • 24. But GPS & IP aren’t good enough… 1.Too slow 2.Too constrained 3.Too fuzzy
  • 25. All apps could be better with geolocation. Cell ID and WiFi solve the problem of getting the data. They’ve mapped really the entire world. Again all the browsers but IE support this now.
  • 26. HTML 5 Support Chrome Firefox Safari Opera canvas/SVG video Geolocation app cache database workers
  • 27. Canvas/ Video Geolocation App Cache & Web SVG Database Workers
  • 30. Web Apps Need to Work Everywhere
  • 32. HTML 5 Support Chrome Firefox Safari Opera canvas/SVG video geolocation app cache database Web workers
  • 33. Canvas/ Video Geolocation App Cache & Web SVG Database Workers
  • 34. A More Powerful Web == More Powerful Apps
  • 35. HTML 5 Support Chrome Firefox Safari Opera canvas/SVG video Geolocation app cache database Web workers
  • 36. Difference Between HTML4 And HTML5 HTML4 HTML5  Elements like nav, header were not  It brought new element for web present. structure like nav, header etc.  It was lack of rules of parsing so it  Strictly parsing rules introduced in is difficult to handle error. html5 so handle the error.  No multimedia supported without  It inbuilt multimedia element in third party. html5 like Audio, video, convas.  These controls were not present.  It contains attributes like control menu, spell check etc.
  • 37. Websites 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.