AJAX Website Applications

When a new technology improves how the web works, we get really excited. Technology improvements rarely have discernable effects on how a website is used. In the end, what difference does it make which database or programming language is behind the scenes? Programmers get jazzed by snappier database performance, but as long a site works, normal people don't really care. But sometimes a new technology causes us to stand up and take notice.

We just completed a project using such a new technology. The technology is called AJAX. Actually, it's not really a new technology at all. Rather, it is a way of combining technologies that been around for years (mostly JavaScript, CSS, and XML if that interests you). To a web developer's joy, the fact that AJAX does not use new technology means it works dependably in all but the oldest browsers - that's music to our ears.



I'm not going to bore you with details of how AJAX works. Instead, let me show how we used it in one of our new sites. PlanUSA (www.www.planusa.org/maps) is an organization that provides sustainable development programs for children in poverty. Go ahead and click on the link above, then the 'Visit Now' icon so you can follow my description - you have to see it to get it.

The map that opens in a pop-up window allows you to see the village of Nyalakot with an overlay of various projects, people and scenes that you can control from a 'legend' on the left. Click any of the four square icons on the right to "show" or "hide" video links on the map for an idea of how AJAX can load new layers of information without requiring a page refresh. Using this tool, you can isolate on the map only the videos you are interested in. As simple as this may sound, the ability to add content to a page without refreshing is a major big deal. Let me explain.

You've probably experienced other websites where a page's information is expanded based on a click or mouse-over without the page re-loading. In the past however, such effects were achieved by preloading all the information on the page during the initial page download. The content was simply hidden until a click or mouse-over triggering its display. It was there all along. The difference on PlanUSA's Village Visit is that, using AJAX, the extra layers were actually looked up from the database and added to the page on the fly, without reloading the entire page.

When select an icon from the group, the map dynamically adjusts itself to display items according to your choice, again without refreshing.   next >