Rewrite first few sections.
authorMike Taylor <mike@indexdata.com>
Tue, 17 Dec 2013 17:42:38 +0000 (17:42 +0000)
committerMike Taylor <mike@indexdata.com>
Tue, 17 Dec 2013 17:42:38 +0000 (17:42 +0000)
tools/htdocs/index.html

index 6959578..2a67a4b 100644 (file)
@@ -6,10 +6,11 @@
       body {
       font-family: Gill Sans, "Gillius ADF", Gillius, GilliusADF, Sans-Serif;
       }
-      h1 { color: #606060 }
+      h1 { font-weight: normal; color: #606060 }
       h2 { font-size: 100% }
       .pane { background: #eee; border-radius: 1em;
               padding: 0.25em 1em; margin: 0.75em; }
+      pre { background: #ddd; padding: 0.5em; }
     </style>
   </head>
   <body>
     <h1>MKWS: the MasterKey Widget Set</h1>
 
     <div class="pane">
-      <h2>This site contains tools, not content:</h2>
+      <h2>Add metasearching to your web-site painlessly</h2>
+      <p>
+       The MasterKey Widget Set provides the easiest possible way to
+       enhance an existing web-site with customised searching across
+       multiple sources, ranking and merging the results.
+      </p>
+      <p>
+       All you need to do is pull in our JavaScript and optional
+       stylesheet, then add <tt>&lt;div&gt;</tt>s to your page that
+       have special <tt>id</tt> attributes. We do the rest.
+      </p>
+    </div>
+
+    <div class="pane">
+      <h2>Example</h2>
+      <p>
+       Here is a completely functional (though ugly) MKWS-based
+       searching application:
+      </p>
+      <blockquote>
+       <pre>
+&lt;script type="text/javascript"
+        src="http://mkws.indexdata.com/mkws-complete.js">&lt;/script>
+&lt;div id="mkwsSearch">&lt;/div>
+&lt;div id="mkwsResults">&lt;/div></pre>
+      </blockquote>
+      <p>
+       That's it. A complete metasearching application. Everything
+       else is refinement.
+      </p>
+    </div>
+
+    <div class="pane">
+      <h2>Documentation</h2>
+      <ul>
+       <li>
+          The <a href="README.html">README</a> -- mostly technical details.
+       </li>
+       <li>
+          The <a href="whitepaper.html">whitepaper, including a
+          reference section.</a>
+         This is a much better introduction.
+       </li>
+      </ul>
+    </div>
+
+    <div class="pane">
+      <h2>Tools</h2>
       <ul>
        <li>
           <a href="mkws.js">mkws.js</a>
        </li>
       </ul>
     </div>
-
-    <div class="pane">
-      <h2>Documentation:</h2>
-      <ul>
-       <li>
-          The <a href="whitepaper.html">The whitepaper, including a reference section.</a>
-       </li>
-       <li>
-          The <a href="README.html">README.html</a>
-       </li>
-       <li>
-          The <a href="html-structure.txt"
-                >structure of the HTML generated by the MKWS widgets</a>,
-          which can be used to guide the customisation of its CSS styles.
-       </li>
-      </ul>
-    </div>
   </body>
 </html>