dynamic web sites deco 3001 tutorial 9 – cms presented by ji soo yoon 21 may 2004 slides adopted...

56
Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from http://www.ksu.edu/dia/projects/cm/ , http://webdesign.about.com/library/weekly/aa021802a.htm , http://aifia.org/files/cms0303.ppt , http://www.psu.edu/webconference/Web2003/Web2003Materials/C msJohansen.ppt , http://faculty.maxwell.syr.edu/jpgant/PPAEgov_Webdesign.ppt

Post on 19-Dec-2015

213 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Dynamic Web SitesDECO 3001 Tutorial 9 – CMS

Presented by Ji Soo Yoon21 May 2004

Slides adopted from http://www.ksu.edu/dia/projects/cm/, http://webdesign.about.com/library/weekly/aa021802a.htm, http://aifia.org/files/cms0303.ppt, http://www.psu.edu/webconference/Web2003/Web2003Materials/CmsJohansen.ppt, http://faculty.maxwell.syr.edu/jpgant/PPAEgov_Webdesign.ppt

Page 2: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Consider Business as Usual…

Pagen

Page3

Page2

Page1

HomePage

Templates

Static HTML - Tidy

Page 3: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Adding more pages…

Page1

Page3

Page2

Page1

HomePage

Pagen

Pagen

Pagen

Pagen

Pagen

Pagen

Pagen

Pagen Page

n

Pagen

Pagen

Static HTML - SpaghettiTemplates

Page 4: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Even more pages…

Page1

Page3

Page2

Page1

HomePage

Pagen

Pagen

Pagen

Pagen

Pagen

Pagen

Pagen

Pagen Page

n

Pagen

Pagen

Page1

Page3

Page2

Page1

Pagen

Pagen

Pagen

Pagen

Pagen

Pagen Page

n

Pagen

Pagen

Static HTML - HeartburnTemplates

Page 5: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Solution?

Page 6: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

Our story starts with a database…

Page 7: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

Our story starts with a database…

Welcome, welcome, blahblah, blah, blah, blah, blahblah, blah, blah, blah, blahblah, blah, blah, blah, blahblah, blah, blah, blah, blahblah, blah, blah, blah, blah

…to which we add content

Page 8: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

Our story starts with a database…

Department of Something…

Welcome, welcome, blahblah, blah, blah, blah, blahblah, blah, blah, blah, blahblah, blah, blah, blah, blahblah, blah, blah, blah, blahblah, blah, blah, blah, blah

…to which we add content…and more content (including design elements)

Page 9: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

Our story starts with a database…

• This Way• That Way

• Home

Department of Something…

Welcome, welcome, blahblah, blah, blah, blah, blahblah, blah, blah, blah, blahblah, blah, blah, blah, blahblah, blah, blah, blah, blahblah, blah, blah, blah, blah

…to which we add content…and more content (including design elements)

…and (maybe) navigation tools

Page 10: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

InputForms

Use forms to enter and edit the storyinto the database.

Page 11: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

Page 12: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

• This Way• That Way

• Home

Department of Something…

Welcome, welcome, blahblah, blah, blah, blah, blahblah, blah, blah, blah, blahblah, blah, blah, blah, blahblah, blah, blah, blah, blahblah, blah, blah, blah, blah

Page 13: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

ADA

| This Way | That WayHome

Department of Something…

Welcome, welcome, blah blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah , blah, blah, blah, blah, blah

Page 14: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

ADA

Print

Department of Something…

Welcome, welcome, blah blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah, blah , blah, blah, blah, blah, blah

Page 15: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

ADA

Print

WML

PDAProprietary

RSS-XML

Content

Page 16: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

ADA

Print

WML

PDAProprietary

RSS-XML

You can format the samecontent for output in manydisplay formats and dataprotocols.

Content

Page 17: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

ADA

Print

WML

PDAProprietary

RSS-XML

Content

1. Input Once…

…Output Many Formats

Page 18: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

ADA

Print

WML

PDAProprietary

RSS-XML

Content

1a. Correct Once…

…Correct Them All

Page 19: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

ADA

Print

WML

PDAProprietary

RSS-XML

Content

Separate Content from Design

Page 20: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

ADA

Print

WML

PDAProprietary

RSS-XML

Template&

CSS

Template&

CSS

Template&

CSS

WMLTemplate

TemplateHTML

ClippingCSS

TemplateXMLCSS

Content

DesignSeparate Content from Design

Page 21: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

ADA

Print

WML

PDAProprietary

RSS-XML

Content Design

DesignDatabase

Template

Separate Content from Design

Page 22: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

ADA

Print

WML

PDAProprietary

RSS-XML

Content Design

DesignDatabase

Template

Separate Content… …from Design

Page 23: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

ADA

Print

WML

PDAProprietary

RSS-XML

Content Design

DesignDatabase

Template

Separate Content… CSS

…from Design

Page 24: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

ADA

Print

WML

PDAProprietary

RSS-XML

Content Design

DesignDatabase

Template

Separate Content… CSS

…from Design

Site-Wide Changes

Page 25: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

ADA

Print

WML

PDAProprietary

RSS-XML

Content Design

DesignDatabase

Template

Separate Content…

DesignForm

CSS

…from Design

Site-Wide Changes

Page 26: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

ADA

Print

WML

PDAProprietary

RSS-XML

Design

DesignDatabase

Template

InputForms

InputForms

InputForms

InputForms Content

DesignForms

Page 27: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

ADA

Print

WML

PDAProprietary

RSS-XML

Design

DesignDatabase

Template

InputForms

InputForms

InputForms

InputForms Content

Expert

Staff

Faculty

User-drivenFAQ

Syndicated NewsDesignForms

Page 28: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Content Management Systems

ContentDatabase

HTML

InputForms

ADA

Print

WML

PDAProprietary

RSS-XML

Design

DesignDatabase

Template

2. Delegate Content Creation

You work on SITE DESIGN& Management

InputForms

InputForms

InputForms

InputForms Content

Expert

Staff

Faculty

User-drivenFAQ

Syndicated NewsDesignForms

Page 29: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

In summary…

Page 30: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Benefits of CMS

“Single source” of content

Reusability of content Versioning Easier maintenance Consistency Easier authoring and

publishing

Page 31: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

CMS - Features

Data Management Web Life-Cycle Management Web Templating Personalisation Syndication Digital Rights Management

Page 32: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Data Management

Primary function of CMS Manage content on web sites Most CMSs use XML to tag the

content and database connectivity

Page 33: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Web Life-Cycle Management

Ability for content managers to approve and validate content prior to publishing on the web

Content managers can also control when and where the content goes online and removed from the web

Page 34: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Web Templating

Web pages showing contents created from templates

Separating content design and visual presentation of content

Page 35: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Personalisation

Easier to create personalised pages for web site visitors once content is stored into CMS

“Skinning” may be used for this purpose

Page 36: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Syndication

Allows sharing of web content with other corporations – made possible by separating content from design

Most popular: RSS (Really Simple Syndication) and XML

Page 37: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Digital Rights Management

CMSs provide the background for managing the rights to your content

Page 38: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Resources

Books Content Management Bible

http://www.amazon.com/exec/obidos/ASIN/076454862X/theasilomarin-20

Managing Enterprise Content http://www.managingenterprisecontent.com/

On the Web CMSWatch http://www.cmswatch.com/ Metadata & Taxonomies for a More Flexible Information Architecture

http://www.asis.org/Conferences/Summit2002/IA_Summit_031602.ppt Smarter Content Publishing

http://www.digital-web.com/features/feature_2002-08.shtml Ontology Development and Relationship Modeling for Enterprises and

Enterprise Websites, Brett Lider (IA Summit 2003) Email Lists

IA CMS http://groups.yahoo.com/group/ia-cms/ CMS List http://www.cms-list.org/

Page 39: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Appendix:Just For Your Information

Page 40: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Web Site Construction and Evaluation Process

Page 41: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Who is Involved in Web Site Design?

Page 42: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Key Questions for Planning Site

What is the mission of your organization? How will creating a Web site support your

mission? What are your immediate goals for the site? What are your long-term goals for the site? What Web-related strategies will you use to

achieve those goals? How will you measure the success of your

site?

Page 43: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

What Are Your Goals?

Make a short statement about your goals including strategies for designing the Web site length of design, construction and evaluation

periods measures used to evaluate the success of plans for long-term editorial management and

technical maintenance Remember

on-going dynamic process

Page 44: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Know Your Audience

Identify potential visitors of your Web site site must meet their needs and expectations well designed site should meet a range of skills

and interests Users include

Web surfers Novice and occasional users Expert and frequent users International users Physically challenged

Page 45: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Additional Steps

Design Critiques Identify other Web

sites to use as models

See design from the user’s point of view

Each team member brings a list of favorite sites and shares with group

Content Inventory Assess the content

needed for site Hardest and most

time consuming part of project

Start early

Page 46: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Site Development Process

Site definition and planning Information architecture Site design Site construction Site marketing Tracking, evaluation and maintenance

Page 47: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Site Production Checklist

Production issues Technology Web server support Budgeting

Page 48: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Production Issues

What are the purpose and goals for the site? Who is the target audience for the site, and what do

they want? Will your site production team be composed of in-

house people, outside contractor, or a mix of the two?

Who will manage the process? Who are your primary content experts? Who will be the liaison to any outside contractors? Who will function as the Webmaster?

Page 49: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Technology

What browsers and operating systems should your site support?

What is the network bandwidth of average site visitors?

What advanced features will be used? How will readers reach the support

personnel? How will you handle database support? What type of A/V content will be used?

Page 50: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

Additional Factors

Web Server Support In-house or outsource Domain name Site traffic constraints 24/7 support &

maintenance Stats on use Database coordination

Budgeting Salaries and benefits HW/SW Staff training Outsourcing fees Ongoing support

Webmaster Server and technical Database

New content and updates

Page 51: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

STEP 2: Information Architecture

Focus - Detail the content and organization of the Web site Inventory all existing content Describe what new content is required Define the organizational structure of the site

Build a small prototype Used to test site navigation and user interface See how site looks and how navigation interface

supports information design

Page 52: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

STEP 3: Site Design

Create and approve page design and overall design standards

Commission illustrations, photography and graphics

Develop content Conduct programming, database

design, and data entry

Page 53: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

STEP 4: Site Construction

Web site is filled with content Create database and programming

components Beta test the site

Page 54: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

STEP 5: Site Marketing

Site should be integral part of marketing campaign and corporate communications programs.

URL should appear on every piece of correspondence

Page 55: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

STEP 6: Tracking, Evaluation, and Maintenance

Record information about site visitors to determine how many visitors over a given time how many pages were requested for viewing appeal of pages and their format

Maintenance Update site Develop new content

Page 56: Dynamic Web Sites DECO 3001 Tutorial 9 – CMS Presented by Ji Soo Yoon 21 May 2004 Slides adopted from

The End.