1
The Effects of
Changing a Static Website
to a Dynamic Format
A Case Study by Candice Ossowski
Explain what my project was – Redesigning a static website for a small local computer company, making the new site dynamic
2
OVERVIEW
Key Terms
Research Method/Questions
Former System
Data Collection
Themes
The Process/New System
Theory
Outcomes
3
3
KEY TERMS
Static
Dynamic
Static - content of the site is fixed when it is initially produced; written in mostly HTML; not personalized
- Explain how it works
Dynamic – content is generated upon the page load; usually database-driven - Briefly go over how it works but a more detailed description will come later in the database query flowchart
DHTML is not truly dynamic. It has a dynamic look, not dynamic content. Kristin Antelman - “true dynamic content is created only through serverside processing.”
4
RESEARCH METHOD
Qualitative Research
Case Study
Bounded System
Qualitative Research – issue needed to be explored; in-depth exploration (important for e-commerce); variables, themes, and theories needed to be discovered
Case Study – narrow perspective to analyze specific details; topic studied in great depth
Bounded System – bounded by type of website (business for profit), type of business (computers), and time frame of January 2004 – May 2004
5
5
MAIN RESEARCH QUESTION
What effects does a change from a static
format to dynamic one have on a website?
Can you put an image here - perhaps screen shots from a static and a dynamic web site?
6
ISSUE SUBQUESTIONS
What actions must be taken to implement the change?
How does this change affect each
human-centered design characteristic as it relates to the website?
What improvements to maintainability will result?
How will the change make the website more or less appealing to users?
Explain how these questions relate to your actual study
Issue Subquestions - written to address the major concerns and perplexities to be resolved, the ‘issue’ of a study
7
7
DATA COLLECTION MATRIX
X X
Programming Language References
X
Scholarly Journal Articles
X Other Studies X X Other Websites X X X Former Website
(Web pages and source code)
X X
X
“Designing Accessible Web Pages”
(Presentation by Sharon Trerise)
X X
Non-Customers (Unfamiliar with Website)
X X
Customers (Website Users)
X X
Business Owner (Joseph Paladino) Website s Document s Observation s Interview s Information Source
Need to fix overlap in “Former Website” box. It would help if you put actual numbers rather than x’s.
Studies done in a natural setting
Explain each information source and what was done
Explain what was asked in the interviews – What websites they like, why. Evaluate the current website. Suggestions for the new website.
8
Former Website
Good use of imagery - put on earlier slde
This is what was asked of the participants during the interviews (go through the old website)
Note some of the responses they gave (will lead into the themes) Go to the site and show how some of the information is outdated. Always the same upon page load unless it has been updated Not personalized
9
9
Former System
This is what I observed from the business owner, maintaining the former website
Go to the site and log in to show how the owner would normally update the website
10
THEMES
Maintainability
Interactivity
Accessibility
Security
Themes – concepts that have emerged from the interviews and observations Maintainability – business owner would not update the site because it was too difficult to maintain
Interactivity – Participants were asked to name some websites they liked and why. Interactivity kept coming up
Accessibility – Some of the older participants had trouble reading the text because it was too small for them and the ‘make text bigger’ feature did not work on the browser
Security – When asked what was important and why they liked certain
11
11
NEW HOSTING PLAN
ColdFusion 5.0 Server
Access 2000 Database
Perl and CGI
ASP (Active Server Pages)
Secure Socket Layer (SSL)
E-mail Accounts (up to 150)
$4.95/month
Be careful to also explain this from a laypersons viewpoint. For instance, what does a CF server provide that others don’t; why use Perl, CGI, etc.
The Process – First I had to subscribe to a hosting plan Explain what each of these are.
12
THE PROCESS
Create Database Tables
Create Forms (Administrators)
Create End-User Interface (Customers) Add new sections as needed Excellent The Process
1. Create database tables containing the information that would be dynamic (ex: products, services, customers)
2. Create forms for the administrators to add/edit information in the database 3. Create the end-user interface for the customer
As a new section needed to be added, the process started over again. (For example, we decided to make the content on the website’s ‘Links’ page dynamic so we needed to add a new table, create the administrator’s form,
13
13
New Website
Also put on earlier slide (as well as here)
Introduce the new website and point out some of the basic features but do not go into detail yet.
14
MAINTAINABILITY
Admin System
Go to new site and show how the administrators will be maintaining the information. (Show how to add/edit information)
15
15
Excellent! Make sure you carefully step through each item on the flowchart. Ideally you could introduce each component (on the slide) one at a time and go through each as it is added.
After showing the audience the administrator interface, step back to go over how a dynamic website works (process is transparent to the user)
16
INTERACTIVITY
Custom Built PC Form
This is also a good place to mention items from your literature review and theory and show how you applied them here.
Show some of the website’s interactive features by going through the Custom Built PC form, where users can specify their preferences and have a price quote sent to them based on their specifications.
17
17
ACCESSIBILITY
Home Page with Large Text
At the same time justify changes based on theory and literature. You want to make it clear that you are applying theory in the project.
Go to the site and explain how I added accessibility -Change text size
-No color coding
-ALT attributes for images -Tab order
-Meaningful links
-Simple layout (cognitive disorders) -No text as graphics
18
SECURITY
Customers Table
Go over some of the features of the website that make it secure: One-way encryption of passwords in the database
Bit to tell if the user is an administrator SSL (explain this)
Parameter Manipulation (explain this) Cookies do not hold sensitive information
19 19
HUMAN-CENTERED DESIGN
Coherence
Inclusiveness
Malleability
Engagement
Ownership
Responsiveness
Purpose
Panoramic
Transcendence
Excellent!! It would be better to have these items come up one at a time. Go through the new website and show how each characteristic is met (I have examples for each one)
20
THE GRID SYSTEM
Forms follow the grid system to add coherence
In A Modular Grid System in Graphic Design, edited by Paul Rand, it is stated that “the composite grid indicates… location of horizontal and vertical rules and axes.”
In his Notes on Graphic Design and Visual Communication, Gregg Berryman states “Gestalt data reveals that humans tend to prefer organized visual and verbal information. Grid systems allow the designer to satisfy viewer groups with respect to equilibrium, similarity, and continuation.”
21
21
QUESTIONS ANSWERED
What actions must be taken to implement the change?
How does this change affect each
human-centered design characteristic as it relates to the website?
What improvements to maintainability will result?
How will the change make the website more or less appealing to users?
1. Briefly go over the process again
2. Coherence - Grid format of the front end is easy to navigate, same medium opposed to using the phone or e-mail to contact the company which could cause confusion (customer knows what is going to be asked of them) Inclusiveness –
Malleability – dynamic site adds to ability to shape to users’ needs Engagement - dynamic site can add personalization, inviting user to participate
Ownership – users can feel like they own parts of the system with a dynamic site
Responsiveness – a dynamic site helps to responds to the needs of the individual by allowing them to make choices
Purpose - dynamic site is not required but may make the experience easier Panoramic – dynamic site is not required
Transcendence – dynamic site is not required
3. Administrators have to maintain the database by using the interfaces I created, but no longer have to deal with HTML
4. Interviewees seem to be very pleased with the new website (go into more details)
22
ASSERTIONS
Make a website dynamic if:
Content must change often
Online services are useful
Database will be maintained
The costs:
Subscription plan (or own server)
Development
Maintenance of code and site enhancements
Time
Relate these assertions to your experiences in designing the site. You may want to add that ColdFusion is not available everywhere and this is an issue that needs to be addressed up front. I can’t help wondering how expensive CF is and how widely it’s distributed (this might be available at the Macromedia site)
Having a dynamic website has its advantages and disadvantages. A webmaster is needed - person whose job is to maintain a website;
commonly responsible for “soliciting content, ensuring stylistic conformity, and handling other coordination tasks” (Antelman, 1999)
23
23
FURTHER DEVELOPMENTS
Website Improvements
Subscribe to better plan
Learn different languages
Further Research
Study different types of websites
Study effects long-term
Also, diversify and see if the issues are the same with OTHER database software (such as Open Code - free software) other than Cold Fusion. Better plan – more expensive; will allow for CFFILE (explain this)
The server supports ASP which I might be able to use to export files (not sure if it’s possible). There also may be a way to do it in javascript. I’m currently working on a more powerful search engine.
Study different types of websites – not computer-related, not a business (organization), or things that cannot be ordered online (maybe building a dynamic website is not worth the time and cost)
24
REFERENCES
Static and Dynamic images taken from
http://www.lights.com/talks/2000.online/dynamic.gif
Antelman, Kristen. 1999. “Getting out of the HTML business: The database-driven Web site solution.” Information Technology and Libraries, 18 (4): 176-182.
Berryman, Greg. (1990). Notes on Graphic Design and Visual Communication. Crisp Pubns.
Cooley, Mike. (2000). Information Design: Human-Centered Design. Cambridge, Massachusetts: The MIT Press.
Rand, Paul, ed. (n.d.). A Modular Grid System in Graphic Design. Westinghouse Printing Division Catalog Design.
