ecommerce technologies design & development for the web mis 4453 -- spring 2004 instructors:...
TRANSCRIPT
eCommerce Technologies
Design & Development for the Web
MIS 4453 -- Spring 2004
Instructors:Kelly Fish, Ph.D.John Seydel, Ph.D.
Student Objectives
Discuss basic guidelines for web page and website designSummarize the primary XHTML elements involved in web page developmentOrganize and reorganize websites using FrontPage
Demonstrate excellence in understanding course concepts (so far) on Quiz #1
Web Design (not “Development”)
Note “web” refers here to site and/or pageBasic principles to consider Nonlinear presentation Limited page length Simple, obvious navigation Small graphics files Visual appeal
Web Development
Recall the traditional SDLC (systems development life cycle): Start by identifying user requirements Design a solution Construct, test, and implement solution Monitor and maintain
Web design (actually, development) model is based upon the SDLC
Web Development Model
Phase 2:Design and
Development
Phase 3:Web Site Testing
Phase 1:Front- and Back-End
Analyses
Phase 1: Front/Back End Analyses
Needs assessment What kind of business (strategy, revenue model, . . .) Target customers; consider book retailer versus toy store
(ASU . . . ?)Evaluation of hardware/software (and other aspects of resource system)
Users: bandwidth, user agents, . . . Determine tools needed to build/provide website and deliver
product or service involved Imaging and editing software (Flash?) Development environment (e.g., VStudio) Trial versions available, but beware
Consider technology trends; recall Moore’s LawCost/benefit analysis
Costs: hardware/software, strategy development, web development/outsourcing, site management/maintenance
Benefits: faster/better service, customer loyalty, better CRM, flexibility, lower inventory, . . .
Phase 2: Design and Development
Home and content pagesText fonts, styles and colorHorizontal lines and tablesHyperlinks and navigation buttonseMail linksFrames and formsGraphic arts and images
Phase 3: Web Site Testing
Local-host testingTest on developer’s
computer
Server-side testingTest between server and
developer's computer
Client-side testingTest with various
configurations and browsers at different places and times
FrontPage: A Web Development and Management Tool
FrontPage makes web page creation easy WYSIWYG editing Design and build at same time
But professional developers still need to be able to work at the HTML levelProbably most helpful, however, is the help FrontPage provides with site managementLet’s go through an example . . .
Some XHTML
Go behind the scenes at Suzy Student’s websiteIn FrontPage, Open the start page (default.htm) Click on HTML tab at bottom of page
Look at the tags/elements involved At first, may be overwhelming Not really all that bad, however
XHTML Elements
A web document is a collection of XHTML elementsNote that XHTML is essentially HTML
XML compliant Reformulation of HTML, but with stricter rules
Two types of elements Standard Empty
Each element Has
Opening tag and closing tag is standard Self closing tag if otherwise
May have attributes specified
Also: XHTML entities
Some Important XHTML Tags & Elements
htmlbodyheadtitlemetah1pimgaemstrongstyle
The Document Hierarchy
Root element <html> contains two other elements
Head <head> element Body <body> element
The head element contains Title Script Meta Style
The body element contains the document content
Elements Structural Descriptive
Content
Organizing/Reorganizing Your Site
Specifications All graphics and similar object files should be in images
folder All web pages for each exercise should be in individual
respective folders Only one web page should be in root folder
If needed, create folders Procedure
Click on root web, then: File | New | Folder Name appropriately
Do this for Exercise 1 (personal) and Exercise 2 (conference)
Drag/upload files to respective foldersCreate start page for each folder other than imagesCreate homepage for root web
New page Name, etc Links to exercises
Summary of Objectives
Discuss basic guidelines for web page and website designSummarize the primary XHTML elements involved in web page developmentOrganize and reorganize websites using FrontPage
For Next Time
Note: should be checking email dailyRe-read Chapter 2Reorganize website Create homepage Put exercises into folder, each with default
page and appropriate folder title (e.g., Conference) Exercise 1 Exercise 2
Look at elements/tags used in Exercise 2 and read about them in Appendix
Due 1/27 (work on it) and 1/29 (complete it)Review eCommerce models (e.g., Laudon & Laudon text)
Appendix
Website Organization
default.htm (home page for website)\images
LogoASU.gif (ASU logo)bkgdcoba.gif (background logo)working_.gif (man working image)
\exercises\conference
index.htmschedule.htmregistration.htm
\personalmyhomepage.htmlmyspreadsheet.htmlmypresentation.html