The Effects of Changing a Static Website to a Dynamic Format

Transcription

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 1

2 OVERVIEW Key Terms Research Method/Questions Former System Data Collection Themes The Process/New System Theory Outcomes References 2 2

3 KEY TERMS Static Dynamic 3 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. Images taken from 3

4 RESEARCH METHOD Qualitative Research Case Study Bounded System 4 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

5 MAIN RESEARCH QUESTION What effects does a change from a static format to dynamic one have on a website? 5 Can you put an image here - perhaps screen shots from a static and a dynamic web site? 5

6 ISSUE SUBQUESTIONS What actions must be taken to implement the change? How does this change affect each humancentered 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? 6 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 6

7 DATA COLLECTION MATRI Information Source Business Owner (Joseph Paladino) Customers (Website Users) Non-Customers (Unfamiliar with Website) Designing Accessible Web Pages (Presentation by Sharon Trerise) Former Website (Web pages and source code) Other Websites Other Studies Scholarly Journal Articles Programming Language References Interview s Observation s Document s Website s 7 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. 7

8 Former Website 8 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 Also point out the DHTML in the left column 8

9 Former System 9 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 9

10 THEMES Maintainability Interactivity Accessibility Security 10 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 websites, the issue of security kept coming up (Note: security did not apply to the static website) 10

11 NEW HOSTING PLAN ColdFusion 5.0 Server Access 2000 Database Perl and CGI ASP (Active Server Pages) Secure Socket Layer (SSL) Accounts (up to 150) $4.95/month 11 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. Note that it was relatively inexpensive but has some drawbacks 11

12 THE PROCESS Create Database Tables Create Forms (Administrators) Add new sections as needed Create End-User Interface (Customers) 12 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, and then display the links on the page for the customers) Also, if fields need to be added to the table, I had to go through this 3 step process again. 12

13 New Website 13 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. 13

14 MAINTAINABILITY Admin System 14 Go to new site and show how the administrators will be maintaining the information. (Show how to add/edit information) 14

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) 15

16 INTERACTIVITY Custom Built PC Form 16 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. 16

17 ACCESSIBILITY Home Page with Large Text 17 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 17

18 SECURITY Customers Table 18 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 Paypal is the secure method of paying by credit card 18

19 HUMAN-CENTERED DESIGN Coherence Inclusiveness Malleability Engagement Ownership Responsiveness Purpose Panoramic Transcendence 19 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) 19

20 THE GRID SYSTEM 20 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. Go to the website and explain how I used a grid when designing the site and forms. 20

21 QUESTIONS ANSWERED What actions must be taken to implement the change? How does this change affect each humancentered 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? 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 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) 21

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 22 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) Time for the company to put their information in a database that can be used online 22

23 FURTHER DEVELOPMENTS Website Improvements Subscribe to better plan Learn different languages Further Research Study different types of websites Study effects long-term 23 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) Study effects long-term have sales increased because of the website? 23

24 REFERENCES Static and Dynamic images taken from Antelman, Kristen Getting out of the HTML business: The database-driven Web site solution. Information Technology and Libraries, 18 (4): 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. 24 Westinghouse Printing Division Catalog Design. 24