Skip to content

Instantly share code, notes, and snippets.

@neiled
Created November 25, 2010 23:20
Show Gist options
  • Star 29 You must be signed in to star a gist
  • Fork 10 You must be signed in to fork a gist
  • Save neiled/716066 to your computer and use it in GitHub Desktop.
Save neiled/716066 to your computer and use it in GitHub Desktop.
My haml version of the html 5 boiler plate code
!!! 5
/[if lt IE 7] <html lang="en" class="no-js ie6">
/[if IE 7 ] <html lang="en" class="no-js ie7">
/[if IE 8 ] <html lang="en" class="no-js ie8">
/[if IE 9 ] <html lang="en" class="no-js ie9">
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
%head
%meta{:charset => "utf-8"}/
/
Always force latest IE rendering engine (even in intranet) &amp; Chrome Frame
Remove this if you use the .htaccess
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
%title="Change me..."
%meta{:content => "", :name => "description"}/
%meta{:content => "", :name => "author"}/
/ Mobile viewport optimized: j.mp/bplateviewport
%meta{:name => "viewport", :content => "width=device-width; initial-scale=1.0; maximum-scale=1.0;"}
/ Place favicon.ico and apple-touch-icon.png in the root of your domain and delete these references
%link{:href => "/favicon.ico", :rel => "shortcut icon"}/
%link{:href => "/apple-touch-icon.png", :rel => "apple-touch-icon"}/
= stylesheet_link_tag :flutie, :cache => true
= stylesheet_link_tag :all
/ All JavaScript at the bottom, except for Modernizr which enables HTML5 elements &amp; feature detects
%script{:src => "/javascripts/modernizr-1.5.min.js"}
= csrf_meta_tag
= yield :header
/ paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/
%body
#container
%header
= render :partial => 'shared/header'
= render :partial=> 'shared/flashes'
#main.yui3-g
= yield
%footer.yui3-u-1
= yield :footer
/ ! end of #container
/ Javascript at the bottom for fast page loading
/ Grab Google CDN's jQuery. fall back to local if necessary
%script{:src => "http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"}
%script{:src => "http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js"}
:javascript
!window.jQuery && document.write('<script src="javascripts/jquery-1.4.2.min.js"><\/script>')
= yield :javascript
/[if lt IE 7 ]
<script src="js/dd_belatedpng.js?"></script>
<script>
\ //fix those png IMGs and .png_bg background-images
\ DD_belatedPNG.fix('img, .png_bg');
</script>
/ yui profiler and profileviewer - remove for production
/ %script{:src => "js/profiling/yahoo-profiling.min.js?"}
/ %script{:src => "js/profiling/config.js?v=1"}
/ end profiling code
:javascript
var _gaq = [['_setAccount', 'UA-1098906-8'], ['_trackPageview']];
(function(d, t) {
var g = d.createElement(t),
s = d.getElementsByTagName(t)[0];
g.async = true;
g.src = ('https:' == location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
s.parentNode.insertBefore(g, s);
})(document, 'script');
@johnantoni
Copy link

nice work, thanks

@johnrees
Copy link

Doesn't this need a </html> at the end?

@neiled
Copy link
Author

neiled commented Nov 15, 2011

Not with HAML...

@johnrees
Copy link

I think it does, as the head & body aren't nested within it?

@neiled
Copy link
Author

neiled commented Nov 15, 2011

Actually, you're right sorry, it does seem like it does. I guess I've never checked strict compliance with the results. To be honest this version is way out of date now, I'm going to do the new version of boiler plate soon but I'd check out the website to see if anyone else has already done it!

@johnrees
Copy link

No worries, I just wanted to confirm my suspicions as I was unsure about using raw html tags :)

Incase anyone stumbles onto these comments... here's a very stripped down version I've done for the current boilerplate https://gist.github.com/1366712

Thanks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment