Advanced Search

Return to Snippet

Revision: 9511
at November 10, 2008 20:16 by nighthawk
Initial Code 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" dir="ltr">
<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
	<title>Title goes here &raquo; Site title here</title>

	<!-- Meta Tags -->
	<base href="" />
	<meta name="author" content="#" />
	<meta name="description" content="#" />
	<meta name="copyright" content="#" />
	<meta name="robots" content="#" />
	<meta name="generator" content="#" />
	<meta name="keywords" content="#" />
	<meta http-equiv="expires" content="#" />
	<meta http-equiv="cache-control" content="#" />
	
	<!-- Fav icon -->
	<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />

	<!-- JavaScript setup -->
	<script type="text/javascript">
	/*<![CDATA[*/
	// add 'js' class to root element to nicely allow css that degrades gracefully if js is disabled
	document.getElementsByTagName('html')[0].className = 'js';
	/*]]>*/
	</script>
	
	<!-- CSS -->
	<link rel="stylesheet" href="/stylesheets/screen.css" type="text/css" media="screen, projection" />
	<link rel="stylesheet" href="/stylesheets/print.css" type="text/css" media="print" />
	
	<!--[if IE]>
	<link rel="stylesheet" href="/stylesheets/ie-all.css" type="text/css" media="screen, projection" />
	<![endif]-->
	
</head>
<body>
	<div id="container">
	
		<div id="header">
			<h1>Title of page goes here</h1>
			<h2>Subtitle of page goes here</h2>
		</div><!-- end header div -->
		
		<div id="nav">
			<ul class="menu">
				<li><a href="#">Link #1</a></li>
				<li><a href="#">Link #2</a></li>
				<li><a href="#">Link #3</a></li>
			</ul>
			<ul class="breadcrumbs">
				<li><a href="#">Home</a></li>
				<li><a href="#">Sub directory</a></li>
				<li><a href="#">Current page</a></li>
			</ul>
		</div><!-- end nav div -->

		<div id="main">
			<ul class="sidebar">
				<li><a href="#">Sidebar link #1</a></li>
				<li><a href="#">Sidebar link #2</a></li>
			</ul>

			<div id="sub1">
				<h3>Title of content</h3>
				<p>Begin content here</p>
			</div>
			
			<div id="sub2" class="hide">
				<h3>Title of content</h3>
				<p>Begin content here</p>
			</div>
		</div><!-- end main div -->

		<div id="footer">
			<p>&copy;2XXX company name here. Creative Commons link, your own link, validation, etc.</p>
		</div><!-- end footer div -->
		
	</div><!-- end container div -->

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript" src="/scripts/app.js"></script>
	
<!-- place Google Analytics code here -->

</body>
</html>
Initial URL 









Initial Description





Based on templates by luxuryluke and Kevin Hale.

Basic XHTML 1.0 layout which includes basic layout structure and is prepared for jQuery. On load a 'js' class is added to the root element in order to nicely handle graceful degradation if JS is disabled and prevent flickering if JS is enabled.

Also see the related CSS template.









Initial Title





XHTML 1.0 Template for jQuery









Initial Tags





css, javascript, template, html, xhtml, jquery









Initial Language





XHTML