The beginnings of HTML5
1 like477 views
The document discusses the evolution and development of HTML over time, highlighting some key milestones and new features introduced in HTML5. It provides a timeline of HTML versions from 1990 to 2010, noting important releases like HTML 2.0, 3.2, 4.0, and XHTML 1.0. It then outlines some major new capabilities of HTML5 like improved error handling, built-in multimedia support using new elements, and a simplified DOCTYPE declaration.
The beginnings of HTML5
- 3. WebProgramming The Awesomeness of HTML5 Mark Cedrick C. Antonino Faculty, USJR - CICCT
- 4. What up awesome? • HTML Chronological Development • How awesome is HTML5
- 5. HTML Timeline 1990 1992 1994 1996 1998 2000 2002 2004 2006 2008 2010
- 6. HTML Timeline 1990 1992 1994 1996 1998 2000 2002 2004 2006 2008 2010 1995: HTML 2.0 Formalized the syntax and many of the Rules that were already implemented.
- 7. HTML Timeline 1990 1992 1994 1996 1998 2000 2002 2004 2006 2008 2010 1997: HTML 3.2 Largely ignored by browser manufacturers Who began to implement their own tags.
- 8. HTML Timeline 1990 1992 1994 1996 1998 2000 2002 2004 2006 2008 2010 1998: Web Standards Project Pushed for standards adoption, added weight to the W3C recommendations and promoted standards-based browsers.
- 9. HTML Timeline 1990 1992 1994 1996 1998 2000 2002 2004 2006 2008 2010 1999: HTML 4.0 Stabilized the syntax and structure of HTML, became the standard for web authoring.
- 10. HTML Timeline 1990 1992 1994 1996 1998 2000 2002 2004 2006 2008 2010 2000: XHTML 1.0 Designed to move HTML towards XML DTDs often caused it to render as HTML
- 11. HTML Timeline 1990 1992 1994 1996 1998 2000 2002 2004 2006 2008 2010 The growth of the web High bandwidth connections increase, as does the demand for multimedia and applications driven by technology such as Flash and AJAX work on XHTML 2.0 begins.
- 12. HTML Timeline 1990 1992 1994 1996 1998 2000 2002 2004 2006 2008 2010 The rise of HTML5 2004: WHATWG begins what will become HTML5 2007: W3C charters new working group and adopts WHATWG’s work, renamed HTML5 2009: W3C does not renew the XHTML 2.0 charter 2010: Driven in large part by Apple and Google, public interest in HTML5 grows
- 14. NCSA MosaicWhat is the First-ever WEB BROWSER?
- 15. CERNWhat is the First-ever WESITE? Conseil Européen pour la Recherche Nucléaire (European Council for Nuclear Research) http://info.cern.cn
- 16. HTML XHTML
- 19. HTML5 is an EVOLUTION, not a REVOLUTION HTML5HTML4HTML3.2 XHTML2.0
- 20. Error Handling • Previous specifications left error handling up to user agents • XHTML 2.0 featured draconian error handling • Pages would stop rendering if an error was found • HTML5 features detailed algorithms for parsing error
- 21. New Features • New semantic elements and attributes • Built-in APIs to assist in building web applications • Added support for audio and video • HTML5 will reduce the need for plus-ins
- 22. DOCTYPE HTML4 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" “http://www.w3.org/TR/html4/strict.dtd"> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
- 24. Character Encoding HTML4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> HTML5 <meta charset="utf-8">
- 25. New Elements <canvas>, <audio>, <video>, <source>, <track>, <embed>, <header>, <nav>, <section>, <article>, <aside>, <footer>, <details>, <summary> and many others.
- 26. HTML4 Tagging <div id=“header”> <div id=“headerGroup”> <div id=“section”> <div id=“header”> <div id=“article”> <div id=“footer”> <div id=“nav”> <div id=“aside”> <div id=“footer”> <div id=“address”>