Dynamic Web Sites Chris North cs3724: HCI

Presentations matt ketner, sam altman, mike gordon Vote: UI Hall of Fame/Shame?

Next Apr 4: Proj 2, final implementation Presentations: UI critique or HW2 results Next Tues: karen molye, steve kovalak Next Thurs: demos?

Review What are independent variables? The stuff that you vary: UI What are dependent variables? The stuff that you measure: user perf time How do you analyze the results? Stats: t-test, anova 95%, 99% < nothing: redesign

GUIs vs WUIs Standard GUIs E.g. Visual Basic, Java Single user, location Portability is less critical Power dynamics Targeted audience Webpage UIs broad user class Supports low power clients Avoids installation, updates, backups Enables One time users, quick, simple Lightweight Collect info from users, permission unneseary

WUIs Client (Browser) Server (Web server) URL request html page Server side scripting Dynamically generated pages Client side scripting Interactive pages why? faster feedback Saves server animation why? customized pages for users Security Business logic Data-driven, data intensive collaborative

WUI Technologies Client side: Javascript VBscript (MS) DHTML Html, forms, components (java applets, activeX) Server side: CGI: perl, shell scripts … ASP (MS) Cold fusion Jsp, Php Servlets: java, activeX

Client side Javascript: click here

Document Object Model <input type=“button” name=“mybutton” value=“OK” onclick=“document.myform.mybutton.color=red”> document myform mybutton … …

Server Side Prints an html file (+header) to stdout: print “Content-type: text/html \n” print “\n” print “ ” print “The time is “, time( ) print “ ” Client browser receives: The time is 2:00pm, March 28, 2002

Processing Forms GET, querystring Myscript.exe reads data from URL string POST Myscript.exe reads data from stdin

Example Books.exeCart.exePurchase.exe Shows books list Add to cart View cart button Displays cart contents Delete items Purchase button Charges credit card Displays ‘thankyou’ Link back to books Amazon.com server

Problems Many simultaneous users No state data maintained Client not in sync with server (e.g. back button) Books.exeCart.exePurchase.exe …

Different than GUI programming! One user (per executable) ‘Global’ state data Client = server Shopping.exe Books window Cart window Purchase window

Problems Myscript.exe starts from scratch each time Each page request is completely independent No state data maintained between requests »Who is the user? »What is his data? »Where is he in the ‘application’? How to maintain state info across page accesses? Pile all state data into hidden form items Cookies Store state data in a database, index by unique user id

ASP Provides ‘session’ awareness Maintains state info for each user Scripts access global storage Visual Basic language Mix code and html output

html + Code New tags and Myscript.asp: The time is Good morning Good afternoon Client receives: The time is 2:00pm Good afternoon

Session Data Global object: session Hello, Client receives: Hello, Chris

Processing form input Global object: request.form Thanks for giving us your name,