advanced code snippet search

Base HTML5 Template

 / Published in: HTML
 

URL: http://snipplr.com/view.php?codeview&id=39056

HTML5 starting point template. Used in conjunction with HTML5 CSS reset at the above link.

Expand | Embed | Plain Text 
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. 	<meta charset="utf-8" />
  5. 	<meta name="description" content="A description about your site" />
  6. 	<meta name="keywords" content="keywords, separated, by, comma" />
  7. 	<title>Untitled Document</title>
  8. 	<link rel="shortcut icon" href="favicon.ico" />
  9. 	<link rel="stylesheet" href="css/style.css" media="screen" />
  10. 	<link rel="stylesheet" href="css/print.css" media="print" />
  11. 	<link rel="stylesheet" href="css/mobile.css" media="handheld" />
  12. 	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  13. 	<!--[if IE]>
  14. 		<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
  15. 	<![endif]-->
  16. </head>
  17.  
  18. <body>
  19. 	<section id="header">
  20. 		<header>
  21. 			<h1><a href="#">Site Title</a></h1>
  22. 			<nav>
  23. 				<ul>
  24. 					<li><a href="#">Home</a></li>
  25. 					<li><a href="#">About</a></li>
  26. 					<li><a href="#">Contact</a></li>
  27. 				</ul>
  28. 			</nav>
  29. 		</header>
  30. 	</section>
  31.  
  32. 	<section id="main">
  33. 		<article>
  34. 			<hgroup>
  35. 				<a href="#">
  36. 					<h1>Heading Title</h1>
  37. 					<h2>Heading Title 2</h2>
  38. 				</a>
  39. 			</hgroup>
  40. 			<p>Article Filler</p>
  41. 		</article>
  42. 		<aside>
  43. 			Sidebar Filler
  44. 		</aside>
  45. 	</section>
  46.  
  47. 	<section id="footer">
  48. 		<footer>
  49. 			&copy; Copyright Year by Author. All Rights Reserved.
  50. 		</footer>
  51. 	</section>
  52.  
  53. 	<script type="text/javascript">
  54. 		var _gaq = _gaq || [];
  55. 		_gaq.push(['_setAccount', 'XX-XXXXXXX-XX']);
  56. 		_gaq.push(['_trackPageview']);
  57.  
  58. 		(function() {
  59. 			var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
  60. 			ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
  61. 			var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  62. 		})();
  63. 	</script>
  64. </body>
  65. </html>

Report this snippet  

Comments

RSS Icon Subscribe to comments
Posted By: Foxyfox on November 21, 2010

Why are you putting sections around the elements?

Posted By: vagrantradio on November 29, 2010

Why not?

Posted By: vagrantradio on December 4, 2010

http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-section-element

Posted By: pixelsoul on February 18, 2012

You don't need around the and elements.

Posted By: pixelsoul on February 18, 2012

hmm.. that was supposed to say that you don't need "section" around the "header" and "footer" elements.

Posted By: vagrantradio on April 5, 2012

Not really, but it doesn't actually matter.

You need to login to post a comment.