<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    <title>Costa Living</title>
    <link rel="stylesheet" href="/css/base.css" type="text/css" />
    <meta name="verify-v1" content="/tLUnaL9Ij7F3o2DER80ZWDumQaxdvIXlMzkEmsQb/8=" />
  </head>
  <body>
<!--begin header-->
    <div id="top">
      <div id="strapline">
        <h1>
          <a href="/">Bel EPA - 10 years advanced research and development on the WWW</a>
        </h1>
      </div>
      <div id="header">
        <div id="logo">
          <a href="/">
            <img src="/graphics/logo.jpg" height="35" width="360" alt="Logo image" />
          </a>
        </div>
        <div id="topnav">
          <ul>
            <li>
              <a href="/development/">Development</a>
            </li>
            <li>
              <a href="/websites/">Websites</a>
            </li>
            <li>
              <a href="/newmedia/">New Media</a>
            </li>
            <li>
              <a href="/contact/">Contact us</a>
            </li>
          </ul>
        </div>
      </div>
    </div>
<!--end header-->
    <div id="content">
      <h4>Costa Living</h4>
      <p>
<img src="01.jpg" height="295" width="450" style="float:left;" class="imgleft" alt="Untitled image" />
We are developing this website in partnership with my brother Neil. Neil lives on the Spanish Costa Blanca and works with estate agents there.
</p>
      <p>
We are in the process of creating a aggregator website to support potential
purchasers of property on the Costa Blanca.
</p>
      <p>
Many of Neil's clients are interested in exploring the potential of a well-run aggregator site.
</p>
      <p>
The design and engineering requirements are pretty self-evident: site navigation must be intuitively natural, find a way to avoid overwhelming the user with search output, find a way to avoid "No results" pages and create a tightly-coupled linkage between text content and database results.
</p>
      <p>
<img src="02.jpg" height="295" width="460" style="float:right;" class="imgright" alt="Untitled image" />
Whilst we were at HP Labs, Steve and I worked up some interesting data manipulation and presentation techniques for supporting direct dynamic interaction with database content.
</p>
      <p>
For this website, I have rendered one of the principles into HTML. 
</p>
      <p>
Search parameters are set by selection of one or more options.  Results for each of the possible permutations of selection are pre-calculated, realised in a graphical presentation and stored.
</p>
      <p>
The presentation is shown in the adjacent screenshot.  The result image is an imagemap and the LEDs are active areas. When user positions the mouse pointer over an LED, summary details of the property are revealed in the right-hand panel (via a combination of Javascript and CSS styling). Where the LED represents a group of properties, brief details of all the properties are shown. Clicking on an LED leads to a page presenting the full details of the property (for a singleton) or a list of summary details (for multiples).
</p>
      <p>
<img src="03.jpg" height="310" width="450" style="float:left;" class="imgleft" alt="Untitled image" />
One of the most difficult engineering design tasks of this website has been to create a structure which allows for the necessary tight coupling between database and textual content.
</p>
      <p>
The adjacent screenshot shows the principle. Neil is in the process of creating an extensive gazetter of the main locations where property is for sale. Location detail pages are supported by integrated relevant content retrieved from the database.
</p>
      <p>
By developing further the "content discovery" solution engineered for Ginkgo Projects, I was able to set up a system so that all Neil has to do is to create a subdirectory in the gazetteer filesystem and populate it with XML source files plus the associated graphics. The discovered content  is automatically integrated into the site navigation.</p>
    </div>
<!--begin footer-->
    <div class="clear"></div>
    <div id="footer"><a href="/">home</a> | 
			<a href="/etc/about.xml">about us</a> | 
			<a href="/etc/terms.xml">terms &amp; conditions</a><p class="cpyrt">Copyright 2006 G.J. Higgins and N.C. Macfarlane, except for original contributors. All rights reserved.</p></div>
<!--end footer-->
  </body>
</html>
