diff --git a/_data/nav.yml b/_data/nav.yml
index 1974aaa8..e23e750e 100644
--- a/_data/nav.yml
+++ b/_data/nav.yml
@@ -1,12 +1,17 @@
-- title: Home
-  url: /
+- title: About
+  url: /about/
+  sections:
+    - title: Charter
+      url: /charter/
+    - title: Roadmap
+      url: /roadmap/
 - title: News
   url: /news/
-- title: Documentation
-  url: /doc/
-- title: Community
-  url: /community/
 - title: Development
   url: https://github.com/neovim/neovim
+- title: Community
+  url: /community/
+- title: Documentation
+  url: /doc/
 - title: Sponsors
   url: /sponsors/
diff --git a/_includes/nav.html b/_includes/nav.html
index f0db90dd..48dae1f9 100644
--- a/_includes/nav.html
+++ b/_includes/nav.html
@@ -1,22 +1,47 @@
 <header class="navbar">
     <div class="container">
-        <nav class="site-nav">
-            <ul>
-        {% for nav in site.data.nav %}
-            {% if include.active == nav.title %}
-                <li class="current">
-            {% else %}
-                <li>
-            {% endif %}
-                 {% if nav.url contains 'http://' or nav.url contains 'https://' %}
-                  <a href="{{ nav.url }}">{{ nav.title }}</a>
-                 {% else %}
-                  <a href="{{ site.baseurl }}{{ nav.url }}">{{ nav.title }}</a>
-                 {% endif %}
-                </li>
-        {% endfor %}
-            </ul>
+        <nav class="navbar">
+	    <div class="container-fluid">
+	    <div class="navbar-header">
+		<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#menu" aria-expanded="false">
+		    <span class="sr-only">Toggle navigation</span>
+		    <img src="{{ site.baseurl }}/images/icons/icon-menu.svg" alt="Toggle navigation" class="navbar-top-align">
+		</button>
+		<a href="{{ site.baseurl }}/" class="navbar-brand">
+		    <img src="{{ site.baseurl }}/images/logo@2x.png" id="navbar-logo" alt="Neovim">
+		</a>
+	    </div>
+	    <div class="collapse navbar-collapse navbar-top-align" id="menu">
+	        <ul class="nav navbar-nav navbar-right">
+		{% for nav in site.data.nav %}
+		    {% if include.active == nav.title %}
+		    <li class="current">
+		    {% else %}
+		    <li>
+		    {% endif %}
+		    {% if nav.url contains 'http://' or nav.url contains 'https://' %}
+		    <a {% if nav.sections != null %}href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"{% else %}href="{{ nav.url }}"{% endif %}>{{ nav.title }}</a>
+		    {% else %}
+		    <a {% if nav.sections != null %}href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"{% else %}href="{{ site.baseurl }}{{ nav.url }}"{% endif %}>{{ nav.title }}</a>
+		    {% endif %}
+		    {% if nav.sections != null %}
+			<ul class="dropdown-menu">
+			{% for section in nav.sections %}
+			    <li>
+			    {% if section.url contains 'http://' or section.url contains 'https://' %}
+				<a href="{{ section.url }}">{{ section.title }}</a>
+			    {% else %}
+				<a href="{{ site.baseurl }}{{ section.url }}">{{ section.title }}</a>
+			    {% endif %}
+			    </li>
+			{% endfor %}
+			</ul>
+		    {% endif %}
+		    </li>
+		{% endfor %}
+		</ul>
+	    </div>
+	    </div>
         </nav>
-        <a href="{{ site.baseurl }}/"><img src="{{ site.baseurl }}/images/logo@2x.png" class="logo" alt="Neovim"></a>
     </div>
 </header>
diff --git a/_layouts/default.html b/_layouts/default.html
index d5bb5072..44c7a98c 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -8,6 +8,7 @@
     <title>{% if page.title %}{{ page.title }} - {% endif %}{{ site.title }}</title>
     <link href="http://fonts.googleapis.com/css?family=Lato:400,700,900" rel="stylesheet">
     <link href="//cdnjs.cloudflare.com/ajax/libs/normalize/3.0.0/normalize.min.css" rel="stylesheet">
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
     <link href="{{ site.baseurl }}/css/main.css" rel="stylesheet">
     <link rel="canonical" href="http://neovim.io{% if page.canonical_url %}{{ page.canonical_url }}{% else %}{{ page.url }}{% endif %}" />
     <!--[if lt IE 9]>
@@ -33,5 +34,6 @@
     </script>
     <script src="{{ site.baseurl }}/js/sponsors-override.js"></script>
     <script src="{{ site.baseurl }}/js/sponsors.js"></script>
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
   </body>
 </html>
diff --git a/about.html b/about.html
new file mode 100644
index 00000000..b25d9107
--- /dev/null
+++ b/about.html
@@ -0,0 +1,17 @@
+---
+layout: default
+title: About
+---
+
+{% include nav.html active='About' %}
+
+<div class="container">
+
+<h1>About</h1>
+
+<ul>
+    <li><a href="charter/">Charter</a></li>
+    <li><a href="roadmap/">Roadmap</a></li>
+</ul>
+
+</div>
diff --git a/charter.html b/charter.html
new file mode 100644
index 00000000..d51ae9f3
--- /dev/null
+++ b/charter.html
@@ -0,0 +1,70 @@
+---
+layout: default
+title: About
+---
+
+{% include nav.html active='About' %}
+
+<div class="container">
+
+<h1>Project Charter</h1>
+
+<p>Neovim is not a rewrite of Vim; it is a refactor (and sometimes redactor) in
+the tradition of Vim which itself derives from <a
+href="https://en.wikipedia.org/wiki/Stevie_%28text_editor%29">Stevie</a>.</p>
+
+<p>Neovim is a continuation and extension of Vim. Many rewrites, clones,
+emulators and imitators exist; some are very clever; none are Vim. Neovim
+strives to be a superset of Vim, notwithstanding some intentionally removed
+misfeatures; thus insofar as one accepts those few and carefully-considered
+excisions, Neovim <em>is</em> Vim. The project is built for users who want the good
+parts of Vim, without compromise, plus some new good parts.</p>
+
+<p>The design of Neovim is informed by established industry principles such as
+modularity, isolation, well-defined interfaces, in order to:</p>
+
+<ul>
+    <li> Simplify maintenance and comprehension</li>
+    <li> Encourage contributions, scale development work</li>
+    <li> Enable new applications (remote plugins, integrations) and frontends (UIs)</li>
+</ul>
+
+<p>This purpose of this charter is to clarify priorities and to guide
+decisions.</p>
+
+<h2>Project Goals</h2>
+
+<ul>
+    <li> Leverage existing and ongoing Vim development development</li>
+    <li> Maintain feature parity with Vim and avoid regressions</li>
+    <li> Continue the Vim tradition of backwards compatibility</li>
+    <li> Keep the core small and fast</li>
+    <li> Make the core more extensible</li>
+    <li> Target all platforms supported by libuv</li>
+    <li> Optimize "out of the box", for new users but especially regular users</li>
+    <li> Delegate functionality to plugins, but preserve the utility of the nvim core</li>
+    <li> Ship Luajit as first-class scripting alternative</li>
+</ul>
+
+<h2>Project Non-Goals</h2>
+
+<ul>
+    <li> Turn Vim into an IDE</li>
+    <li> Limit applications (such as IDEs) built with Neovim</li>
+    <li> Deprecate VimL</li>
+</ul>
+
+<h2>Guiding Principles</h2>
+
+<ul>
+    <li> <strong>Do Not Regress From Origin</strong></li>
+    <li> Decide outcomes by weighing cost and benefit</li>
+    <li> Use automation to solve problems</li>
+    <li> Enable new contributors: remove barriers to entry</li>
+    <li> Prefer usability over tradition if the benefit greatly outweighs the cost</li>
+    <li> In matters of taste or ambiguity, favor tradition/compatibility</li>
+    <li> Unblock contributors and plugin authors; allow progress</li>
+    <li> Give usability a chance</li>
+</ul>
+
+</div>
diff --git a/css/main.css b/css/main.css
index 112be7a3..7c860ab6 100644
--- a/css/main.css
+++ b/css/main.css
@@ -96,46 +96,12 @@ pre {
  * Logo and navigation at the top of the page
  */
 
-.navbar {
-  padding: 12px 0;
+#navbar-logo {
+    height: 3em;
 }
-@media (min-width: 568px) {
-  .navbar {
-    padding-top: 30px;
-    padding-bottom: 30px;
-  }
+.navbar-top-align {
+    margin-top:1em;
 }
-
-.logo {
-  width: 120px;
-  position: relative;
-  top: 4px;
-}
-@media (min-width: 568px) {
-  .logo {
-    width: 180px;
-  }
-}
-
-.site-nav {
-  display: none;
-}
-@media (min-width: 568px) {
-  .site-nav {
-    display: block;
-    float: right;
-  }
-  .site-nav ul {
-    list-style: none;
-  }
-  .site-nav li {
-    display: inline-block;
-    margin-top: 5px;
-    margin-left: 20px;
-    font-size: 18px;
-    font-family: 'Lato', sans-serif;
-    position: relative;
-  }
   .col-half {
     display: table-cell;
     width: 50%;
@@ -145,6 +111,8 @@ pre {
   .col-half.second {
     padding-left: 6%;
   }
+.navbar-right .dropdown-menu {
+    left: 0px;
 }
 
 /*
diff --git a/images/icons/icon-menu.svg b/images/icons/icon-menu.svg
new file mode 100644
index 00000000..33b07b8f
--- /dev/null
+++ b/images/icons/icon-menu.svg
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 16.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Untitled-2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="18px" height="12px" viewBox="0 0 18 12" enable-background="new 0 0 18 12" xml:space="preserve">
+<path fill="none" d="z"/>
+<g id="Layer_x25_201">
+	<rect width="18" height="2"/>
+	<rect y="5" width="18" height="2"/>
+	<rect y="10" width="18" height="2"/>
+</g>
+<path fill="none" d="z"/>
+</svg>
diff --git a/roadmap.html b/roadmap.html
new file mode 100644
index 00000000..27b939c0
--- /dev/null
+++ b/roadmap.html
@@ -0,0 +1,20 @@
+---
+layout: default
+title: Roadmap
+---
+
+{% include nav.html active='About' %}
+
+<div class="container">
+
+<h1>Roadmap</h1>
+
+<p>The roadmap is being defined still. For now, check the milestone issues in the tracker:</p>
+
+<ol>
+    <li> <a href="https://github.com/neovim/neovim/issues?q=is%3Aopen+is%3Aissue+milestone%3A0.1-first-public-release">0.1</a> (first public release)</li>
+    <li> <a href="https://github.com/neovim/neovim/issues?q=is%3Aopen+is%3Aissue+milestone%3A0.2">0.2</a></li>
+    <li> <a href="https://github.com/neovim/neovim/issues?q=is%3Aopen+is%3Aissue+milestone%3A0.3">0.3</a></li>
+</ol>
+
+</div>