diff --git a/_layouts/default.html b/_layouts/default.html
index 0245105..41578d3 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -6,7 +6,6 @@
     <title>{{ page.title }}</title>
 
     <link rel="stylesheet" href="/stylesheets/styles.css">
-    <link rel="stylesheet" href="/stylesheets/pygment_trac.css">
     <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
     <!--[if lt IE 9]>
     <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
@@ -21,28 +20,29 @@
       ga('send', 'pageview');
 
     </script>
+    <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
   </head>
   <body>
     <div class="wrapper">
       <header>
-        <h1>Altorouter</h1>
+        <h1 class="site-title"><a href="/">Altorouter</a></h1>
         <p>PHP5.3+ Routing Class. Supports REST, dynamic and reversed routing. </p>
 
         <p class="view"><a href="https://github.com/dannyvankooten/AltoRouter">View the Project on GitHub <small>dannyvankooten/AltoRouter</small></a></p>
 
+        <a href="https://github.com/dannyvankooten/AltoRouter/zipball/master" rel="nofollow" class="btn"><i class="fa fa-download"></i> Download ZIP</a>
+        <a href="https://github.com/dannyvankooten/AltoRouter" class="btn"><i class="fa fa-github-alt"></i> View on GitHub</a>
 
-        <ul>
-          <li><a href="https://github.com/dannyvankooten/AltoRouter/zipball/master">Download <strong>ZIP File</strong></a></li>
-          <li><a href="https://github.com/dannyvankooten/AltoRouter/tarball/master">Download <strong>TAR Ball</strong></a></li>
-          <li><a href="https://github.com/dannyvankooten/AltoRouter">View On <strong>GitHub</strong></a></li>
-        </ul>
       </header>
       <section>
          {{ content }}
       </section>
       <footer>
+
+        <iframe src="/github-stars.html?user=dannyvankooten&amp;repo=altorouter&amp;type=watch&amp;count=true" allowtransparency="true" frameborder="0" scrolling="0" width="120px" height="20px" style="margin-bottom: 20px;"></iframe>
+
         <p>This project is maintained by <a href="https://github.com/dannyvankooten">dannyvankooten</a></p>
-        <p><small>Hosted on GitHub Pages &mdash; Theme by <a rel="nofollow" href="https://github.com/orderedlist">orderedlist</a></small></p>
+        <p><small>Hosted on GitHub Pages<br />Theme by <a rel="nofollow" href="https://github.com/orderedlist">orderedlist</a></small></p>
       </footer>
     </div>
     <script src="/javascripts/scale.fix.js"></script>
diff --git a/github-stars.html b/github-stars.html
new file mode 100644
index 0000000..455d9e6
--- /dev/null
+++ b/github-stars.html
@@ -0,0 +1 @@
+<html><head><meta name="robots" content="noindex,nofollow"></head><body><style type=text/css>body{padding:0;margin:0;font:700 11px/14px "Helvetica Neue",Helvetica,Arial,sans-serif;overflow:hidden}.github-btn{height:20px;overflow:hidden}.gh-btn,.gh-count,.gh-ico{float:left}.gh-btn,.gh-count{padding:2px 5px 2px 4px;color:#333;text-decoration:none;text-shadow:0 1px 0 #fff;white-space:nowrap;cursor:pointer;border-radius:3px}.gh-btn{background-color:#e6e6e6;background-image:-webkit-gradient(linear,0 0,0 100%,from(#fafafa),to(#eaeaea));background-image:-webkit-linear-gradient(#fafafa,#eaeaea);background-image:-moz-linear-gradient(top,#fafafa,#eaeaea);background-image:-ms-linear-gradient(#fafafa,#eaeaea);background-image:-o-linear-gradient(#fafafa,#eaeaea);background-image:linear-gradient(#fafafa,#eaeaea);background-repeat:no-repeat;border:1px solid #d4d4d4;border-bottom-color:#bcbcbc}.gh-btn:hover,.gh-btn:focus,.gh-btn:active{color:#fff;text-decoration:none;text-shadow:0 -1px 0 rgba(0,0,0,.25);border-color:#518cc6 #518cc6 #2a65a0;background-color:#3072b3}.gh-btn:hover,.gh-btn:focus{background-image:-webkit-gradient(linear,0 0,0 100%,from(#599bdc),to(#3072b3));background-image:-webkit-linear-gradient(#599bdc,#3072b3);background-image:-moz-linear-gradient(top,#599bdc,#3072b3);background-image:-ms-linear-gradient(#599bdc,#3072b3);background-image:-o-linear-gradient(#599bdc,#3072b3);background-image:linear-gradient(#599bdc,#3072b3)}.gh-btn:active{background-image:none;-webkit-box-shadow:inset 0 2px 5px rgba(0,0,0,.1);-moz-box-shadow:inset 0 2px 5px rgba(0,0,0,.1);box-shadow:inset 0 2px 5px rgba(0,0,0,.1)}.gh-ico{width:14px;height:14px;margin-right:4px;vertical-align:3px;background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNy4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTMycHgiIGhlaWdodD0iNjZweCIgdmlld0JveD0iMCAwIDEzMiA2NiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMTMyIDY2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBmaWxsPSIjMzMzMzMzIiBkPSJNMzMsMS44Yy0xNy43LDAtMzIsMTQuMy0zMiwzMmMwLDE0LjEsOS4yLDI2LjEsMjEuOSwzMC40DQoJYzEuNiwwLjMsMi4yLTAuNywyLjItMS41YzAtMC44LDAtMi44LDAtNS40Yy04LjksMS45LTEwLjgtNC4zLTEwLjgtNC4zYy0xLjUtMy43LTMuNi00LjctMy42LTQuN2MtMi45LTIsMC4yLTEuOSwwLjItMS45DQoJYzMuMiwwLjIsNC45LDMuMyw0LjksMy4zYzIuOSw0LjksNy41LDMuNSw5LjMsMi43YzAuMy0yLjEsMS4xLTMuNSwyLTQuM2MtNy4xLTAuOC0xNC42LTMuNi0xNC42LTE1LjhjMC0zLjUsMS4yLTYuMywzLjMtOC42DQoJYy0wLjMtMC44LTEuNC00LjEsMC4zLTguNWMwLDAsMi43LTAuOSw4LjgsMy4zYzIuNi0wLjcsNS4zLTEuMSw4LTEuMWMyLjcsMCw1LjUsMC40LDgsMS4xYzYuMS00LjEsOC44LTMuMyw4LjgtMy4zDQoJYzEuNyw0LjQsMC42LDcuNywwLjMsOC41YzIuMSwyLjIsMy4zLDUuMSwzLjMsOC42YzAsMTIuMy03LjUsMTUtMTQuNiwxNS44YzEuMSwxLDIuMiwyLjksMi4yLDUuOWMwLDQuMywwLDcuNywwLDguOA0KCWMwLDAuOSwwLjYsMS45LDIuMiwxLjVDNTUuOCw1OS45LDY1LDQ3LjksNjUsMzMuOEM2NSwxNi4xLDUwLjcsMS44LDMzLDEuOHoiLz4NCjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBmaWxsPSIjRkZGRkZGIiBkPSJNOTksMS44Yy0xNy43LDAtMzIsMTQuMy0zMiwzMmMwLDE0LjEsOS4yLDI2LjEsMjEuOSwzMC40DQoJYzEuNiwwLjMsMi4yLTAuNywyLjItMS41YzAtMC44LDAtMi44LDAtNS40Yy04LjksMS45LTEwLjgtNC4zLTEwLjgtNC4zYy0xLjUtMy43LTMuNi00LjctMy42LTQuN2MtMi45LTIsMC4yLTEuOSwwLjItMS45DQoJYzMuMiwwLjIsNC45LDMuMyw0LjksMy4zYzIuOSw0LjksNy41LDMuNSw5LjMsMi43YzAuMy0yLjEsMS4xLTMuNSwyLTQuM2MtNy4xLTAuOC0xNC42LTMuNi0xNC42LTE1LjhjMC0zLjUsMS4yLTYuMywzLjMtOC42DQoJYy0wLjMtMC44LTEuNC00LjEsMC4zLTguNWMwLDAsMi43LTAuOSw4LjgsMy4zYzIuNi0wLjcsNS4zLTEuMSw4LTEuMWMyLjcsMCw1LjUsMC40LDgsMS4xYzYuMS00LjEsOC44LTMuMyw4LjgtMy4zDQoJYzEuNyw0LjQsMC42LDcuNywwLjMsOC41YzIuMSwyLjIsMy4zLDUuMSwzLjMsOC42YzAsMTIuMy03LjUsMTUtMTQuNiwxNS44YzEuMSwxLDIuMiwyLjksMi4yLDUuOWMwLDQuMywwLDcuNywwLDguOA0KCWMwLDAuOSwwLjYsMS45LDIuMiwxLjVjMTIuNy00LjIsMjEuOS0xNi4yLDIxLjktMzAuNEMxMzEsMTYuMSwxMTYuNywxLjgsOTksMS44eiIvPg0KPC9zdmc+DQo=);background-size:28px 14px;background-repeat:no-repeat;background-position:0 0}.gh-btn:hover .gh-ico,.gh-btn:focus .gh-ico,.gh-btn:active .gh-ico{background-position:-14px 0}.gh-count{position:relative;display:none;margin-left:4px;background-color:#fafafa;border:1px solid #d4d4d4}.gh-count:hover,.gh-count:focus{color:#4183C4}.gh-count:before,.gh-count:after{content:'';position:absolute;display:inline-block;width:0;height:0;border-color:transparent;border-style:solid}.gh-count:before{top:50%;left:-3px;margin-top:-4px;border-width:4px 4px 4px 0;border-right-color:#fafafa}.gh-count:after{top:50%;left:-4px;z-index:-1;margin-top:-5px;border-width:5px 5px 5px 0;border-right-color:#d4d4d4}.github-btn-large{height:30px}.github-btn-large .gh-btn,.github-btn-large .gh-count{padding:3px 10px 3px 8px;font-size:16px;line-height:22px;border-radius:4px}.github-btn-large .gh-ico{width:20px;height:20px;background-size:40px 20px}.github-btn-large .gh-btn:hover .gh-ico,.github-btn-large .gh-btn:focus .gh-ico,.github-btn-large .gh-btn:active .gh-ico{background-position:-20px 0}.github-btn-large .gh-count{margin-left:6px}.github-btn-large .gh-count:before{left:-5px;margin-top:-6px;border-width:6px 6px 6px 0}.github-btn-large .gh-count:after{left:-6px;margin-top:-7px;border-width:7px 7px 7px 0}</style><span class=github-btn id=github-btn><a class=gh-btn id=gh-btn href=# target=_blank><span class=gh-ico></span> <span class=gh-text id=gh-text></span></a> <a class=gh-count id=gh-count href=# target=_blank></a></span><script>function addCommas(t){return String(t).replace(/(\d)(?=(\d{3})+$)/g,"$1,")}function jsonp(t){var e=document.createElement("script");e.src=t+"?callback=callback",head.insertBefore(e,head.firstChild)}function callback(t){"watch"==type?counter.innerHTML=addCommas(t.data.watchers):"fork"==type?counter.innerHTML=addCommas(t.data.forks):"follow"==type&&(counter.innerHTML=addCommas(t.data.followers)),"true"==count&&(counter.style.display="block")}var params=function(){for(var t,e=[],o=window.location.href.slice(window.location.href.indexOf("?")+1).split("&"),r=0;r<o.length;r++)t=o[r].split("="),e.push(t[0]),e[t[0]]=t[1];return e}(),user=params.user,repo=params.repo,type=params.type,count=params.count,size=params.size,head=document.getElementsByTagName("head")[0],button=document.getElementById("gh-btn"),mainButton=document.getElementById("github-btn"),text=document.getElementById("gh-text"),counter=document.getElementById("gh-count");button.href="https://github.com/"+user+"/"+repo+"/","watch"==type?(mainButton.className+=" github-watchers",text.innerHTML="Star",counter.href="https://github.com/"+user+"/"+repo+"/stargazers"):"fork"==type?(mainButton.className+=" github-forks",text.innerHTML="Fork",counter.href="https://github.com/"+user+"/"+repo+"/network"):"follow"==type&&(mainButton.className+=" github-me",text.innerHTML="Follow @"+user,button.href="https://github.com/"+user,counter.href="https://github.com/"+user+"/followers"),"large"==size&&(mainButton.className+=" github-btn-large"),jsonp("follow"==type?"https://api.github.com/users/"+user:"https://api.github.com/repos/"+user+"/"+repo);</script>
\ No newline at end of file
diff --git a/index.html b/index.html
index b68bb5b..bb9e4d9 100644
--- a/index.html
+++ b/index.html
@@ -2,150 +2,46 @@
 title: AltoRouter - PHP Router that supports REST, dynamic and reversed routing
 layout: default
 ---
-        <h1>
+<h1>
 <a name="altorouter-" class="anchor" href="#altorouter-"><span class="octicon octicon-link"></span></a>AltoRouter <a href="http://travis-ci.org/dannyvankooten/AltoRouter"><img src="https://api.travis-ci.org/dannyvankooten/AltoRouter.png" alt="Build Status"></a>
 </h1>
 
-<p>AltoRouter is a small but powerful routing class for PHP 5.3+, heavily inspired by <a href="https://github.com/chriso/klein.php/">klein.php</a>.</p>
+<p class="intro">AltoRouter is a small but powerful routing class for PHP 5.3+, heavily inspired by <a href="https://github.com/chriso/klein.php/">klein.php</a>.</p>
 
+{% highlight php startinline %}
+$router = new AltoRouter();
+
+// map homepage
+$router->map( 'GET', '/', function() {
+    require __DIR__ . '/views/home.php';
+});
+
+// map users details page
+$router->map( 'GET|POST', '/users/[i:id]/', function( $id ) {
+  $user = .....
+  require __DIR__ . '/views/user/details.php';
+});
+{% endhighlight %}
+
+<h2>Router Features</h2>
 <ul>
-<li>Dynamic routing with named parameters</li>
-<li>Reversed routing</li>
-<li>Flexible regular expression routing (inspired by <a href="http://www.sinatrarb.com/">Sinatra</a>)</li>
-<li>Custom regexes</li>
+    <li>HTTP methods</li>
+    <li>Dynamic routing with (named) route parameters</li>
+    <li>Flexible regular expression routing, inspired by <a href="http://www.sinatrarb.com/">Sinatra</a></li>
+    <li>Reversed routing</li>
+    <li>Custom regexes</li>
 </ul>
 
-<h2>
-    <a name="getting-started" class="anchor" href="#getting-started"><span class="octicon octicon-link"></span></a>
-    Getting started
-</h2>
+<h2>Using AltoRouter</h2>
+<p>To use AltoRouter in your project you need a web server running PHP 5.3 or newer.</p>
 
-<ol>
-<li>PHP 5.3.x is required</li>
-<li>Install AltoRouter using Composer or manually</li>
-<li>Setup URL rewriting so that all requests are handled by <strong>index.php</strong>
-</li>
-<li>Create an instance of AltoRouter, map your routes and match a request.</li>
-<li>Have a look at the basic example in the <code>examples</code> directory for a better understanding on how to use AltoRouter.</li>
-</ol><h2>
-
-    <a name="user-content-routing" class="anchor" href="#routing" aria-hidden="true"><span class="octicon octicon-link"></span></a>Routing</h2>
-
-<p>With AltoRouter you define new routes by using the <code>map</code> method.</p>
-
-<p><code>map</code> accepts 4 parameters;</p>
-
-<p><strong>Request methods</strong><br>
-    One of 5 HTTP Methods, or a pipe-separated list of multiple HTTP Methods (GET|POST|PATCH|PUT|DELETE)</p>
-
-<p><strong>Route pattern</strong><br>
-    Route pattern to match with. You can use multiple pre-set regex filters, like <code>[i:id]</code>. A custom regex must start with an <code>@</code>.</p>
-
-<p><strong>Target</strong><br>
-    The target of where this route should point to. Can be anything.</p>
-
-<p><strong>Name</strong><br>
-    Optional name of this route. Supply if you want to reverse route this url in your application.</p>
-
-<h3>
-    <a name="user-content-example" class="anchor" href="#example" aria-hidden="true"><span class="octicon octicon-link"></span></a>Example</h3>
-
-<div class="highlight highlight-php"><pre><span class="nv">$router</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">AltoRouter</span><span class="p">();</span>
-<span class="c1">// (optional) set basepath to the subdirectory relative to the application root</span>
-<span class="c1">// or, a virtual path where you want to integrate AltoRouter.</span>
-<span class="nv">$router</span><span class="o">-&gt;</span><span class="na">setBasePath</span><span class="p">(</span><span class="s1">'/AltoRouter'</span><span class="p">);</span>
-
-<span class="nv">$router</span><span class="o">-&gt;</span><span class="na">map</span><span class="p">(</span><span class="s1">'GET|POST'</span><span class="p">,</span><span class="s1">'/'</span><span class="p">,</span> <span class="s1">'home#index'</span><span class="p">,</span> <span class="s1">'home'</span><span class="p">);</span>
-<span class="nv">$router</span><span class="o">-&gt;</span><span class="na">map</span><span class="p">(</span><span class="s1">'GET'</span><span class="p">,</span><span class="s1">'/users'</span><span class="p">,</span> <span class="k">array</span><span class="p">(</span><span class="s1">'c'</span> <span class="o">=&gt;</span> <span class="s1">'UserController'</span><span class="p">,</span> <span class="s1">'a'</span> <span class="o">=&gt;</span> <span class="s1">'ListAction'</span><span class="p">));</span>
-<span class="nv">$router</span><span class="o">-&gt;</span><span class="na">map</span><span class="p">(</span><span class="s1">'GET'</span><span class="p">,</span><span class="s1">'/users/[i:id]'</span><span class="p">,</span> <span class="s1">'users#show'</span><span class="p">,</span> <span class="s1">'users_show'</span><span class="p">);</span>
-<span class="nv">$router</span><span class="o">-&gt;</span><span class="na">map</span><span class="p">(</span><span class="s1">'POST'</span><span class="p">,</span><span class="s1">'/users/[i:id]/[delete|update:action]'</span><span class="p">,</span> <span class="s1">'usersController#doAction'</span><span class="p">,</span> <span class="s1">'users_do'</span><span class="p">);</span>
-
-<span class="c1">// reversed routing</span>
-<span class="nv">$router</span><span class="o">-&gt;</span><span class="na">generate</span><span class="p">(</span><span class="s1">'users_show'</span><span class="p">,</span> <span class="k">array</span><span class="p">(</span><span class="s1">'id'</span> <span class="o">=&gt;</span> <span class="mi">5</span><span class="p">));</span> <span class="c1"># =&gt; /users/5</span>
-</pre></div>
-
-<p>For quickly adding multiple routes, you can use the <code>addRoutes</code> method. This method accepts an array or any kind of traversable.</p>
-
-<div class="highlight highlight-php"><pre><span class="nv">$router</span><span class="o">-&gt;</span><span class="na">addRoutes</span><span class="p">(</span><span class="k">array</span><span class="p">(</span>
-  <span class="k">array</span><span class="p">(</span><span class="s1">'PATCH'</span><span class="p">,</span><span class="s1">'/users/[i:id]'</span><span class="p">,</span> <span class="s1">'users#update'</span><span class="p">,</span> <span class="s1">'update_user'</span><span class="p">),</span>
-  <span class="k">array</span><span class="p">(</span><span class="s1">'DELETE'</span><span class="p">,</span><span class="s1">'/users/[i:id]'</span><span class="p">,</span> <span class="s1">'users#delete'</span><span class="p">,</span> <span class="s1">'delete_user'</span><span class="p">)</span>
-<span class="p">));</span>
-</pre></div>
-
-<p><strong>You can use the following limits on your named parameters. AltoRouter will create the correct regexes for you.</strong></p>
-
-<div class="highlight highlight-php"><pre><span class="o">*</span>                    <span class="c1">// Match all request URIs</span>
-<span class="p">[</span><span class="nx">i</span><span class="p">]</span>                  <span class="c1">// Match an integer</span>
-<span class="p">[</span><span class="nx">i</span><span class="o">:</span><span class="nx">id</span><span class="p">]</span>               <span class="c1">// Match an integer as 'id'</span>
-<span class="p">[</span><span class="nx">a</span><span class="o">:</span><span class="nx">action</span><span class="p">]</span>           <span class="c1">// Match alphanumeric characters as 'action'</span>
-<span class="p">[</span><span class="nx">h</span><span class="o">:</span><span class="nb">key</span><span class="p">]</span>              <span class="c1">// Match hexadecimal characters as 'key'</span>
-<span class="p">[</span><span class="o">:</span><span class="nx">action</span><span class="p">]</span>            <span class="c1">// Match anything up to the next / or end of the URI as 'action'</span>
-<span class="p">[</span><span class="nx">create</span><span class="o">|</span><span class="nx">edit</span><span class="o">:</span><span class="nx">action</span><span class="p">]</span> <span class="c1">// Match either 'create' or 'edit' as 'action'</span>
-<span class="p">[</span><span class="o">*</span><span class="p">]</span>                  <span class="c1">// Catch all (lazy, stops at the next trailing slash)</span>
-<span class="p">[</span><span class="o">*:</span><span class="nx">trailing</span><span class="p">]</span>         <span class="c1">// Catch all as 'trailing' (lazy)</span>
-<span class="p">[</span><span class="o">**:</span><span class="nx">trailing</span><span class="p">]</span>        <span class="c1">// Catch all (possessive - will match the rest of the URI)</span>
-<span class="o">.</span><span class="p">[</span><span class="o">:</span><span class="nx">format</span><span class="p">]</span><span class="o">?</span>          <span class="c1">// Match an optional parameter 'format' - a / or . before the block is also optional</span>
-</pre></div>
-
-<p><strong>Some more complicated examples</strong></p>
-
-<div class="highlight highlight-php"><pre><span class="o">@/</span><span class="p">(</span><span class="o">?</span><span class="p">[</span><span class="nx">A</span><span class="o">-</span><span class="nx">Za</span><span class="o">-</span><span class="nx">z</span><span class="p">]{</span><span class="mi">2</span><span class="p">}</span><span class="nx">_</span><span class="p">[</span><span class="nx">A</span><span class="o">-</span><span class="nx">Za</span><span class="o">-</span><span class="nx">z</span><span class="p">]{</span><span class="mi">2</span><span class="p">})</span><span class="err">$</span> <span class="c1">// custom regex, matches language codes like "en_us" etc.</span>
-<span class="o">/</span><span class="nx">posts</span><span class="o">/</span><span class="p">[</span><span class="o">*:</span><span class="nx">title</span><span class="p">][</span><span class="nx">i</span><span class="o">:</span><span class="nx">id</span><span class="p">]</span>        <span class="c1">// Matches "/posts/this-is-a-title-123"</span>
-<span class="o">/</span><span class="nx">output</span><span class="o">.</span><span class="p">[</span><span class="nx">xml</span><span class="o">|</span><span class="nx">json</span><span class="o">:</span><span class="nx">format</span><span class="p">]</span><span class="o">?</span>    <span class="c1">// Matches "/output", "output.xml", "output.json"</span>
-<span class="o">/</span><span class="p">[</span><span class="o">:</span><span class="nx">controller</span><span class="p">]</span><span class="o">?/</span><span class="p">[</span><span class="o">:</span><span class="nx">action</span><span class="p">]</span><span class="o">?</span>    <span class="c1">// Matches the typical /controller/action format</span>
-</pre></div>
-
-<p><strong>The character before the colon (the 'match type') is a shortcut for one of the following regular expressions</strong></p>
-
-<div class="highlight highlight-php"><pre><span class="s1">'i'</span>  <span class="o">=&gt;</span> <span class="s1">'[0-9]++'</span>
-<span class="s1">'a'</span>  <span class="o">=&gt;</span> <span class="s1">'[0-9A-Za-z]++'</span>
-<span class="s1">'h'</span>  <span class="o">=&gt;</span> <span class="s1">'[0-9A-Fa-f]++'</span>
-<span class="s1">'*'</span>  <span class="o">=&gt;</span> <span class="s1">'.+?'</span>
-<span class="s1">'**'</span> <span class="o">=&gt;</span> <span class="s1">'.++'</span>
-<span class="s1">''</span>   <span class="o">=&gt;</span> <span class="s1">'[^/\.]++'</span>
-</pre></div>
-
-<p><strong>New match types can be added using the <code>addMatchTypes()</code> method</strong></p>
-
-<div class="highlight highlight-php"><pre><span class="nv">$router</span><span class="o">-&gt;</span><span class="na">addMatchTypes</span><span class="p">(</span><span class="k">array</span><span class="p">(</span><span class="s1">'cId'</span> <span class="o">=&gt;</span> <span class="s1">'[a-zA-Z]{2}[0-9](?:_[0-9]++)?'</span><span class="p">));</span>
-</pre></div>
-
-<h2>
-    <a name="user-content-matching" class="anchor" href="#matching" aria-hidden="true"><span class="octicon octicon-link"></span></a>Matching</h2>
-
-<p>Route lookup is done by calling <code>match</code>.</p>
-
-<div class="highlight highlight-php"><pre><span class="c1">// perform a match against the current request url</span>
-<span class="nv">$result</span> <span class="o">=</span> <span class="nv">$router</span><span class="o">-&gt;</span><span class="na">match</span><span class="p">();</span>
-
-<span class="c1">// perform a match against a given url</span>
-<span class="nv">$result</span> <span class="o">=</span> <span class="nv">$router</span><span class="o">-&gt;</span><span class="na">match</span><span class="p">(</span><span class="s1">'/path/to/somewhere'</span><span class="p">);</span>
-</pre></div>
-
-<h3>
-    <a name="user-content-return-value" class="anchor" href="#return-value" aria-hidden="true"><span class="octicon octicon-link"></span></a>Return value</h3>
-
-<p>The return value will be an associative array if a match is found and <code>false</code> otherwise.</p>
-
-<p>The array consists of 3 keys; <code>target</code>, <code>params</code> and <code>name</code>.</p>
-
-<p>Where <code>target</code> and <code>name</code> contain the values passed to <code>map</code> and <code>params</code> is an associative array of params extracted from the url.</p>
-
-<h3>
-    <a name="user-content-example-1" class="anchor" href="#example-1" aria-hidden="true"><span class="octicon octicon-link"></span></a>Example</h3>
-
-<div class="highlight highlight-php"><pre><span class="nv">$router</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">AltoRouter</span><span class="p">();</span>
-<span class="nv">$router</span><span class="o">-&gt;</span><span class="na">map</span><span class="p">(</span><span class="s1">'GET'</span><span class="p">,</span> <span class="s1">'/user/[i:id]'</span><span class="p">,</span> <span class="s1">'user_controller#show_profile'</span><span class="p">,</span> <span class="s1">'user_profile'</span><span class="p">);</span>
-<span class="nv">$result</span> <span class="o">=</span> <span class="nv">$router</span><span class="o">-&gt;</span><span class="na">match</span><span class="p">(</span><span class="s1">'/user/123'</span><span class="p">);</span>
-
-<span class="nv">$result</span> <span class="o">==</span> <span class="k">array</span><span class="p">(</span>
-  <span class="s1">'target'</span> <span class="o">=&gt;</span> <span class="s1">'user_controller#show_profile'</span><span class="p">,</span>
-  <span class="s1">'params'</span> <span class="o">=&gt;</span> <span class="k">array</span><span class="p">(</span>
-    <span class="s1">'id'</span> <span class="o">=&gt;</span> <span class="mi">123</span>
-  <span class="p">),</span>
-  <span class="s1">'name'</span> <span class="o">=&gt;</span> <span class="s1">'user_profile'</span>
-<span class="p">);</span>
-</pre>
+<ul>
+    <li><a href="/usage/install.html">Install AltoRouter</a></li>
+    <li><a href="/usage/rewrite-requests.html">Rewrite all requests to AltoRouter</a></li>
+    <li><a href="/usage/mapping-routes.html">Map your routes</a></li>
+    <li><a href="/usage/matching-requests.html">Match requests</a></li>
+    <li><a href="/usage/processing-requests.html">Process the request your preferred way</a></li>
+</ul>
 
 <h2>
 <a name="contributors" class="anchor" href="#contributors"><span class="octicon octicon-link"></span></a>Contributors</h2>
@@ -155,15 +51,8 @@ layout: default
 <li><a href="https://github.com/koenpunt">Koen Punt</a></li>
 <li><a href="https://github.com/adduc">John Long</a></li>
 <li><a href="https://github.com/niahoo">Niahoo Osef</a></li>
-</ul><h2>
-<a name="license" class="anchor" href="#license"><span class="octicon octicon-link"></span></a>License</h2>
+</ul>
 
-<p>(MIT License)</p>
 
-<p>Copyright (c) 2012-2014 Danny van Kooten <a href="mailto:hi@dannyvankooten.com">hi@dannyvankooten.com</a></p>
-
-<p>Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:</p>
-
-<p>The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.</p>
-
-<p>THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.</p>
\ No newline at end of file
+<p>Released under the <a href="/license.html">MIT Public License</a>.</p>
+<p>&copy; 2012-2014 <a href="https://dannyvankooten.com/">Danny van Kooten</a></p>
\ No newline at end of file
diff --git a/license.html b/license.html
new file mode 100644
index 0000000..f29bbbb
--- /dev/null
+++ b/license.html
@@ -0,0 +1,15 @@
+---
+title: License - AltoRouter
+layout: default
+---
+<h1>License</h1>
+
+<p>AltoRouter is released under the MIT Public License.</p>
+
+<p>Copyright (c) 2012-2014 <a href="https://dannyvankooten.com/">Danny van Kooten</a><br />
+
+<p>Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:</p>
+
+<p>The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.</p>
+
+<p>THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.</p>
\ No newline at end of file
diff --git a/stylesheets/styles.css b/stylesheets/styles.css
index e1f7f81..4296bb8 100644
--- a/stylesheets/styles.css
+++ b/stylesheets/styles.css
@@ -24,6 +24,12 @@ h1 {
   font-size:28px;
 }
 
+.site-title a{
+  text-decoration: none;
+  color: inherit;
+  font-weight: inherit;
+}
+
 h2 {
   color:#393939;
 }
@@ -32,6 +38,10 @@ h3, h4, h5, h6 {
   color:#494949;
 }
 
+.subtitle {
+  margin-top: 40px;
+}
+
 a {
   color:#39c;
   font-weight:400;
@@ -41,7 +51,6 @@ a {
 a small {
   font-size:11px;
   color:#777;
-  margin-top:-0.6em;
   display:block;
 }
 
@@ -101,64 +110,11 @@ header {
   position:fixed;
 }
 
-header ul {
-  list-style:none;
-  height:40px;
-  
-  padding:0;
-  
-  background: #eee;
-  background: -moz-linear-gradient(top, #f8f8f8 0%, #dddddd 100%);
-  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8f8f8), color-stop(100%,#dddddd));
-  background: -webkit-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
-  background: -o-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
-  background: -ms-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
-  background: linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
-  
-  border-radius:5px;
-  border:1px solid #d2d2d2;
-  box-shadow:inset #fff 0 1px 0, inset rgba(0,0,0,0.03) 0 -1px 0;
-  width:270px;
-}
-
-header li {
-  width:89px;
-  float:left;
-  border-right:1px solid #d2d2d2;
-  height:40px;
-}
-
-header ul a {
-  line-height:1;
-  font-size:11px;
-  color:#999;
-  display:block;
-  text-align:center;
-  padding-top:6px;
-  height:40px;
-}
-
 strong {
   color:#222;
   font-weight:700;
 }
 
-header ul li + li {
-  width:88px;
-  border-left:1px solid #fff;
-}
-
-header ul li + li + li {
-  border-right:none;
-  width:89px;
-}
-
-header ul a strong {
-  font-size:14px;
-  display:block;
-  color:#222;
-}
-
 section {
   width:560px;
   float:right;
@@ -183,6 +139,29 @@ footer {
   bottom:50px;
 }
 
+h1 small {
+  color: lightGray;
+  font-size: 60%;
+  display: block;
+  margin-bottom: 10px;
+}
+
+.btn {
+  display: inline-block;
+  white-space: nowrap;
+  margin-bottom: 10px;
+  font-size: 14px;
+  background: #39c;
+  padding: 5px 10px;
+  color: white;
+  border-bottom: 2px solid #006699;
+}
+
+.btn:hover {
+  background: #006699;
+  border-bottom-color: #003366;
+}
+
 @media print, screen and (max-width: 960px) {
   
   div.wrapper {
@@ -253,3 +232,74 @@ footer {
     color:#444;
   }
 }
+
+/* pygments */
+.highlight  { background: #ffffff; }
+.highlight .c { color: #999988; font-style: italic } /* Comment */
+.highlight .err { color: #a61717; background-color: #e3d2d2 } /* Error */
+.highlight .k { font-weight: bold } /* Keyword */
+.highlight .o { font-weight: bold } /* Operator */
+.highlight .cm { color: #999988; font-style: italic } /* Comment.Multiline */
+.highlight .cp { color: #999999; font-weight: bold } /* Comment.Preproc */
+.highlight .c1 { color: #999988; font-style: italic } /* Comment.Single */
+.highlight .cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */
+.highlight .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
+.highlight .gd .x { color: #000000; background-color: #ffaaaa } /* Generic.Deleted.Specific */
+.highlight .ge { font-style: italic } /* Generic.Emph */
+.highlight .gr { color: #aa0000 } /* Generic.Error */
+.highlight .gh { color: #999999 } /* Generic.Heading */
+.highlight .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
+.highlight .gi .x { color: #000000; background-color: #aaffaa } /* Generic.Inserted.Specific */
+.highlight .go { color: #888888 } /* Generic.Output */
+.highlight .gp { color: #555555 } /* Generic.Prompt */
+.highlight .gs { font-weight: bold } /* Generic.Strong */
+.highlight .gu { color: #800080; font-weight: bold; } /* Generic.Subheading */
+.highlight .gt { color: #aa0000 } /* Generic.Traceback */
+.highlight .kc { font-weight: bold } /* Keyword.Constant */
+.highlight .kd { font-weight: bold } /* Keyword.Declaration */
+.highlight .kn { font-weight: bold } /* Keyword.Namespace */
+.highlight .kp { font-weight: bold } /* Keyword.Pseudo */
+.highlight .kr { font-weight: bold } /* Keyword.Reserved */
+.highlight .kt { color: #445588; font-weight: bold } /* Keyword.Type */
+.highlight .m { color: #009999 } /* Literal.Number */
+.highlight .s { color: #d14 } /* Literal.String */
+.highlight .na { color: #008080 } /* Name.Attribute */
+.highlight .nb { color: #0086B3 } /* Name.Builtin */
+.highlight .nc { color: #445588; font-weight: bold } /* Name.Class */
+.highlight .no { color: #008080 } /* Name.Constant */
+.highlight .ni { color: #800080 } /* Name.Entity */
+.highlight .ne { color: #990000; font-weight: bold } /* Name.Exception */
+.highlight .nf { color: #990000; font-weight: bold } /* Name.Function */
+.highlight .nn { color: #555555 } /* Name.Namespace */
+.highlight .nt { color: #000080 } /* Name.Tag */
+.highlight .nv { color: #008080 } /* Name.Variable */
+.highlight .ow { font-weight: bold } /* Operator.Word */
+.highlight .w { color: #bbbbbb } /* Text.Whitespace */
+.highlight .mf { color: #009999 } /* Literal.Number.Float */
+.highlight .mh { color: #009999 } /* Literal.Number.Hex */
+.highlight .mi { color: #009999 } /* Literal.Number.Integer */
+.highlight .mo { color: #009999 } /* Literal.Number.Oct */
+.highlight .sb { color: #d14 } /* Literal.String.Backtick */
+.highlight .sc { color: #d14 } /* Literal.String.Char */
+.highlight .sd { color: #d14 } /* Literal.String.Doc */
+.highlight .s2 { color: #d14 } /* Literal.String.Double */
+.highlight .se { color: #d14 } /* Literal.String.Escape */
+.highlight .sh { color: #d14 } /* Literal.String.Heredoc */
+.highlight .si { color: #d14 } /* Literal.String.Interpol */
+.highlight .sx { color: #d14 } /* Literal.String.Other */
+.highlight .sr { color: #009926 } /* Literal.String.Regex */
+.highlight .s1 { color: #d14 } /* Literal.String.Single */
+.highlight .ss { color: #990073 } /* Literal.String.Symbol */
+.highlight .bp { color: #999999 } /* Name.Builtin.Pseudo */
+.highlight .vc { color: #008080 } /* Name.Variable.Class */
+.highlight .vg { color: #008080 } /* Name.Variable.Global */
+.highlight .vi { color: #008080 } /* Name.Variable.Instance */
+.highlight .il { color: #009999 } /* Literal.Number.Integer.Long */
+
+.type-csharp .highlight .k { color: #0000FF }
+.type-csharp .highlight .kt { color: #0000FF }
+.type-csharp .highlight .nf { color: #000000; font-weight: normal }
+.type-csharp .highlight .nc { color: #2B91AF }
+.type-csharp .highlight .nn { color: #000000 }
+.type-csharp .highlight .s { color: #A31515 }
+.type-csharp .highlight .sc { color: #A31515 }
diff --git a/usage/install.html b/usage/install.html
new file mode 100644
index 0000000..6d1b948
--- /dev/null
+++ b/usage/install.html
@@ -0,0 +1,52 @@
+---
+title: Installing AltoRouter
+layout: default
+---
+
+<h1>
+    <small>Using AltoRouter</small> 
+    Installation
+</h1>
+
+<h2>Install AltoRouter using Composer</h2>
+<p>To install using Composer, you will have to install Composer first.</p>
+
+{% highlight bash %}
+curl -s https://getcomposer.org/installer | php
+{% endhighlight %}
+
+<p>Create a <strong>composer.json</strong> file in your project root.</p>
+
+{% highlight json %}
+{
+    "require": {
+        "altorouter/altorouter": "1.1.0"
+    }
+}
+{% endhighlight %}
+
+<p>Tell Composer to install the required dependencies.</p>
+
+{% highlight bash %}
+php composer.phar install
+{% endhighlight %}
+
+<p>If you want to use the autoloading provided by Composer, add the following line to your application file.</p>
+
+{% highlight php startinline %}
+require 'vendor/autoload.php';
+{% endhighlight %}
+
+<p>You are now ready to use the <code>AltoRouter</code> class. <a href="/usage/rewrite-requests.html">Rewrite all requests to your application file</a> and start <a href="/usage/mapping-routes.html">mapping your routes</a>. </p>
+
+<h2 class="subtitle">Install AltoRouter manually</h2>
+<p>Just <a href="https://github.com/dannyvankooten/AltoRouter/zipball/master">download the AltoRouter class</a> and require it in your application file.</p>
+
+{% highlight php startinline %}
+require 'AltoRouter.php';
+{% endhighlight %}
+
+<p>
+    <a style="float:right;" href="/usage/rewrite-requests.html">Rewrite requests &raquo;</a> 
+    <br style="clear:both;">
+</p>
\ No newline at end of file
diff --git a/usage/mapping-routes.html b/usage/mapping-routes.html
new file mode 100644
index 0000000..1080dd3
--- /dev/null
+++ b/usage/mapping-routes.html
@@ -0,0 +1,131 @@
+---
+title: "Mapping routes using AltoRouter"
+layout: default
+---
+<h1>
+    <small>Using AltoRouter</small> 
+    Mapping Routes
+</h1>
+
+<p>By now, you should have <a href="/usage/rewrite-requests.html">rewritten al requests to be handled by a single file in which you created an AltoRouter instance.</a></p>
+<p>To map your routes, use the <code>map()</code> method. The following example maps all <code>GET /</code> requests.</p>
+
+{% highlight php startinline %}
+    $router->map( 'GET', '/', 'render_home', 'home' );
+{% endhighlight %}
+
+<p>The <code>map()</code> method accepts the following parameters.</p>
+
+<h3><code>$method</code> (string)</h3>
+<p>
+    This is a pipe-delimited string of the accepted HTTP requests methods.<br /><br />
+    <em>Example: </em><code>GET|POST|PATCH|PUT|DELETE</code>
+</p>
+
+<h3><code>$route</code> (string)</h3>
+<p>
+    This is the route pattern to match against. This can be a plain string, one of the predefined regex filters or a custom regex. Custom regexes must start with <code>@</code>.
+    <br /><br />
+    <em>Examples: </em>
+</p>
+<table>
+    <tr>
+        <th>Route</th>
+        <th>Example Match</th>
+        <th>Variables</th>
+    </tr>
+    <tr>
+        <td><code>/contact/</code></td>
+        <td><code>/contact/</code></td>
+        <td></td>
+    </tr>
+    <tr>
+        <td><code>/users/[i:id]/</code></td>
+        <td><code>/users/12/</code></td>
+        <td><code>$id: 12</code></td>
+    </tr>
+    <tr>
+        <td><code>/[a:c]/[a:a]?/[i:id]?</code></td>
+        <td><code>/controller/action/21</code></td>
+        <td><code>$c: "controller", $a: "action", $id: 21</code></td>
+    </tr>
+</table>
+
+<h3><code>$target</code> (mixed) </h3>
+<p>As AltoRouter leaves handling routes up to you, this can be anything.</p>
+<p>
+    <em>Example using a function callback:</em> <br />
+    <code>function() { ... }</code>
+</p>
+<p>
+    <em>Example using a controller#action string:</em> <br />
+    <code>UserController#showDetails</code>
+</p>
+
+<h3><code>$name</code> (string, optional)</h3>
+<p>If you want to use reversed routing, specify a name parameter so you can later generate URL's using this route.</p>
+<p>
+    <em>Example:</em><br />
+    <code>user_details</code></coe>
+ </p>
+
+<h3>Example Mapping</h3>
+{% highlight php startinline%}
+// map homepage using callable
+$router->map( 'GET', '/', function() {
+    require __DIR__ . '/views/home.php';
+});
+
+// map users details page using controller#action string
+$router->map( 'GET', '/users/[i:id]/', 'UserController#showDetails' );
+
+// map contact form handler using function name string
+$router->map( 'POST', '/contact/', 'handleContactForm' );
+{% endhighlight %}
+
+<p>For quickly adding multiple routes, you can use the <code>addRoutes</code> method. This method accepts an array or any kind of traversable.</p>
+
+<div class="highlight highlight-php"><pre><span class="nv">$router</span><span class="o">-&gt;</span><span class="na">addRoutes</span><span class="p">(</span><span class="k">array</span><span class="p">(</span>
+  <span class="k">array</span><span class="p">(</span><span class="s1">'PATCH'</span><span class="p">,</span><span class="s1">'/users/[i:id]'</span><span class="p">,</span> <span class="s1">'users#update'</span><span class="p">,</span> <span class="s1">'update_user'</span><span class="p">),</span>
+  <span class="k">array</span><span class="p">(</span><span class="s1">'DELETE'</span><span class="p">,</span><span class="s1">'/users/[i:id]'</span><span class="p">,</span> <span class="s1">'users#delete'</span><span class="p">,</span> <span class="s1">'delete_user'</span><span class="p">)</span>
+<span class="p">));</span>
+</pre></div>
+
+<h2>Match Types</h2>
+<p>You can use the following limits on your named parameters. AltoRouter will create the correct regexes for you.</p>
+
+<div class="highlight highlight-php"><pre><span class="o">*</span>                    <span class="c1">// Match all request URIs</span>
+<span class="p">[</span><span class="nx">i</span><span class="p">]</span>                  <span class="c1">// Match an integer</span>
+<span class="p">[</span><span class="nx">i</span><span class="o">:</span><span class="nx">id</span><span class="p">]</span>               <span class="c1">// Match an integer as 'id'</span>
+<span class="p">[</span><span class="nx">a</span><span class="o">:</span><span class="nx">action</span><span class="p">]</span>           <span class="c1">// Match alphanumeric characters as 'action'</span>
+<span class="p">[</span><span class="nx">h</span><span class="o">:</span><span class="nb">key</span><span class="p">]</span>              <span class="c1">// Match hexadecimal characters as 'key'</span>
+<span class="p">[</span><span class="o">:</span><span class="nx">action</span><span class="p">]</span>            <span class="c1">// Match anything up to the next / or end of the URI as 'action'</span>
+<span class="p">[</span><span class="nx">create</span><span class="o">|</span><span class="nx">edit</span><span class="o">:</span><span class="nx">action</span><span class="p">]</span> <span class="c1">// Match either 'create' or 'edit' as 'action'</span>
+<span class="p">[</span><span class="o">*</span><span class="p">]</span>                  <span class="c1">// Catch all (lazy, stops at the next trailing slash)</span>
+<span class="p">[</span><span class="o">*:</span><span class="nx">trailing</span><span class="p">]</span>         <span class="c1">// Catch all as 'trailing' (lazy)</span>
+<span class="p">[</span><span class="o">**:</span><span class="nx">trailing</span><span class="p">]</span>        <span class="c1">// Catch all (possessive - will match the rest of the URI)</span>
+<span class="o">.</span><span class="p">[</span><span class="o">:</span><span class="nx">format</span><span class="p">]</span><span class="o">?</span>          <span class="c1">// Match an optional parameter 'format' - a / or . before the block is also optional</span>
+</pre></div>
+
+<p>The character before the colon (the 'match type') is a shortcut for one of the following regular expressions</p>
+
+<div class="highlight highlight-php"><pre><span class="s1">'i'</span>  <span class="o">=&gt;</span> <span class="s1">'[0-9]++'</span>
+<span class="s1">'a'</span>  <span class="o">=&gt;</span> <span class="s1">'[0-9A-Za-z]++'</span>
+<span class="s1">'h'</span>  <span class="o">=&gt;</span> <span class="s1">'[0-9A-Fa-f]++'</span>
+<span class="s1">'*'</span>  <span class="o">=&gt;</span> <span class="s1">'.+?'</span>
+<span class="s1">'**'</span> <span class="o">=&gt;</span> <span class="s1">'.++'</span>
+<span class="s1">''</span>   <span class="o">=&gt;</span> <span class="s1">'[^/\.]++'</span>
+</pre></div>
+
+<p>You can register your own match types using the <code>addMatchTypes()</code> method.</p>
+
+<div class="highlight highlight-php"><pre><span class="nv">$router</span><span class="o">-&gt;</span><span class="na">addMatchTypes</span><span class="p">(</span><span class="k">array</span><span class="p">(</span><span class="s1">'cId'</span> <span class="o">=&gt;</span> <span class="s1">'[a-zA-Z]{2}[0-9](?:_[0-9]++)?'</span><span class="p">));</span>
+</pre></div>
+
+<p>Once your routes are all mapped you can start matching requests and continue processing the request.</p>
+
+<p>
+    <a style="float:left;" href="/usage/rewrite-requests.html">&laquo; Rewriting requests</a> 
+    <a style="float:right;" href="/usage/matching-requests.html">Matching requests &raquo;</a> 
+    <br style="clear:both;">
+</p>
diff --git a/usage/matching-requests.html b/usage/matching-requests.html
new file mode 100644
index 0000000..1c6695d
--- /dev/null
+++ b/usage/matching-requests.html
@@ -0,0 +1,57 @@
+---
+title: Matching requests using AltoRouter
+layout: default
+---
+<h1>
+    <small>Using AltoRouter</small> 
+    Matching Requests
+</h1>
+
+<p>To match the current request, just call the `match()` method without any parameters.</p>
+
+{% highlight php startinline %}
+$match = $router->match();
+{% endhighlight %}
+
+<p>If a match was found, the <code>match()</code> method will return an associative array with the following 3 keys.</p>
+
+<p>
+	<code>target</code> (mixed)<br />
+	The target of the route, given during mapping the route.
+</p>
+
+<p>
+	<code>params</code> (array)<br />
+	Named parameters found in the request url.
+</p>
+
+<p>
+	<code>name</code> (string)<br />
+	The name of the route.
+</p>
+
+<p><em>Example</em></p>
+
+{% highlight php startinline %}
+$router = new AltoRouter();
+$router->map( 'GET', '/', function() { .. }, 'home' );
+
+// assuming current request url = '/'
+$match = $router->match();
+
+/*
+array(3) { 
+	["target"]	=> object(Closure)#2 (0) { } 
+	["params"]	=> array(0) { } 
+	["name"] 	=> 'home' 
+}
+*/
+{% endhighlight %}
+
+<p>AltoRouter does not process the request for you, you are free to use the method you prefer. Here is a simplified example <a href="/usage/processing-requests.html">how to process requests using closures</a> though.</p>
+
+<p>
+    <a style="float:left;" href="/usage/mapping-routes.html">&laquo; Mapping routes</a> 
+    <a style="float:right;" href="/usage/processing-requests.html">Processing requests &raquo;</a> 
+    <br style="clear:both;">
+</p>
\ No newline at end of file
diff --git a/usage/processing-requests.html b/usage/processing-requests.html
new file mode 100644
index 0000000..3e76d50
--- /dev/null
+++ b/usage/processing-requests.html
@@ -0,0 +1,40 @@
+---
+title: Processing requests using AltoRouter
+layout: default
+---
+<h1>
+    <small>Using AltoRouter</small> 
+    Processing Requests
+</h1>
+
+<p>AltoRouter does not process requests for you so you are free to use the method you prefer. To help you get started, here's a simplified example using closures.</p>
+
+{% highlight php startinline %}
+$router = new AltoRouter();
+
+// map homepage
+$router->map( 'GET', '/', function() {
+	require __DIR__ . '/views/home.php';
+});
+
+// map user details page
+$router->map( 'GET', '/user/[i:id]/', function( $id ) {
+	require __DIR__ . '/views/user-details.php';
+});
+
+// match current request url
+$match = $router->match();
+
+// call closure or throw 404 status
+if( $match && is_callable( $match['target'] ) ) {
+	call_user_func_array( $match['target'], $match['params'] ); 
+} else {
+	// no route was matched
+	header( $_SERVER["SERVER_PROTOCOL"] . ' 404 Not Found');
+}
+{% endhighlight %}
+
+<p>
+    <a style="float:left;" href="/usage/matching-requests.html">&laquo; Matching requests</a> 
+    <br style="clear:both;">
+</p>
\ No newline at end of file
diff --git a/usage/rewrite-requests.html b/usage/rewrite-requests.html
new file mode 100644
index 0000000..7729e4c
--- /dev/null
+++ b/usage/rewrite-requests.html
@@ -0,0 +1,43 @@
+---
+title: "Rewrite all requests to AltoRouter"
+layout: default
+---
+<h1>
+	<small>Using AltoRouter</small> 
+	Rewrite all requests to AltoRouter
+</h1>
+
+<p>To use AltoRouter, you will need to rewrite all requests to a single file in which you create an instance of the AltoRouter class.</p>
+<p>There are various ways to go about this, but here are examples for Apache and Nginx.</p>
+
+<h4>Apache <code>.htaccess</code></h4>
+{% highlight apache %}
+RewriteEngine on
+RewriteCond %{REQUEST_FILENAME} !-f
+RewriteRule . index.php [L]
+{% endhighlight %}
+
+<h4>Nginx <code>nginx.conf</code></h4>
+{% highlight nginx %}
+try_files $uri /index.php;
+{% endhighlight %}
+
+<p>All requests are now handled by the same file. In that file, you create an <code>AltoRouter</code> instance.</p>
+
+{% highlight php startinline %}
+$router = new AltoRouter();
+{% endhighlight %}
+
+<p>Optionally, if your project lives in a sub-folder of your web root you use the <code>setBasePath()</code> method to set a base path.</p>
+
+{% highlight php startinline %}
+$router->setBasePath('/alto-app/');
+{% endhighlight %}
+
+<p>You are now ready to start <a href="/usage/mapping-routes.html">mapping your routes</a>.</p>
+
+<p>
+	<a style="float:left;" href="/usage/install.html">&laquo; Installing AltoRouter</a> 
+	<a style="float:right;" href="/usage/mapping-routes.html">Mapping routes &raquo;</a> 
+	<br style="clear:both;">
+</p>
