1. 1 Company Confidential Skin a Complete DotNetNuke Website Using HTML5 and CSS3 in One Hour Amelia Marschall Partner & Creative Director

2. 2 Company Confidential HTML5 Basic Principles  Support existing content: If it’s not broke, don’t fix it  Less strict than XHTML  But some outdated elements cannot be used: Frames, font tag, center, big, blink (presentation items)  Added APIs and data storage for non-proprietary web apps

3. 3 Company Confidential 3 Skinning with HTML5

4. 4 Company Confidential HTML5 Doctype Skin.doctype.xml: ]]> That’s it!

5. 5 Company Confidential New HTML Elements

6. 6 Company Confidential Internet Explorer Fix IE needs this javascript to recognize the new elements: Available here: http://html5shiv.googlecode.com/svn/trunk/html5.js from remysharp.com http://html5shiv.googlecode.com/svn/trunk/html5.js remysharp.com Add to CSS so all browsers render elements as block-level: section, header, nav, article, aside, footer { display: block; }

7. 7 Company Confidential The Site http://htmldemo.gravityworksdesign.com

8. 8 Company Confidential 8 Styling with CSS3

9. 9 Company Confidential Fun Sites  html5readiness.com html5readiness.com  beercamp.com/2010 beercamp.com/2010  2011.beercamp.com 2011.beercamp.com  useragentman.com/tests/cssSandpaper/cube3.html useragentman.com/tests/cssSandpaper/cube3.html

10. 10 Company Confidential Questions? View the demo: http://htmldemo.gravityworksdesign.com Amelia Marschall Partner & Creative Director @MimiAmelia amelia@gravityworksdesign.com