HTML5
•
66 likes•6,537 views
An introductory session for HTML5, session was introduced in Mozilla Power'13, the first event for Mozilla in Egypt.
Recommended
More Related Content
Similar to HTML5
Similar to HTML5 (16)
More from Ibrahim Abdel Fattah Mohamed
More from Ibrahim Abdel Fattah Mohamed (14)
Recently uploaded
Recently uploaded (20)
HTML5
- 1. > le ml > it ht n” /t E 5< ”e = YP ML CT ang HT > l DO <! ml ead> itle t <h <t <h d> ea h </ > Ibrahim Abdel Fattah Mohamed @bingorabbit bingorabbit.com
- 2. W lcom !
- 4. Let's get back in History.. http://en.wikipedia.org/wiki/HTML 1995 1997 1998 1999 2000 2002 2004 2006 2009 2010
- 5. I just had to take the hypertext idea and connect it to the TCP and DNS ideas and — ta-da!— the World Wide Web. –- Sir, Tim Berners-Lee Known as the Creator of WWW
- 6. Sir. Tim Berners-Lee The Father of The Internet
- 7. 1995: HTML 2.0 Just standardized rules what people have been already using before..and it wasn't that good! 1995 1997 1998 1999 2000 2002 2004 2006 2009 2010
- 8. Strict Transitional Frameset 1997: HTML 3.2, Proposing 4.0 Adding standard support for tables and applets.. 1995 1997 1998 1999 2000 2002 2004 2006 2009 2010
- 9. 1999: HTML 4.01 Stable syntax and structure for HTML till it became the standard for web authoring. 1995 1997 1998 1999 2000 2002 2004 2006 2009 2010
- 10. 2000: XHTML 1.0 Trying to move structure more towards XML's, but browsers manufactures were kinda stubborn! 1995 1997 1998 1999 2000 2002 2004 2006 2009 2010
- 11. 2000->: The LEAP! XHTML 2.0 Up then DOWN!, Flash, Multimedia, and AJAX 1995 1997 1998 1999 2000 2002 2004 2006 2009 2010
- 12. 2004 - Present: HTML 5 Rise WHATWG, W3C adopts WHATWG work, Rich applications, Video, Audio, APIs. Large companies involved. 1995 1997 1998 1999 2000 2002 2004 2006 2009 2010
- 14. But.. WHY?!
- 15. Photo Credit: http://www.flickr.com/photos/hugo_provoste/522495023/ Sim plicity ..is the ultimate sophistication.. -– Leonardo Da Vinci
- 16. !DOCTYPE
- 17. Before.. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <!DOCTYPE html> After..
- 18. Interoperability
- 20. New Tags <article>, <aside>, <header>, <footer> <nav>, <section>, <audio>, <video> <embed>, <canvas>, <progress>, <meter>
- 21. FORMS! <input type=”email” /> <input type=”url” /> <input type=”range” /> <input type=”date” /> <input type=”tel” /> <input type=”color” /> <input type=”number” />
- 22. FORMS! <input list="browsers" name="browser"> <datalist id="browsers"> <option value="Internet Explorer"> <option value="Firefox"> <option value="Chrome"> <option value="Opera"> <option value="Safari"> </datalist>
- 23. FORMS! Placeholder, Required, Patterns <input pattern="[0-9][A-Z]{3}" name="product" type="text" title="Single digit then 3 UC letters."/>
- 25. ● ● ● ● ● ● ● ● 20 Things I learned about Browsers and Web: www.20thingsilearned.com Angry Birds: http://angrybirds.com/ Evolution of the Web: http://evolutionofweb.appspot.com/ HTML5 Test: http://html5test.com HTML5 Demos: http://html5demos.com/ Arena5: http://www.kevs3d.co.uk/dev/arena5/ Asteroids: http://www.kevs3d.co.uk/dev/asteroids/ HTML5 Visual Cheat Sheet: http://goo.gl/fL8DCa
- 26. Mobile Apps
- 27. Keywords HTML5 Mobile App Development HTML5 Boilerplate Modernizr Dive into HTML5 Book HTML5 Doctor HTML5 Rocks HTML5 Readiness caniuse.com
- 28. ? Questions
- 29. Thanks! :) Ibrahim A. Mohamed Tweet to me: @bingorabbit