Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

The Good The Bad And The Ugly of HTML 5

5,968 views

Published on

Overview of HTML5

Published in: Technology, Design
  • Be the first to comment

The Good The Bad And The Ugly of HTML 5

  1. 1. The Good, the Bad, the Ugly - HTML 5 Gary Barber radharc.com.au manwithnoblog.com
  2. 2. AWIA / Port 80 Mini Talks - 5 March 2008 The Good , the bad , and the ugly - HTML 5
  3. 3. AWIA / Port 80 Mini Talks - 5 March 2008 The Good , the bad , and the ugly - HTML 5
  4. 4. AWIA / Port 80 Mini Talks - 5 March 2008 The Good , the bad , and the ugly - HTML 5
  5. 5. HTML 4 - Old in the Tooth AWIA / Port 80 Mini Talks - 5 March 2008 The Good , the bad , and the ugly - HTML 5
  6. 6. HTML 5 - New Kid on the Block AWIA / Port 80 Mini Talks - 5 March 2008 The Good , the bad , and the ugly - HTML 5
  7. 7. The Syntax <!doctype html> <html> <head> <meta charset=quot;UTF-8quot;> <title>Example document</title> </head> <body> <p>Example paragraph</p> </body> </html> AWIA / Port 80 Mini Talks - 5 March 2008 The Good , the bad , and the ugly - HTML 5
  8. 8. <section> <section> <h6>Clint and the Girl Next</h6> <p>The urban myth of Clint as a vacuum sales man have been widely exaggerated </p> <p>He was in fact a well know local lemonade stand attendant.</p> </section> AWIA / Port 80 Mini Talks - 5 March 2008 The Good , the bad , and the ugly - HTML 5
  9. 9. <article> <article> <h2>The Death of Clint</h2> <p>The death of the legend and all time good guy Clint Eastwood from eating too many tacos has been reported by local New Mexican sources.</p> <p>A Spokesman for taco Bell is reported to have denied these rumours.</p> </ article > AWIA / Port 80 Mini Talks - 5 March 2008 The Good , the bad , and the ugly - HTML 5
  10. 10. <aside> <aside> <p>Something that Clint did that wasn’t that important. Maybe he took his hat off. Narh! </p> </aside> AWIA / Port 80 Mini Talks - 5 March 2008 The Good , the bad , and the ugly - HTML 5
  11. 11. <header> <header> <h1>Life and Times of Clint</h1> <p>The street gossip from the tumbleweeds</p><div>.. Navigational features in here.. </div> </header> AWIA / Port 80 Mini Talks - 5 March 2008 The Good , the bad , and the ugly - HTML 5
  12. 12. <footer> <footer class=”vcard”> <p class=”copyright”>Copyright The Life and Times of Clint Inc 2007<p> <p class=”designer”>Site by: <a href=http:// clintsmates.com class=”url”>Clint’s Mates</a></p> </footer> AWIA / Port 80 Mini Talks - 5 March 2008 The Good , the bad , and the ugly - HTML 5
  13. 13. Nav & Menu <nav> <menu> <li> Navigational Item One</li> <li> Navigational Item Two</li> <li> Navigational Item Three</li> </menu> </nav> AWIA / Port 80 Mini Talks - 5 March 2008 The Good , the bad , and the ugly - HTML 5
  14. 14. <input> Gets a Little Help datetime datetime-local date month type = week time number range email url AWIA / Port 80 Mini Talks - 5 March 2008 The Good , the bad , and the ugly - HTML 5
  15. 15. <input> <input required type=”email” name=”your-email”> input: required {border 1px solid #FF0000;} AWIA / Port 80 Mini Talks - 5 March 2008 The Good , the bad , and the ugly - HTML 5
  16. 16. <input> and patterns min, max and range <input required min=”12” max=”999” type=”range”> pattern <input type=quot;urlquot; pattern=quot;[^:]+quot; required name=quot;testquot;> autocomplete <input name=quot;accountquot; autocomplete=quot;offquot; > AWIA / Port 80 Mini Talks - 5 March 2008 The Good , the bad , and the ugly - HTML 5
  17. 17. Rest In Peace basefont frame acronym big frameset applet center noframes isindex font dir s strike u AWIA / Port 80 Mini Talks - 5 March 2008 The Good , the bad , and the ugly - HTML 5
  18. 18. Questions? Liberate a spacer.gif today! Distributed under Creative Commons License Gary Barber gary@manwithnoblog.com radharc.com.au manwithnoblog.com AWIA / Port 80 Mini Talks - 5 March 2008 The Good , the bad , and the ugly - HTML 5

×