<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
<title>Code Examples for Designing with Progressive Enhancement</title>
<style type="text/css">
/*styles for demos index page*/
body { margin: 50px 300px 30px 100px; font-family: "Segoe UI", Arial, sans-serif; color: #333; background: #fff; }
a:link { color: #307A3D; }
a:visited, a:active { color: #5ea84a; }
a:hover { color: #076517; }
#code-examples li { font-weight: bold; }
#code-examples li span.variations { font-weight: normal; }
.enhanced h1 { font-weight:normal; line-height:1; text-transform:lowercase; font-size:.6em; font-weight:normal; padding-bottom: 2em; margin-bottom: 3em; border-bottom: 1px solid #aaa; }
.enhanced .title-dw { color:#191919; font-size:3.5em; display:block; }
.enhanced .title-pe { font-weight:bold; color:#488D42; font-size:4.7em; display:block; }
.enhanced .title-sub { color:#474747; margin-top: .7em;display:block;font-size:2.5em; margin-top:.7em; }
.enhanced h2 { font-size: 1em; font-weight: normal; }
p.rights { font-size: .9em; margin: 1.5em 0 2em; }
#related-links { font-size: .8em; }
</style>
<script type="text/javascript" src="_shared/EnhanceJS/enhance.js"></script>
<script type="text/javascript">enhance({appendToggleLink: false});</script>
</head>
<body>
<h1><span class="title-dw">Designing with</span> <span class="title-pe">Progressive Enhancement</span> <span class="title-sub">Building the Web that Works for Everyone</span></h1>
<h2>Public code examples:</h2>
<ul id="code-examples">
<li><a href="collapsible/index.html">Collapsible content</a></li>
<li><a href="tree/index.html">Tree</a></li>
<li><a href="charting/index.html">Charting with HTML 5 Canvas</a> <span class="variations">(<a href="charting/vanilla.html">vanilla version</a>)</span></li>
<li>More coming soon...</li>
</ul>
<p><strong>Bought the book?</strong> Access all of the code examples at <a href="http://filamentgroup.com/dwpe">filamentgroup.com/dwpe/</a></p>
<p class="rights">All code is ©2010 <a href="http://filamentgroup.com">Filament Group, Inc.</a> and is released under the <a href="license.txt">MIT License</a> (free for use on commercial sites).</p>
<h2>Related links:</h2>
<ul id="related-links">
<li><a href="http://filamentgroup.com/dwpe">Book website for Designing with Progressive Enhancement</a></li>
<li><a href="http://enhancejs.googlecode.com/">EnhanceJS code respository</a></li>
<li><a href="http://filamentgroup.com/">Filament Group Website</a></li>
</ul>
</body>
</html>