SRJC Course Outlines

10/4/2024 9:20:30 PMCS 50A Course Outline as of Fall 2017

Changed Course
CATALOG INFORMATION

Discipline and Nbr:  CS 50ATitle:  WEB DEVELOPMENT 1  
Full Title:  Web Development 1
Last Reviewed:10/24/2022

UnitsCourse Hours per Week Nbr of WeeksCourse Hours Total
Maximum3.00Lecture Scheduled3.0017.5 max.Lecture Scheduled52.50
Minimum3.00Lab Scheduled04 min.Lab Scheduled0
 Contact DHR0 Contact DHR0
 Contact Total3.00 Contact Total52.50
 
 Non-contact DHR0 Non-contact DHR Total0

 Total Out of Class Hours:  105.00Total Student Learning Hours: 157.50 

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: 

Catalog Description:
Untitled document
This course provides an introduction to client-side Web development technology and design. Students learn the basics of current versions of the two primary markup languages used to create Web pages, HTML5 and CSS3, while studying the current industry practices related to user-centered design, including visual and interaction design.

Prerequisites/Corequisites:


Recommended Preparation:
Course Completion of CS 5 and Course Eligibility for ENGL 1A

Limits on Enrollment:

Schedule of Classes Information
Description: Untitled document
This course provides an introduction to client-side Web development technology and design. Students learn the basics of current versions of the two primary markup languages used to create Web pages, HTML5 and CSS3, while studying the current industry practices related to user-centered design, including visual and interaction design.
(Grade or P/NP)

Prerequisites:
Recommended:Course Completion of CS 5 and Course Eligibility for ENGL 1A
Limits on Enrollment:
Transfer Credit:CSU;
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:TransferableEffective:Fall 2014Inactive:
 
UC Transfer:Effective:Inactive:
 
C-ID:

Certificate/Major Applicable: Both Certificate and Major Applicable



COURSE CONTENT

Student Learning Outcomes:
At the conclusion of this course, the student should be able to:
Untitled document
1.  Use HTML and CSS code that meets current industry standards to create a simple website.
2.  Apply appropriate terminology to describe basic web development concepts.
 

Objectives: Untitled document
Upon completion of the course, students will be able to:
1. Create a simple website.
2. Develop webpages that utilize the HTML elements that address the following functions:
    basics document structure, head elements, text markup, site navigation, images, div and
    span structure, semantic elements, tables, forms.
3. Develop webpages that utilize CSS to control the appearance of the site. Students will use
    these CSS property groups: text and font, color and background, the box model, position
    and display, lists, tables.
4. Develop webpages that utilize the CSS concepts of the cascade and inheritance of
    browser, external, embedded and inline CSS.
5. Students will correctly use the CSS elements of selectors, declarations, properties, values.
    Classes and id's will be stressed.    
6. Summarize the following website development concepts:  element, attribute, element
    nesting, asset path, style, rule, selector, declaration, property, and value.

Topics and Scope
Untitled document
I. Basic Document Structure
    A. DOCTYPE html, head, title, body, meta, h1 - h6, br and p elements
    B. Definitions: element, tag, opening element, closing element, stand alone elements,
         attributes, element syntax, page content
    C. Hypertext markup language
    D. Uploading webpages to a server
    E. Roles of web servers and web browsers
    F. Proper nesting of elements
    G. Structure vs. presentation
II. Navigation
    A. Links using relative paths
    B. Links using complete URLs (Uniform Resource Locators)
    C. Links to id's within a webpage
    D. Navigation bars
    E. Validating HTML (HyperText Markup Language) code to the HTML 5 standard
    F. Email link
III. HTML Structural Elements
    A. Strong
    B. Em
    C. Pre
    D. Blockquote
    E. Unordered Lists
    F. Ordered Lists
    G. Definition Lists
    H. Special Characters
IV. Images
    A. Images sources - downloading from a website, digital camera, smart phones. Copyright
         overview
    B. Using the img element to insert images into a webpage
    C. The src, alt, height, and width attributes
    D. Joint Photographic Experts Group vs. Portable Network Graphics vs. Graphic Interchange
         Format
     E. Using folders to organize a website
    F. Using image editing software to resize an image
    G. Linking thumbnail images to a web page
V. Cascading Style Sheets Usage
    A. Basic CSS rules : selector, property, value, declaration, style
    B. Inline, embedded, external and  browser stylesheets
    C. Descendant and multiple selectors
    D. Inheritance
    E. The cascade
    F. Classes and id's
VI. CSS Font / Text Properties
    A. Font-family, font-size, font-weight, font-style, font-variant
    B. Text-align, text-transform, text-indent, text-decoration, color, background-color,
         line-height, letter spacing, word-spacing
VII. HTML Editors -  Download, Use and Review
VIII. CSS (Cascading Style Sheets) Box Properties
    A. Width
    B. Padding
    C. Border
    D. Margin
     E. Background-image
    F.  Background-repeat
    G. Background-position
    H. Shorthand properties: padding, margin, border, background, and font
IX. Webpage layout using CSS
    A. Float
     B. Clear
    C. Wireframe
    D. Conversion of wireframe to web site
    E. Pseudo-classes
    F.  Absolute positioning
    G. Responsive design
    H. Z-index
X. Semantic Elements
    A. conversion of div elements to semantic elements
    B. header, nav, section, footer
    C. Article, aside, time
    D. CSS for screen and print
XI. Tables
    A. Table element
    B. Tr (table row)
    C. Td (table data)
    D. Th (table heading)
    E. Summary
    F. Caption
    G. Border
    H. Rowspan
    I. Colspan
    J. Styling a table using CSS
    K. Nested tables
XII. Forms
    A. Form
    B. POST and GET commands
    C. Input
         1. text
         2. submit
         3. radio
         4. checkbox
         5. reset
         6. hidden
    D. Textarea
    E. Select and option
    F.  Fieldset
    G. Label
    H. Layout of forms
     I.  Styling forms
    J. Form processing using an existing CGI (Common Gateway Interface) script
    K. Using hidden input elements to provide input to an existing CGI script
XIII. Commercial Website
     A. Web hosting
    B. Domain names
    C. E-commerce

Assignments:
Untitled document
Required Assignments:
1. Textbook reading (25 - 60 pages per week)
2. Website projects (4 - 7).  All webpages must be uploaded to the student.santarosa.edu server
    and must validate HTML5.  Each of the following must be included in at least one website
    project:
    a. At least 5 pages
    b. A standard navigation bar
    c. Html, head, title, body, h1, h2, p, a, img, string, em, pre, br, q, blockquote, ol, ul, li, and
         meta elements
    d. CSS to control border-bottom, background-color, font-family, font-size, font-weight,
         font-style, color, and text-decoration properties
    e. The use of classes
    f.  Links using relative paths, links using complete URL's, and links to id's within a webpage
    g. Thumbnails
3. Quizzes (2 - 4)
Optional Assignments:
1. Website critique(s)
2. Participation in electronic message board discussions

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 - 20%
Website critiques, participation in electronic message boards
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
30 - 70%
Website projects
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 - 40%
Quizzes
Other: Includes any assessment tools that do not logically fit into the above categories.Other Category
10 - 20%
Participation, attendance


Representative Textbooks and Materials:
Untitled document
Basics of Web Design: HTML 5 and CSS3. 3rd ed. Felke-Morris, Terry. Pearson. 2015
Head First HTML and CSS. 2nd ed. Robson, Elisabeth and Freeman, Eric. O'Reilly Media. 2012

Print PDF