Web Site Design Blog

Tag: AJAX
September 26, 2009

Nature Song 2009

naturesong.net was redesigned in 2009 to address some issues with the shopping cart, integrate a reseller login so resellers can log in and purchase CDs at a discount and NET 30 payment terms and generally update the look and feel of the site.

The shopping cart and content management system is completely custom. I decided to create a custom system for this site because I had a clear vision of how it should work. The owner, Bill Leverick, wanted to be able to easily update the CDs available for sale. I knew there were off-the-shelf shopping carts and content management systems I could probably have used or customized. Because these products had an ‘audio sample’ component to them that we needed to attach and be able to associate audio files with multiple products, I decided to build it myself. The site integrates PayPal Website Payments Pro for it’s merchant service provider and the UPS API to get shipping information from UPS in real-time for orders with quantities above 2 CDs. The AJAX overlay for each product uses the jQuery framework to handle the JavaScript effects.

In retrospect I am happy with my decision to go completely custom with this site. It allowed me to develop exactly what the client was looking for without excess functionality that he didn’t want or need and might have confused the process. It also allowed me to address his fine-tuning requests quickly and not have to compromise because of an off-the-shelf software limitation.

Here is a quote from the owner:

Ross,
I just logged on to check out the new NatureSong site that you activated today. I am very pleased not only with the graphics, but with the built in ability for me to make necessary changes to the products. You have done a great job and I would heartily recommend you to anyone. Please feel free to use this site and my other web site, Cape Cod & New England Gift Show as examples of your work.

Thanks,

Bill Leverick
NatureSong.net

View Project

September 7, 2009

Loading data from the server via AJAX is an efficient and increasingly popular way to present content from a user request. After starting out by writing my own AJAX functions I started using the prototype framework. I am currently using the jquery load function as jquery is a very powerful and easy to use framework that can handle the nuts and bolts of a variety of other javascript functions and effects.

Part of implementing an AJAX request is to have a message displayed while the request is being made to the server to let the user know exactly what is going on and give your application a more professional and responsive appearance. In the past I have found myself spending too much time hand creating an animated loading indicator that spins with just the right colors and size. Fortunately someone out there has had the same experience and chose to share their solution. Here is a very handy tool to use to automatically generate a professional AJAX loading indicator GIF animation. ajaxload.info lets you define the foreground and background color and generates a perfect, professional AJAX load indicator every time!

Load indicator generated at ajaxload.info