diff --git a/assets/style.css b/assets/style.css
index f5a657e..a030cea 100644
--- a/assets/style.css
+++ b/assets/style.css
@@ -116,6 +116,22 @@ h6 {
 	text-align: center;
 }
 
+ul.search-results li {
+	margin-bottom: 1em;
+}
+
+ul.search-results li a.search-result {
+	font-size: 120%;
+	display: block;
+}
+
+ul.search-results li div.search-tag {
+	display: block;
+	font-size: 80%;
+	color: #555;
+	font-weight: bold;
+}
+
 input.search {
 	width: 100%;
 }
@@ -250,17 +266,18 @@ main {
 	padding-left: 2rem;
 	padding-right: 2rem;
 
-	font-size: 80%;
 	color: #777;
 }
 
 .sidebar-header {
 	font-weight: bold;
+	font-size: 80%;
 }
 
 .sidebar-values {
 	padding-left: 1em;
 	margin-bottom: 1em;
+	font-size: 80%;
 }
 
 /* main content */
diff --git a/templates/header.html b/templates/header.html
index 65de004..a82b1b4 100644
--- a/templates/header.html
+++ b/templates/header.html
@@ -31,10 +31,10 @@
         <a href="{{root}}search">Search</a>
       </div>
       {{?htags}}
-      <div class="sidebar-header">
+      <div class="sidebox-header">
         Page categories
       </div>
-      <div class="sidebar-values">
+      <div class="sidebox-values">
         <ul>
         {{#htags}}
         <li>{{#.}}<a href="{{href}}">{{^tag}}all{{/tag}}{{?tag}} » {{tag}}{{/tag}}{{/.}}</a></li>
diff --git a/templates/search.html b/templates/search.html
new file mode 100644
index 0000000..eae555c
--- /dev/null
+++ b/templates/search.html
@@ -0,0 +1,9 @@
+<html>
+{{> head.html}}
+<body>
+{{> header.html}}
+{{> searchform.html}}
+{{> searchresults.html}}
+{{> footer.html}}
+</body>
+</html>
diff --git a/templates/searchresults.html b/templates/searchresults.html
index 38a4c9a..4afb6f7 100644
--- a/templates/searchresults.html
+++ b/templates/searchresults.html
@@ -6,13 +6,15 @@
 </div>
 
 <div id="search_noquery">
-  <p>Enter a few words to the box above to start the search.</p>
+  <p>Enter a few words into the box above to start the search.</p>
+  <p>You may use <code>*</code> for wildcard search, and prefixes <code>+</code> for required terms and <code>-</code> for unwanted terms.</p>
+  <p><strong>Example:</strong> <code>laboratory noteb* +red -code</code> will find information about <em>laboratory notebooks</em> that must also describe something <em>red</em>, but do not contain any mention of <em>code</em>.</p>
 </div>
 
 <div id="search_success" style="display: none">
   <h1>Search results</h1>
-  <div id="search_results">
-  </div>
+  <ul id="search_results" class="search-results">
+  </ul>
 </div>
 
 <div id="search_fail" style="display: none">
@@ -74,9 +76,20 @@
         break;
       }
 
-      const r=results[ri]
-      var out = document.createElement("p")
-      out.appendChild(document.createTextNode(window.search_metadata[r.ref].title))
+      const r = results[ri]
+      const m = window.search_metadata[r.ref]
+      var out = document.createElement("li")
+      var a = document.createElement("a")
+      a.className = "search-result"
+      a.appendChild(document.createTextNode(m.title))
+      a.href = r.ref
+      out.appendChild(a)
+      for(var ti=0; ti<m.tags.length; ++ti) {
+        t = document.createElement("div")
+        t.className = "search-tag"
+        t.appendChild(document.createTextNode(m.tags[ti].join(" » ")));
+        out.appendChild(t);
+      }
       el_results.appendChild(out)
     }
 
@@ -98,6 +111,8 @@
     window.history.pushState("", "",
       window.location.pathname + '?search_query='+encodeURIComponent(ev.target.value)
     )
+    // This reinstalls the listener only _after_ the original event is done,
+    // preventing infinite events and CPU boils if a cat steps on the keyboard.
     el_query.addEventListener('input', handle_search_input)
   }
 
