SRJC Course Outlines

8/11/2022 4:55:05 AMCS 50.21A Course Outline as of Fall 2015

Inactive Course
CATALOG INFORMATION

Discipline and Nbr:  CS 50.21ATitle:  WEB DESIGN-CSS/GRAPHICS  
Full Title:  Webpage Design with Cascading Style Sheets and Graphics
Last Reviewed:11/8/2010

UnitsCourse Hours per Week Nbr of WeeksCourse Hours Total
Maximum1.50Lecture Scheduled1.5017.5 max.Lecture Scheduled26.25
Minimum1.50Lab Scheduled04 min.Lab Scheduled0
 Contact DHR0 Contact DHR0
 Contact Total1.50 Contact Total26.25
 
 Non-contact DHR0 Non-contact DHR Total0

 Total Out of Class Hours:  52.50Total Student Learning Hours: 78.75 

Title 5 Category:  AA Degree Applicable
Grading:  Grade or P/NP
Repeatability:  00 - Two Repeats if Grade was D, F, NC, or NP
Also Listed As: 
Formerly:  CIS 58.53A

Catalog Description:
Untitled document
Create design elements for a mock client Web site using HTML (hypertext markup language), CSS (cascading style sheets), and graphics. Topics include: Web site templates, color palettes, background images, text and font, navigational design, Web graphic formats, compression, image creations and editing.

Prerequisites/Corequisites:
Course Completion of CS 50.11B ( or CIS 58.51B)


Recommended Preparation:
Course Completion of APGR 72 and CS 70.11A; Eligibility for ENGL 100 or ESL 100

Limits on Enrollment:

Schedule of Classes Information
Description: Untitled document
Create design elements for a mock client Web site using HTML (hypertext markup language), CSS (cascading style sheets), and graphics. Topics include: Web site templates, color palettes, background images, text and font, navigational design, Web graphic formats, compression, image creations and editing.
(Grade or P/NP)

Prerequisites:Course Completion of CS 50.11B ( or CIS 58.51B)
Recommended:Course Completion of APGR 72 and CS 70.11A; Eligibility for ENGL 100 or ESL 100
Limits on Enrollment:
Transfer Credit:
Repeatability:00 - Two Repeats if Grade was D, F, NC, or NP

ARTICULATION, MAJOR, and CERTIFICATION INFORMATION

Associate Degree:Effective:Inactive:
 Area:
 
CSU GE:Transfer Area Effective:Inactive:
 
IGETC:Transfer Area Effective:Inactive:
 
CSU Transfer:Effective:Inactive:
 
UC Transfer:Effective:Inactive:
 
C-ID:

Certificate/Major Applicable: Certificate Applicable Course



COURSE CONTENT

Outcomes and Objectives:
Upon completion of the course, students will be able to:
Untitled document
Upon completion of the course, the student will be able to:
1.  Compile and use the software required to design a Web site.
2.  Design effective Web sites with consistent and pleasing look and feel, easy-to-use navigation, consistent visual and navigational elements, and branding.
3.  Analyze template CSS code and modify it to create a new site.
4.  Compare and contrast the strengths of the  JPEG (Joint Photographic Experts Group), GIF (Graphic Interchange Format), and PNG (Portable Network Graphics) formats.
5.  Choose the appropriate graphic file type for specific applications.
6.  Create a color palette for a Web site using color and  graphics.
7.  Apply techniques to edit poor quality images.
8.  Use filters and special effects.
9.  Produce a functional navigational interface for a Web site.
10. Make use of Web resources for current information on Web design and Web graphics.

Topics and Scope
Untitled document
1. Software  requirements for Web design
      a.  XHTML (eXtended HTML) and CSS editors
      b.  Graphics programs
      c.  Shareware graphics programs
      d.  FTP (File Transfer Protocol) software - "Fugu" or "SSH Client" (Secure SHell)
2. Web design principles
      a.  Critiquing existing Web sites
      b.  Using color and graphics to establish a look and feel.
      c.  Elements of effective navigation
      d.  Establishing site consistency
      e.  Using logos and text to establish effective branding
3. CSS and XHTML
               a. Review of CSS and XHTML
                b. Principles of Web page layout and site architecture using CSS and XHTML
4. Using a template
      a.   Downloading
      b.   Analyzing
      c.   Modifying
      d.   Uploading
5. Graphics formats and compression Portable Network Graphics (PNG) formats
      a.  Joint Photographic Experts Group (JPEG)
      b.  PNG
      c.  Transparency
6. Using CSS to apply color
7. Image editing
      a. Downloading
      b. Resizing
      c. Cropping
      d. Unusual cropping
      e. Using filters
      f.  Applying effects
      g. Selecting background
8. Using CSS to control text
      a.   Effective headings
      b.   Formatting  body text
      c.   Principles of text formatting
      d.   Text sizing - absolute vs relative
9. Using CSS and or graphics to modify navigation
      a.   CSS of horizontal navigation bars
      b.   Creating images for navigation bars
      c.   Using CSS to create linked text effects
10. Compiling Web resources in the areas of
      a.   Web design principles
      b.   CSS
      c.   XHTML
      d.   Graphics
      e.   Color

Assignments:
Untitled document
1. Evaluate three existing templates in terms of color, layout, navigation, text and graphics
2. Upload template files onto the Web server
3. Digitize a photo, save the file at various levels of the PNG and JPEG format
4. Create a transparent GIF and PNG
5. Modify Web page template to create a multi-page site, which contains the following elements:
  a.  Site color scheme
  b.  Site name and page name
  c.  Navigation
  d.  Formatted text
  e.  Graphics for site structure
  f.   Content images
6. Evaluate classmate's work regarding color, line, layout, navigation and graphics
7. Contribute Web resources to class resource page in the areas of design, CSS, XHTML, image creation and image editing.
8. 2-5 Quizzes
9. Reading approximately 20 pages per week

Methods of Evaluation/Basis of Grade.
Writing: Assessment tools that demonstrate writing skill and/or require students to select, organize and explain ideas in writing.Writing
0 - 0%
None
This is a degree applicable course but assessment tools based on writing are not included because problem solving assessments are more appropriate for this course.
Problem solving: Assessment tools, other than exams, that demonstrate competence in computational or non-computational problem solving skills.Problem Solving
55 - 70%
Website design assignments
Skill Demonstrations: All skill-based and physical demonstrations used for assessment purposes including skill performance exams.Skill Demonstrations
0 - 0%
None
Exams: All forms of formal testing, other than skill performance exams.Exams
20 - 35%
Quizzes: multiple choice, true/false, matching items
Other: Includes any assessment tools that do not logically fit into the above categories.Other Category
0 - 10%
Attendance and participation


Representative Textbooks and Materials:
Untitled document
Designing Web Graphics-version 4, by Lynda Weinman - New Riders 2007

Print PDF