interactive design 2 - med m/522 - summer 2006
Philip van Allen -
v a n a l l e n @ a r t c e n t e r . e d u
room 227, wed 2:00pm-6:00pm
all materials on this web site © copyright 2005, Philip van Allen
 
week 02b - assignment/data driven overview, concepts, demo

concepts : 


dynamic sites

Dynamic sites typically use two basic technologies to present dynamic content:

  • software in the web pages that retrieves content from the database
  • a database that contains the content

In addition, there are usually two components of a dynamic site to build:

  • the frontend, which is the public site that people use
  • the backend, which is used by the site content editors to manage the content - add, edit, delete



software : 

The software essentially replaces the static content with with code that retrieves the content from the database. Once content is retrieved by the code, it is inserted into the page as specified by the code.

For example, in a static page, you might find the following code:

<TD WIDTH=175 HEIGHT=198 valign="top" BGCOLOR=#DBF3F7 class="smalltext">
Memorial Day Holiday<br>
May 26th, campus closed<br><br>
Sound design lecture<br>
June 10th, room 228<br><br>
Super Studio Presentation<br>
June 26th

</TD>

In a dynamic page, in place of the content, there is a section of code that retrieves the appropriate content. For example:

<TD WIDTH=175 HEIGHT=198 valign="top" BGCOLOR=#DBF3F7 class="smalltext">
<?php echo $row_Recordset1['events']; ?>
</TD>

Usually there are two sets of code in the page. One sets retrieves all of the content and often resides in the head section of the HTML. The other set of code is distributed throughout the document to insert specific parts of the content (as above).

The major languages used for this software include:

  • php, perl, asp (microsoft visual basic), cfm (cold fusion - macromedia), jsp (java)

 

 
database : 

The database is the system that holds all of the content, usually in a series of rows and columns similar to a spreadsheet. The database is composed of a set of files with the content in it, plus a standard way of requesting information from the files. This way of getting information out of the database is called a query language.

Databases can be as simple as a series of simple text files, or as complex as a commerical Oracle relational database that costs hundreds of thousands of dollars. In all cases, there are some basic concepts that are the same.

A database structures its information in the following hierarchy:

  • database - the complete set of information. For example, in a school database that contains student contact information, grades, and class descriptions.
    • table - a collection of one subset of information. There can be several tables within a database. For example, the student contact table in the school database would contain all the student contact information. other tables might also exists such as class roster table, course descriptions table, etc.
      • record - an individual set of information like a row in a spreadsheet. For example, a student record in the student contact information table would contain one student's information. There would be multiple records in the database, each with similar information for individual students.
        • field - the smallest unit of information in the database, like one column in a spreadsheet. For example, the a student contact record would contain the first_name field, last_name field, phone_number field, address field, city field, etc.

This school database might look like this:

  • school database (has tables)
    • class roster table
    • course descriptions table
    • student contact table (has records)
      • Philip van Allen
      • Peter Lunenfeld
      • Brenda Laurel
      • Anne Burdick
      • Lisa Nugent record (has fields)
        • first_name: Lisa
        • last_name: Nugent
        • phone_number: 999.555.1234
        • address: 123 Reverb Street
        • city: Los Angeles

     

student contact table

first_name last_name phone_number address city
Philip van Allen 666.555.5678 9877 Database Ave. Los Angeles
Peter Lunenfeld 333.555.0000 1111 Theory Blvd. Los Angeles
Brenda Laurel 777.555.9887 8463 Research St. Santa Cruz
Anne Burdick 222.555.2366 0101 Visual Ln. Eaglerock
Lisa Nugent 999.555.1234 123 Reverb St. Los Angeles

The major databases used in dynamic web sites include:

  • mySQL, Postgre, Cold Fusion (macromedia), Oracle, SQL Server (microsoft)

 

 
frontend : 

The frontend of a dynamic web site is the part that the users see. It is composed of the pages that are displayed in the website. It is considered to be driven by the backend system.

 

 
backend : 

The database, software, and site maintenance web pages. From a designer's point of view, it's important to understand that building a dynamic site involves designing the frontend as well as the backend of the system. Obviously it's very important that the frontend be well designed. But it's equally important that the backend pages used to add, edit, and delete information from the database have a well functioning interface. The design considerations for the backend are more functional than aesthetic, but still require a lot of thought, espeically in terms of how people work with the information.

This backend system is what makes the site function, and must be highly functional for the people who administer the site. Other issues to consider:

  • security - the backend must be set up so that only authorized people can make changes. Often, different people are assigned different levels of security. E.g. some may only be able to edit records, while others may be able to add and delete.
  • approval process - it is often a good idea to incorporate an approval process into the backend system. In this approach, data can be entered into the database, but only released to the public site when approved by an authorized person.
 
 

 

 

 

all materials on this web site © copyright 2005, Philip van Allen

top