So how to easily generate a project template that contains these lovely web muffins?
First, assuming you have express installed, generate a simple express project using LESS framework
express -c less project_name
This will generate a file structure like this for your project.

Replace the codes inside layout.jade with:
!!! 5
//if lt IE 7
<html class="no-js ie6 oldie" lang="en">
//if IE 7
<html class="no-js ie7 oldie" lang="en">
//if IE 8
<html class="no-js ie8 oldie" lang="en">
//[if gt IE 8]><!
html(class='no-js', lang='en')
//<![endif]
head
meta(charset='utf-8')
meta(http-equiv='X-UA-Compatible', content='IE=edge,chrome=1')
title
meta(name='description', content='')
meta(name='author', content='')
meta(name='viewport', content='width=device-width,initial-scale=1')
link(rel='stylesheet', href='stylesheets/style.css')
script(src='javascripts/libs/modernizr-2.0.6.min.js')
body!=body
#container
header
#main(role='main')
footer
script(src='//ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js')
script window.jQuery || document.write('<script src="javascripts/libs/jquery-1.6.3.min.js"><\\/script>')
script(defer, src='javascripts/plugins.js')
script(defer, src='javascripts/script.js')
script
var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview'],['_trackPageLoadTime']];
(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
s.parentNode.insertBefore(g,s)}(document,'script'));
//if lt IE 7
script(src='//ajax.googleapis.com/ajax/libs/chrome-frame/1.0.3/CFInstall.min.js', defer)
script(defer) window.attachEvent('onload',function(){CFInstall.check({mode:'overlay'})})
Next up, style.less:
/*-------------------------------------------------------------------------------------*\
HTML5 Boilerplate Lite
http://html5boilerplate.org
less.css same as style.css with added LESS CSS nesting, mixins, and variables
--
credit is left where credit is due.
\*-------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------*\
LESS CSS
\*---------------------------------------------------------------------------*/
/*........................................................*\
Variables
\*........................................................*/
/* Colors */
@white: rgba(255, 255, 255, 1);
@black: rgba(0, 0, 0, 1);
@yellow: #ff9;
@blue: #007DC5;
@darkBlue: #33589F;
@veryDarkBlue: #143352;
@grey: #999999;
@pink: #FF5E99;
/* Font */
@font: 'Droid Sans', arial, sans-serif;
@small: 12px;
@medium: 15px;
@large: 24px;
/*........................................................*\
Mixins
\*........................................................*/
.border-radius (@radius: 5px) { border-radius: @radius; }
.box-shadow (@hor: 3px, @vert: 2px, @blur: 5px, @shadow: #000) { box-shadow: @hor @vert @blur @shadow; }
.text-shadow (@hor: 3px, @vert: 2px, @blur: 5px, @shadow: #000) { text-shadow: @hor @vert @blur @shadow; }
.clear-text-shadow { text-shadow: none; }
.clear-box-shadow { box-shadow: none; }
.hide { display: none; }
.show { display: block; }
.invisible { visibility: hidden; }
.left { float: left; }
.right { float: right; }
/*---------------------------------------------------------------------------*\
Styles Reset
\*---------------------------------------------------------------------------*/
a, abbr, acronym, address, applet, article, aside, audio,b, blockquote,big, body,center, canvas, caption, cite, code, command,datalist, dd, del, details, dfn, dl, div, dt, em, embed,fieldset, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html,i, iframe, img, ins,kbd, keygen,label, legend, li, meter,nav,object, ol, output,p, pre, progress,q, s, samp, section, small, span, source, strike, strong, sub, sup,table, tbody, tfoot, thead, th, tr, tdvideo, tt,u, ul, var { background: transparent; border: 0 none; font-size: 100%; margin: 0; padding: 0; vertical-align: baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
blockquote, q { quotes: none;
&:before { content: ''; content: none; }
&:after { content: ''; content: none; }
}
ins { text-decoration: none; }
mark { background-color: @yellow; color: @black; font-weight: bold; }
abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }
table { border-collapse: collapse; border-spacing: 0; }
hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }
input, select { vertical-align: middle; }
/*---------------------------------------------------------------------*\
Typography
fonts.css from the YUI Library: http://developer.yahoo.com/yui/
\*---------------------------------------------------------------------*/
body { font:13px/1.231 @font; }
pre, code, kbd, samp { font-family: 'Courier New', monospace, sans-serif; }
/* -:[ Fibonacci based heading scale ratio ]:- */
h1 { font-size: 4.4em; font-weight: normal; }
h2 { font-size: 2.8em; font-weight: bold; }
h3 { font-size: 1.6em; font-weight: bold; }
h4 { font-size: 1.2em; font-weight: bold; }
/* -:[ Remove text-shadow from text selection for better readability: http://twitter.com/miketaylr/status/12228805301 ]:- */
::-moz-selection{ background: @pink; color: @white; .clear-text-shadow; }
::selection { background: @pink; color: @white; .clear-text-shadow; }
/*---------------------------------------------------------------------------------------------*\
Shortcuts & Helpers
\*---------------------------------------------------------------------------------------------*/
.separator { clear: both; float: left; height: 1px; width: 100%; } /* -:[ If ain't enough ]:- */
/*---------------------------------------------------------------------------------------------------------*\
Clearfix
http://j.mp/bestclearfix
http://blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page
\*---------------------------------------------------------------------------------------------------------*/
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; visibility: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
/*----------------------------------------------------------------------------------*\
Real styles start here
\*----------------------------------------------------------------------------------*/
body {
/* background: ;
color: ;
font: ..px @font; */
}
header {
.inside { }
nav {
ul {
li {
a {
&:hover { }
&:active { }
}
}
}
}
}
#wrap {
}
footer {
.inside { }
}
/*------------------------------------------------------------------------------*\
Media queries
\*------------------------------------------------------------------------------*/
@media all and (orientation:portrait) { /* Style adjustments for portrait mode goes here */ }
@media all and (orientation:landscape) { /* Style adjustments for landscape mode goes here */ }
/* ........................................................................
Grade-A Mobile Browsers (Opera Mobile, iPhone Safari, Android Chrome)
link: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/
Stop iOS and WinMobile from mobile-optimize the text:
link: http://j.mp/textsizeadjust
html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; }
........................................................................*/
@media screen and (max-device-width: 480px) { }
/*----------------------------------------------------------------------------------------------*\
Print styles
Inlined to avoid required HTTP connection - link: http://www.phpied.com/delay-loading-your-print-css/
\*----------------------------------------------------------------------------------------------*/
@media print {
* { background: transparent !important; color: #444 !important; .clear-text-shadow; }
a, a:visited { color: #444 !important; text-decoration: underline; }
a:after { content: " (" attr(href) ")"; }
abbr:after { content: " (" attr(title) ")"; }
.ir a:after { content: ""; } /* Don't show links for images */
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
tr, img { page-break-inside: avoid; }
@page { margin: 0.5cm; }
p, h2, h3 { orphans: 3; widows: 3; }
h2, h3{ page-break-after: avoid; }
}
That’s it.