About the Chatham Animal Rescue & Education Web Site
[Back to CARE Web Site]
The CARE Web site was designed and built by Dave Cohen of AlleyCat Software. If you
like the site, and like the maintainability features discussed
in this document, you can contact me to help with the development
of your Web site at:
The CARE Web site was built to advertise CARE's services, including
providing public education on pet guardianship and offering animals
for adoption from their foster home network. The main goals were:
Ability to quickly add data, such as available animals
or upcoming events, so information presented would be kept up to date.
Easy maintenance, so any moderately adept computer user could
update data, such as adding a new animal or event.
Clean design, so users can navigate the site without difficulty.
Form-based submissions so users can direct requests for adoptions,
information, or membership.
Fast performance, so users do not get frustrated waiting for pages to
load.
Platform-independent architecture, so as not to limit Web host used or
Web browsers.
Efficient Web page code to prevent redundant changes across multiple
pages.
Consistent interface to enhance user experience.
One overriding concern is that non-technical people may need to maintain
the site. These individuals will likely not be able to modify complex HTML
or work with database management systems. Thus, to avoid disruption of the
site, it must be as easy as possible for moderately experienced
computer users to keep the information up to date.
Most of the Web that changes over time is generated dynamically, on request,
based on text and image files. This eliminates the need to modify HTML to add
an animal, event, etc. Thus, to add a new animal available for adoption,
the Web administrator needs to only:
Add the animal information to a text file.
Upload the animal's image file.
That's it! The Web site uses CGI programs to read the files and generate
the pages based on the request. Thus, when a user requests to see adoptable
dogs, the Web site:
Reads the file containing adoptable animal, extracting all of the dogs.
Generates the Web page displaying the adoptable dogs' information and pictures.
It also automatically creates hyperlinks where appropriate.
The Web site uses the following files to dynamically generate Web pages:
Adoptable animals: A text file that contains information on dogs and cats
available for adoption.
Animal images: JPG image files of animals, kept in a directory on the Web site.
Events: A text file that contains information on CARE events.
Lost and found animals: A text file that contains information on lost and
found pets.
Thank yous: A text file containing a list of individuals and companies that CARE
wishes to pay tribute to.
Links: A text file containing a list of animal-related Web page links, such
as breed rescue groups or
animal health.
Happy endings: A text file containing a list of animal rescue-related
success stories.
Email addresses: A text file associating one or more email addresses for
each type of form that is sent.
Thus, to add an upcoming event, just modify the events text file. The next time
the Upcoming Events page is requested by a user, the new event will be included.
Similarly, to add a new link, just modify the links text file. The next time
the Favorite Links page is requested by a user, the new event will be included.
The email text file is a little different, in that it associates one or more email
addresses with specific forms. Thus, the administrator can specify one or more
email addresses to receive adoption requests, one or more email addresses to
receive membership applications, one or more email addresses to receive
general inquiries, etc.
As discussed in the prior section, the text file-based administration makes
it easy for any moderately knowledgeable computer user to update the site.
All they need to be able to do is:
Edit plain text files, such as with Windows Notepad or Wordpad.
Upload image files to the Web site, for animal pictures.
To illustrate the simple text data files, below are a couple of entries used
in the adoptable animals file:
Type: Dog
Thumbnail: care_natasha_small.jpg
Picture: care_natasha.jpg
Name: Natasha
Breed: Spitz Mix
Sex: Female
Weight: 35 lbs adult wgt
Born: Oct 2000
Color: White
Other: Natasha is an extremely affectionate pup full of fun and play...
Type: dog
Thumbnail: care_max_small.jpg
Picture: care_max.jpg
Name: Max
Breed: Lab/Terrier Mix
Sex: Male
Weight: 35lbs adult wgt
Born: July 2000
Color: Black
Other: Adorable little boy with big black eyes and a very happy smile...
As you can see, the data fields are labeled, and the contents free-form.
To add an entry, just cut and paste the block of data for one entry, and change
it for the new entry.
An alternative would be to maintain the data in a database, such as Microsoft
Access. The drawbacks of this approach are:
All fields must be defined beforehand, or data modified to reflect the
addition of additional items. In the text file approach, the new data item
can just be added to new animals.
Adding data would require administrators to either use custom forms built
for the task, or learn how to use the database management system's
interactive facility.
Backing up a database can be difficult, while backing up a text file
requires a simple copy.
Corrupt data requires someone knowledgeable to restore the database to
a prior, good state. In a text file, corrupt data can just be edited.
Choice of a database would require platform specific choice, limiting
Web hosting options. For most administrators, this would mean the Web host
would have to be Microsoft Windows NT, since the more popular user databases
are Microsoft Access and SQL Server.
In short, storing the data in a database management system would require
someone to fill a database administrator role, at least part time. Should
the person become unavailable, then there would be a disruption in keeping
data up to date. In contrast, any computer should be able to edit a text file.
The Web site provides the following forms for users to submit requests and
inquiries:
Adoption form for requesting animal adoptions.
Membership form for joining CARE.
Lost pet form for submitting information on lost pets.
Found pet form for submitting information on found pets.
Email form for submitting requests or inquiries about adoptions, donations,
events, etc.
The submitted forms are routed to the appropriate individuals, as
assigned in the email data file described earlier. In addition, form
field information is filled in when possible, such as the current date and
the name of the animal the user wants to adopt.
Animal pictures are initially presented in 'thumbnail' size -
large enough to identify the animal's features but small enough to
load quickly. The thumbnail pictures are generally less that 6kb
each in size. The thumbnail pictures are hyperlinked to full sized
pictures, so the user can click on a thumbnail to get a large,
detailed image.
Pages of animals displayed are broken up into groups of 10
animals at a time. The user can navigate forward or backward
among the pages of pictures.
Form input is verified using JavaScript in the Web page,
reducing the need for multiple server roundtrips when required
fields are omitted.
In general, page size is limited to a reasonable amount of
information.
While a number of Web technologies are available for allowing Web sites
to dynamically process requests and generate pages, the most popular ones
are:
Common Gateway Interface (CGI) scripts, such as Perl programs.
Active Server Pages (ASP), which is essentially server-side Web page scripting.
To allow the widest selection of Web hosts, and thus likely to incur the lowest
costs, the platform-independent CGI approach was taken. CGI Perl programs will
run on platforms including Microsoft Windows 95/98/NT, Unix, and Linux. Just
about all Web servers, including Microsoft Internet Information Server and Apache,
support CGI. In contrast, ASP runs only on Microsoft Windows, with Microsoft
Internet Information Server (or Personal Web Server, in a test environment).
There are some third party products to support ASP on other platforms and with
other Web servers, but cost and compatibility are big issues.
The drawback to CGI is that each CGI request requires a new process to
be started to run the program. This is an issue with high traffic sites,
and ASP and Java applets can reduce resource requirements by using threads.
However, the CARE Web site does not anticipate ever needing to support
high simultaneous user counts.
Some Web sites built with page development tools consist of redundant code, such as
the HTML needed to render menus being embedded in each page. While this is not
an issue as long as the site is managed with the development environment, it can
cause maintenance difficulties if the development environment is dropped and the
pages are managed individually.
The CARE Web site was developed mainly by hand, without the use of Web site development
tools. HTML and JavaScript code that is used across multiple pages is maintained
in include files. Server-side include statements (SSI) are used to include the
common code in each Web page. Thus, on the CARE site, each Web page has a special
SSI statement to include the file that contains the HTML to display the menu.
The tradeoff with include files is that the page must be examined and expanded
by the Web server before it is sent to the user. Since include file expansion
is a mature Web site feature, and thus optimized as much as possible, the performance
cost is much less than the gains in Web page maintainability.
The CARE Web site uses cascading style sheets (CSS) to impose a common look-and-feel
to the user interface. This ensures consistent font types, sizes, colors, etc.
Even dynamically generated Web pages use CSS styles.
The use of CSS also allows the administrator to affect the appearance of all pages
on the Web site by modifying a single CSS file.
