Web Design – CIS 340

Syllabus

Quarter: Fall 2012

Meeting Online
Days/Time
Instructor Dr. Michael Kolta
Instructor E-mail [email protected]
IMPORTANT: Always list the course number, section number, and
your full name in the e-mail subject. E-mails that do not contain this
information will need to be resent.
Instructor Phone: (703) 688-4286
If calling during office hours (see below) and there is no answer, leave a
voicemail with a phone number and expect to receive a call back within
approximately 30 minutes. Outside of office hours, it is preferred that you
e-mail the instructor with a phone number to set an appointment for a call
back. This must be done at least 48 hours in advance. Provide two or
three specific times that work for you and the phone number that you can
be reached at.
Instructor Office 8:00 PM to 10:00 PM Mondays, EST
Hours/Location Virtual (online or via phone)
Academic Office
iCampus.strayer.edu
Contact
Strayer Online
877-642-2999
Technical
(Used for problems entering the class)
Support
Blackboard
866-350-9427
Technical
(Used for problems once in the class)
Support

INSTRUCTIONAL MATERIAL - Required

Shelly, G. B., Campbell, J.T., Rivers, O. (2011). Microsoft® Expression® Web 3:

Comprehensive concepts and techniques. Boston, MA: Course Technology.

Microsoft® Expression® Web 4

INSTRUCTIONAL MATERIAL - Supporting

CIS 340 – Faculty Version 201102 Page 1 of 19

The following resources provide additional background and supporting information for this
course. There is no need to purchase these items for the course.

Media\Outreach.com (2007). Using images online. http://mediaoutreach.com/2007/09/using-

images-online/.

COURSE DESCRIPTION

Students will learn basic web design and development principles. The course will focus on the
theory and practice of using Web design software applications in the creation of effective multi-
page interface design. Students will explore web design concepts, including project planning,
layout, usability, accessibility, information design, site structure, site management, and graphic
design in the context of the web.

COURSE OUTCOMES

Upon the successful completion of this course, the student will be able to:
1. Customize and manage the Expression Web® environment.
2. Create Websites using Expression Web®.
3. Develop a front end needs analysis for a specific target audience
4. Use CSS to create page layouts.
5. Create and update CSS rules for a Website.
6. Use color and graphics to unify a Website.
7. Create templates for specific business needs.
8. Create a functional hierarchy for a Website.
9. Create a consistent navigational scheme for a Website.
10. Place images and create thumbnails in a Website.
11. Utilize text from external documents.
12. Create and format text to optimize its message.
13. Use technology and information resources to research issues in database technology.

Writing Assignments
The objective of the School of Information Systems writing assignments is to promote attitudes
and skills that will improve a student’s ability to communicate in writing, develop research
skills, documentation techniques, and encourage critical analysis of data and conclusions
specific to the course learning outcomes and information systems and technology domain.

COURSE EXPECTATIONS

To obtain the most benefit from this class:

Follow Strayer University’s policies and procedures as well as those specific to this class.
o Class specific information can be found within the “Class Information” section
within the Student Center.

WEEKLY COURSE SCHEDULE

CIS 340 – Faculty Version 201102 Page 2 of 19
The weekly schedule below describes the learning activities that will help you achieve the course
outcomes listed above and the assignments that will be used to measure your mastery of the
outcomes. Each week is divided into sections consisting of readings, lectures, activities and
assignments. For selected assignments, you will find a rubric that will be used to evaluate your
performance.

Schedule
Week # Start End What’s due each week (This table does not list readings, lectures,
Date Date and other activities, only what must be submitted each week. See
below for details)
1 Oct 8 Oct 14 assignment, 2 discussions
2 Oct 15 Oct 21 discussion
3 Oct 22 Oct 28 2 discussions
4 Oct 29 Nov 4 assignment, 2 discussions
5 Nov 5 Nov 11 assignment, discussion
6 Nov 12 Nov 18 assignment, discussion
7 Nov 19 Nov 15 assignment, discussion
8 Nov 26 Dec 2 2 discussions
9 Dec 3 Dec 9 assignment, discussion
10 Dec 10 Dec 16 assignment, discussion
11 Dec 16 Dec 23 assignment, discussion

IMPORTANT LATE POLICY: Discussions are not accepted late.

Late Assignments will be penalized 10% per day. Assignments received more than three days
late will not receive credit.

WEEK 1

Course outcome in focus:

Customize and manage the Expression Web® environment.
Create and format text to optimize its message.

Supporting topics:
Starting and exiting Expression Web®
Creating a new site
Using visual aids
Using spell-check
Setting page properties
Saving pages
Using different views
Formatting text
Headings and lists

CIS 340 – Faculty Version 201102 Page 3 of 19

 Weekly Activities:

Reading:
Expression Web 3: Creating an Expression Web Site - Chapter 1

Assignments:
Complete Assignment #1

Assignment #1: Research the history of the World Wide Web and how the use of various
types of Websites has changed the world we live in. Suggested topics include:

e-Commerce Sites and the Global Market

Education Online
Personal Websites
Social Networking sites (i.e. MySpace, Facebook, LinkedIn, etc.)

This paper should be 2-3 pages in length.

o This paper should adhere to APA style standards including the following:
Double space, 1” margins, New Times Roman 12pt. font, in text citation of
references, title page and a reference page (title page and reference page are
not counted as content pages).

Course Lectures:

Activity – Faculty Introduction, course overview and expectations

Review course philosophy, expectations, assignments and late policy, grading,
academic integrity, APA, and attendance policy

Activity – Student introductions

Lecture/discussion on Creating an Expression Web Site

Activity - My Preferences

Lecture/discussion on Working with Text

WEEK 2

Course outcome in focus:

Use color and graphics to unify a Website.
Place images and create thumbnails in a Website.

CIS 340 – Faculty Version 201102 Page 4 of 19

Supporting topics:

Using color to highlight meaning

Placing graphics to guide visitor’s eyes
Inserting images
Borders to images
Thumbnails
Editing images
Using image folder

Weekly Activities:

Reading:
Expression Web 3: Working with Images and Links—Chapter 2 to Adding
Navigational Links to a Site
Media\Outreach.com (2007). Using images online.
http://mediaoutreach.com/2007/09/using-images-online/

Assignments:
Practice skills addressed during this week.

Course Lectures:

Lecture/discussion on Adding Images

Activity - The Good, The Bad, The Ugly Images

WEEK 3

Course outcome in focus:

Create a consistent navigational scheme for a Website.
Create Websites using Expression Web®.
Develop a Front End Needs analysis for a specific Target Audience.

Supporting topics:
Using image folder
Applying hyperlinks: internal, external
Creating hyperlinks
Adding bookmarks
Adding screen tips
Analyzing site needs
Characteristics of a target audience
Matching needs with technology

Weekly Activities:

CIS 340 – Faculty Version 201102 Page 5 of 19

 Reading:
Expression Web 3: Working with Images and Links—Chapter 2 from Adding
Navigational Links to a Site to the end of the chapter

Assignments:
Practice skills addressed during this week.

Course Lectures:

Lecture/discussion on Navigational Design

Activity - Scavenger Hunt

1. How to use “Advanced Rhythm Notation” in Microsoft’s

Songsmith
2. Dan Abnett has been designing comics since the late 1980s. Find
his bio
3. You need to pay back taxes and want to do this online. Where do
you go?

Lecture/discussion on Extending Your Knowledge

Activity/discussion - Creating a Bio Page

WEEK 4

Course outcome in focus:

Use color and graphics to unify a Website
Create Websites using Expression Web®.
Use technology and information resources to research issues in database technology.

Supporting topics:
WYSIWG tools
History of Web Design

Weekly Activities:

Reading:
No textbook reading to allow time for researching and reading articles for the
paper
Assignments:
Conduct Internet search for articles for paper
Practice skills addressed during this week.
Complete Assignment #2

Assignment #2 – Needs Analysis

CIS 340 – Faculty Version 201102 Page 6 of 19

 Creating the Front End Needs Analysis for the Bears site – use the images provided to create
a small sample site over the next two weeks.

The Front End Needs Analysis should answer the following questions:
1. Who is the target audience?
o Describe their demographics with at least five pertinent characteristics
(profession, age, marital and/or family status, income level, interests, other)
2. What color scheme does the “client” want?
3. Are there other sites that the client has looked at for comparisons? If so, what sites?
(Include those as reference points.)
4. What is the primary purpose of the site?
a. Does the client want this to be an e-Commerce site? (We do not cover that
kind of production in this class, but it is a question that would need to be
answered in the real world.)
5. What is the desired timeline for completion of the site?
6. Who is responsible for the images to be used? (Students can be creative here and
choose to use their own images in place of the ones provided.
7. Who will be the content expert and provide content and/or check content during
development?

o This paper should adhere to APA style standards including the following:
Double space, 1” margins, New Times Roman 12 pt. font, and a title page
(title page and reference page are not counted as content pages).

Rubric
Criteria Unacceptable Developing Competent Exemplary Wt
Described five (5) Did not submit or Described 1 -2 Described 3 - 4 Described 5 or .3
or more of the did not describe characteristics of characteristics of more characteristics
target audience’s target audience’s the target audience; the target audience; of the target
characteristics characteristics; or provided partial provided audience fully;
included irrelevant observations; or sufficiently helpful provided specific,
information included some observations important
irrelevant observations
information
Answered Did not submit or Answered 1 Answered 2 Answered all 3 .3
questions about: answered questions question questions questions fully;
(1) Color, (2) insufficiently sufficiently; other sufficiently; provided helpful
comparisons to questions answered provided some details
other sites, (3) partially. helpful details
purpose of site
Answered Did not submit or Answered 1 Answered 2 Answered all 3 .3
questions about: answered questions question questions questions fully;
(1) Timeline, (2) insufficiently sufficiently; other sufficiently; provided helpful
images, (3) questions answered provided some details
Content expert partially. helpful details

Writing: Did not submit; or Organization, Organization, Organization, .1

Organization, organization, sentence structure, sentence structure, sentence structure,
sentence sentence structure, grammar, spelling, grammar, spelling, grammar, spelling,
CIS 340 – Faculty Version 201102 Page 7 of 19
 Criteria Unacceptable Developing Competent Exemplary Wt
structure, grammar, spelling, and punctuation; and punctuation; and punctuation;
grammar, and punctuation; APA Usage – APA Usage – APA Usage –
spelling, APA Usage – 5 - 7 different errors 4 - 5 different errors 0 - 3 different errors
punctuation 8 + different errors
APA Style applied

Course Lectures:

Lecture/discussion on Developing a Site

Activity - Who is the Audience?

Write your Description of a possible Audience

Web Page Backgrounds
Here:

CIS 340 – Faculty Version 201102 Page 8 of 19

CIS 340 – Faculty Version 201102 Page 9 of 19
 Lecture/discussion on The History and Evolution of WYSIWYG Editors for the
Web

Activity - Comparing Tools

WEEK 5

Course outcome in focus:

Create Websites using Expression Web®.
Develop a Front End Needs analysis for a specific Target Audience.
Create and format text to optimize its message.

Supporting topics:
Reinforcement of associated skills from previous weeks:
o Create Websites using Expression Web®.
o Use color and graphics to unify a Website.
o Place images and create thumbnails in a Website.
o Create a consistent navigational scheme for a Website.
o Develop a Front End Needs analysis for a specific target audience.

Weekly Activities:

Reading:
Students should research online for templates for needs analysis
An example can be found at Analysis Tools
(http://www.ceismc.gatech.edu/MM_tools/analysis.html)

Assignments:
Practice skills addressed during this week.
Complete Assignment #3
CIS 340 – Faculty Version 201102 Page 10 of 19
Assignment #3 – Bears Site

Using the information from the Front End Needs Analysis in Week 4 and the images provided
create the Bears Website.

The site should include the following elements:

1. Consistent look and feel on all pages

2. Consistent navigational elements
3. The use of at least 5 images
4. One external hyperlink
5. One email hyperlink
6. Bookmarks on at least one page

Course Lectures:

Lecture/discussion on Reviewing how to Organize a Website

Activity - Sharing the Bears

WEEK 6

Course outcome in focus:

Create templates for specific business needs.
Create a functional hierarchy for a Website.
Utilize text from external documents.

Supporting topics:
Creating templates
Editing templates
Creating folders
Renaming and deleting folders
Renaming pages
Using text from an outside source
Reinforcement of associated skills from previous weeks:
o Create Websites using Expression Web®.
o Create and format text to optimize its message.
o Use color and graphics to unify a Website.
o Place images and create thumbnails in a Website.
o Create a consistent navigational scheme for a Website.
o Develop a Front End Needs analysis for a specific target audience.

Weekly Activities:

Reading:
CIS 340 – Faculty Version 201102 Page 11 of 19
 Expression Web 3: Working with Templates and Styles—Chapter 3 to Defining
Styles and Styles Sheets

Assignments:
Complete Assignment #4

Assignment #4 – Final Project Proposal

This class culminates in a Website of your own design. This week you will work on creating the
proposal for your “client” based on the following:

A short Front End Needs Analysis

A storyboard (you may do this in Word or PowerPoint) demonstrating what the pages
will look like

Your site may be on any topic of your choosing, but in the end must include the following:

1. Eight to ten pages (linked through a common navigational scheme)

2. Consistent look and feel (you may choose to use a Template for this)
3. An external hyperlink
4. Use of a table
5. One page with bookmarks

Course Lectures:

Lecture/discussion on Working with Templates

Activity - Commercial Templates

Lecture/Demonstration on Working with a Commercial Template

Activity - Using a Template

WEEK 7

Course outcome in focus:

Create and update CSS rules for a Website.

Supporting topics:
Creating and modifying CSS Rules
Defining a style sheet
Applying styles Reinforcement of associated skills from previous weeks:
o Create Websites using Expression Web®.
o Create and format text to optimize its message.
o Use color and graphics to unify a Website.
o Place images and create thumbnails in a Website.
CIS 340 – Faculty Version 201102 Page 12 of 19
 o Create a consistent navigational scheme for a Website.
o Develop a Front End Needs analysis for a specific target audience.

Weekly Activities:

Reading:
Expression Web 3: Working with Templates and Styles—Chapter 3 Defining
Styles and Styles Sheets to end of the chapter

Assignments:
Complete Assignment #5

Assignment #5 – Applying CSS

For this week, develop the CSS that you will be using for your Final Project.

Upload an example page that shows the styles and how they will be applied in your site. CSS
should include the following:

1. Two heading level tags

2. Hyperlinks
3. One class
4. Optional rules:
 Table tags
 Page background

Course Lectures:

Lecture/discussion on Using CSS

Activity - Word Search

K T O I K R A M K O O B H D M

N J T H U M B N A I L D A C P

E M L I U R E V R E S B E W F

T N A V I G A T I O N I R H O

R A S O R S B T T I N G I F H

B L K D P E C H A L J M E O G

R P I W E B S I T E T V U L E

O P R N E N T K H Y O X I D C

CIS 340 – Faculty Version 201102 Page 13 of 19

 W I N E K S Y A N P I M R E A

S O P D E S L T Y C A H E R P

E T A L P M E T I G J R A S S

R I D E B U S S E J P E G O K

P T H Y P E R L I N K S W I R

L P R I A E M A I L B L A P O

C U L P R A U N E M L T E O W

Words:
BOOKMARK LINKS
BROWSER MENU
EMAIL NAVIGATION
FOLDERS STYLES
GIF TEMPLATE
GRAPHICS THUMBNAIL
HYPERLINKS WEB SERVER
IMAGE WEBSITE
JPEG WORKSPACE

WEEK 8

Course outcome in focus:

Use CSS to create page layouts.

Supporting topics:
Creating IDs and classes
Identifying CSS syntax
Creating an external style sheet
Modifying pages using CSS
Creating a CSS report
Reinforcement of associated skills from previous weeks:
o Create Websites using Expression Web®.
o Create and format text to optimize its message.
o Use color and graphics to unify a Website.
o Place images and create thumbnails in a Website.
o Create a consistent navigational scheme for a Website.
o Develop a Front End Needs analysis for a specific target audience.

CIS 340 – Faculty Version 201102 Page 14 of 19

Weekly Activities:

Reading:
Expression Web 3: Creating Styles and Layouts with CSS—Chapter 4

Assignments:

Course Lectures:

Lecture/discussion on Using CSS for Layouts

Activity - Playing with CSS

o How does the application of a different style change the page?
o In what ways can this become a benefit to the creation of a Web site?
o Where could CSS be applied to help the development process move faster?

Lecture/discussion on Complications of CSS

o Using the CSS Compatibility table on CSS contents and browser compatibility
(http://www.quirksmode.org/css/contents.html) discuss legacy browser issues
o Using two different browsers in class, explore how the pages do not look the same
o Discuss ways to circumvent these issues

Activity - CSS Zen Garden

WEEK 9

Course outcome in focus:

Use color and graphics to unify a Website.
Create well-designed Websites using Expression Web®.
Develop a Front End Needs analysis for a specific Target Audience.

Supporting topics:
Reinforcement of associated skills from previous weeks:
o Create Websites using Expression Web®.
o Create and format text to optimize its message.
o Use color and graphics to unify a Website.
o Place images and create thumbnails in a Website.
o Create a consistent navigational scheme for a Website.
o Develop a Front End Needs analysis for a specific target audience.

Weekly Activities:

Reading:
No new reading this week

CIS 340 – Faculty Version 201102 Page 15 of 19

 Assignments:
Complete Assignment # 6

Assignment #6 – The Catering Site

Using the graphics provided students develop the first five pages of a prototype Web site for a
catering company. The site should include the following elements:
1. Consistent look and feel (templates may be used)
2. Consistent navigational scheme
3. Image placement to guide the visitors eye
4. One external link
5. An external CSS style sheet
6. The use of one class or one ID for CSS
You may use “dummy text” from http://www.lipsum.com in the creation of this site.

Course Lectures:

Lecture/discussion on Review of Key Development Elements

o Analyzing needs for a site
o Matching technology needs with a site
o Working with a client to develop a needs analysis
o Using colors to match a message
o Creating navigational schemes

Activity - Best Practices

WEEK 10

Course outcome in focus:

Create Websites using Expression Web®.

Supporting topics:
Reinforcement of associated skills from previous weeks:
o Create Websites using Expression Web®.
o Create and format text to optimize its message.
o Use color and graphics to unify a Website.
o Place images and create thumbnails in a Website.
o Create a consistent navigational scheme for a Website.
o Develop a Front End Needs analysis for a specific target audience.

Weekly Activities:

Reading:
No new reading this week.

Assignments:
Practice skills addressed during this week.
CIS 340 – Faculty Version 201102 Page 16 of 19
 Complete Assignment # 7

Assignment #7 – Final Project Presentation

Here is the checklist for the elements of your final project:

1. Eight to ten pages (linked through a common navigational scheme)
2. Consistent look and feel (you may choose to use a Template for this)
3. An external hyperlink
4. Use of a table
5. One page with bookmarks
Remember to use the Spell Check in Expression Web ® for your entire site.

Assignment Grading Rubric

Criteria Unacceptable Developing Competent Exemplary W
T
Completeness Did not submit or Developed partially; Developed Developed fully; .5
developed insufficiently 4-5 pages linked with sufficiently; 6-7 8-10 pages
with 3 or fewer pages a common pages linked with a linked with a
linked with a common navigational scheme, common navigational common
navigational scheme, many issues; 60–79% scheme, minor issues; navigational
significant issues; less accuracy/ 80% - 89% accuracy/ scheme; 90% -
than 60 % accuracy/ completeness completeness 100% accuracy/
completeness completeness
Elements Did not submit or none One three required Two of three required Three required .3
External of the required elements elements included elements included elements
hyperlink included accurately; accurately; some accurately; most included
One page with few components of components of table components of table accurately;
bookmarks table developed developed developed components of
Table table developed
fully
Consistent look Did not submit or Look Look and feel Look and feel Look and feel .1
and feel and feel insufficiently partially consistent sufficiently consistent highly consistent
consistent with goals with goals and with goals and with goals and
and requirements requirements requirements requirements
Writing: Did not submit or Sentence structure, Sentence structure, Sentence .1
grammar, sentence structure, grammar, spelling, grammar, spelling, structure,
spelling, and grammar, spelling, and and punctuation had and punctuation had grammar,
punctuation punctuation had 7 + 5 – 6 different errors 3 – 4 different errors spelling, and
different errors (Many issues) (Minor issues) punctuation had
(Significant issues) 0 - 2 different
errors

Course Lectures:

Lecture/discussion on – What Works, What Doesn’t Work

o Customizing the workspace
o File management
o Creating links
o Placing images
o Accessibility attributes

CIS 340 – Faculty Version 201102 Page 17 of 19

 o Using CSS
o Creating/using templates

Activity - Peer Reviews

WEEK 11

Supporting topics:

Weekly Activities:

Final projects are due. These changes should reflect feedback from the instructor and
discussion threads of week 10.

Discussions
Students taking this course online are required to post their discussions to a weekly thread in the online
course shell. Make at least one initial post and respond to at least one other student’s post for a chance
to earn full credit for each discussion. As it is always possible that you could lose your work due to
unforeseen circumstances, you should routinely save your work in a separate file before posting in the
course discussion area.
Each discussion forum is worth 16 points. Grading for discussion forums will be based on the following
rubric:

Discussion forums rubric

0 points 4 points 8 points
Criteria
Unacceptable Developing Sufficient
1. Initial post No initial post. Initial post is not relevant, Initial post is relevant, of sufficient
too short, or poorly written. length, and well written.
0 points 4 points 8 points
Unacceptable Developing Sufficient
2. Second post No second post. Second post is not relevant, Second post is relevant, of
too short, or poorly written. sufficient length, and well written.

ASSIGNMENT OUTLINE AND GRADING

points
type each x quantity = total
Assignments 100 x 8 = 800
Discussions 16 x 13 = 208
TOTAL 1008

Note: the “class introductions” discussion forum and the week

11 discussion forum are not graded but are still required.
CIS 340 – Faculty Version 201102 Page 18 of 19
 IMPORTANT LATE POLICY: Discussions are not accepted late.
Late Assignments will be penalized 10% per day. Assignments received more than three days
late will not receive credit.

Grading Scale
90-100 A
80-89 B
70-79 C
60-69 D
Below 60 F

CIS 340 – Faculty Version 201102 Page 19 of 19