Dynamic Web Sites DECO 3001 Tutorial 9

1
Dynamic Web SitesDECO 3001 Tutorial 9 CMS

• Presented by Ji Soo Yoon
• 21 May 2004
• Slides adopted from http//www.ksu.edu/dia/project
  s/cm/, http//webdesign.about.com/library/weekly/a
  a021802a.htm, http//aifia.org/files/cms0303.ppt,
  http//www.psu.edu/webconference/Web2003/Web2003Ma
  terials/CmsJohansen.ppt, http//faculty.maxwell.sy
  r.edu/jpgant/PPAEgov_Webdesign.ppt

2
Consider Business as Usual
3
Adding more pages
4
Even more pages
5
Solution?
6
Content Management Systems
Our story starts with a database
Content Database
7
Content Management Systems
Our story starts with a database
to which we add content
Content Database
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
8
Content Management Systems
Our story starts with a database
to which we add content
and more content (including design elements)
Department of Something
Content Database
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
9
Content Management Systems
Our story starts with a database
to which we add content
and more content (including design elements)
Department of Something

• Home

Content Database

• This Way

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

• That Way

and (maybe) navigation tools
10
Content Management Systems
Use forms to enter and edit the story into the
database.
Content Database
Input Forms
11
Content Management Systems
HTML
Content Database
Input Forms
12
Content Management Systems
HTML
Department of Something

• Home

Content Database

• This Way

Input Forms
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

• That Way

13
Content Management Systems
HTML
ADA
Content Database
Input Forms
Department of Something
That Way
This Way
Home
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
14
Content Management Systems
HTML
ADA
Print
Content Database
Input Forms
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
15
Content Management Systems
HTML
ADA
Content
Print
Content Database
Input Forms
WML
PDA Proprietary
RSS- XML
16
Content Management Systems
You can format the same content for output in
many display formats and data protocols.
HTML
ADA
Content
Print
Content Database
Input Forms
WML
PDA Proprietary
RSS- XML
17
Content Management Systems
1. Input Once Output Many Formats
HTML
ADA
Content
Print
Content Database
Input Forms
WML
PDA Proprietary
RSS- XML
18
Content Management Systems
1a. Correct Once Correct Them All
HTML
ADA
Content
Print
Content Database
Input Forms
WML
PDA Proprietary
RSS- XML
19
Content Management Systems
Separate Content from Design
HTML
ADA
Content
Print
Content Database
Input Forms
WML
PDA Proprietary
RSS- XML
20
Content Management Systems
Design
Separate Content from Design
HTML
Template CSS
ADA
Template CSS
Content
Print
Template CSS
Content Database
Input Forms
WML
WML Template
PDA Proprietary
Template HTML Clipping CSS
RSS- XML
Template XML CSS
21
Content Management Systems
Separate Content from Design
HTML
ADA
Content
Design
Print
Content Database
Design Database
Input Forms
Template
WML
PDA Proprietary
RSS- XML
22
Content Management Systems
Separate Content
from Design
HTML
ADA
Content
Design
Print
Content Database
Design Database
Input Forms
Template
WML
PDA Proprietary
RSS- XML
23
Content Management Systems
Separate Content
from Design
HTML
CSS
ADA
Content
Design
Print
Content Database
Design Database
Input Forms
Template
WML
PDA Proprietary
RSS- XML
24
Content Management Systems
Separate Content
from Design
HTML
CSS
Site-Wide Changes
ADA
Content
Design
Print
Content Database
Design Database
Input Forms
Template
WML
PDA Proprietary
RSS- XML
25
Content Management Systems
Separate Content
from Design
HTML
CSS
Site-Wide Changes
ADA
Content
Design
Print
Content Database
Design Database
Input Forms
Template
WML
PDA Proprietary
Design Form
RSS- XML
26
Content Management Systems
HTML
Input Forms
ADA
Input Forms
Design
Content
Print
Content Database
Design Database
Input Forms
Template
WML
Input Forms
PDA Proprietary
Input Forms
Design Forms
RSS- XML
27
Content Management Systems
HTML
Input Forms
Expert
ADA
Input Forms
Staff
Design
Content
Print
Content Database
Design Database
Input Forms
Template
Faculty
WML
Input Forms
User-driven FAQ
PDA Proprietary
Input Forms
Design Forms
Syndicated News
RSS- XML
28
Content Management Systems
2. Delegate Content Creation
You work on SITE DESIGN Management
HTML
Input Forms
Expert
ADA
Input Forms
Staff
Design
Content
Print
Content Database
Design Database
Input Forms
Template
Faculty
WML
Input Forms
User-driven FAQ
PDA Proprietary
Input Forms
Design Forms
Syndicated News
RSS- XML
29
In summary
30
Benefits of CMS

• Single source of content
• Reusability of content
• Versioning
• Easier maintenance
• Consistency
• Easier authoring and publishing

31
CMS - Features

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

32
Data Management

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

33
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

34
Web Templating

• Web pages showing contents created from templates
• Separating content design and visual presentation
  of content

35
Personalisation

• Easier to create personalised pages for web site
  visitors once content is stored into CMS
• Skinning may be used for this purpose

36
Syndication

• Allows sharing of web content with other
  corporations made possible by separating
  content from design
• Most popular RSS (Really Simple Syndication) and
  XML

37
Digital Rights Management

• CMSs provide the background for managing the
  rights to your content

38
Resources

• Books
• Content Management Bible http//www.amazon.com/exe
  c/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/Confe
  rences/Summit2002/IA_Summit_031602.ppt
• Smarter Content Publishing
  
  http//www.digital-web.com/features/feature_2002-0
  8.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/

39
AppendixJust For Your Information
40
Web Site Construction and Evaluation Process
41
Who is Involved in Web Site Design?
Graphic Designers
Project Manager
Content Experts
Technical Experts
Writers
Information Architects
42
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?

43
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

44
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

45
Additional Steps

• Design Critiques
• Identify other Web sites to use as models
• See design from the users 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

46
Site Development Process
Do you see relationship to System Development
Life Cycle?

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

47
Site Production Checklist
1 SITE DEFINITION PLANNING

• Production issues
• Technology
• Web server support
• Budgeting

48
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?

49
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?

50
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

51
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

52
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

53
STEP 4 Site Construction

• Web site is filled with content
• Create database and programming components
• Beta test the site

54
STEP 5 Site Marketing

• Site should be integral part of marketing
  campaign and corporate communications programs.
• URL should appear on every piece of
  correspondence

55
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

56
The End.