Skip to content

Instantly share code, notes, and snippets.

@nfreear
Created February 5, 2013 13:17
Show Gist options
  • Save nfreear/4714381 to your computer and use it in GitHub Desktop.
Save nfreear/4714381 to your computer and use it in GitHub Desktop.
HTML5 boilerplate with WAI-ARIA landmark roles (IET-LTT, ou, qa, Haml)
<!doctype html>
%html{:lang => "en"}
%meta{:content => "IE=edge", "http-equiv" => "X-UA-Compatible"}/
%meta{:charset => "utf-8"}/
/[if lt IE 9]
<script src="//html5shim.googlecode.com/svn/trunk/html5-els.js"></script>
<script> document.createElement("main") </script>
%title MY TITLE
%header{:role => "banner"}
%h1 BANNER
%nav{:role => "navigation"}
%ul
%li
%a{:href => "#"} NAVIGATION
%form{:role => "search"}
%label{:for => "q"} Search
%input#q{:name => "q", :type => "search"}/
%input{:type => "submit"}/
%main{:role => "main"}
MAIN
%aside{:role => "complementary"}
COMPLEMENTARY
%footer{:role => "contentinfo"}
FOOTER
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment