12/3/2024 9:21:12 AM	CS 50A Course Outline as of Fall 2023	Changed Course
CATALOG INFORMATION
Discipline and Nbr:  CS 50A	Title:  WEB DEVELOPMENT 1
Full Title:  Web Development 1
Last Reviewed:10/24/2022

Units		Course Hours per Week			Nbr of Weeks	Course Hours Total
Maximum	3.00	Lecture Scheduled	3.00		17.5 max.	Lecture Scheduled	52.50
Minimum	3.00	Lab Scheduled	0		6 min.	Lab Scheduled	0
		Contact DHR	0			Contact DHR	0
		Contact Total	3.00			Contact Total	52.50
		Non-contact DHR	0			Non-contact DHR Total	0

Total Out of Class Hours:  105.00

Total 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:

This course provides an introduction to client-side Web development technology and design. Students learn the basics of current versions of Hypertext Markup Languages (HTML) and Cascading Style Sheets (CSS) which are used to create webpages. Lessons incorporate current industry practices related to user-centered design, including visual and interaction design.

Prerequisites/Corequisites:

Recommended Preparation:
Eligibility for ENGL 1A or equivalent

Limits on Enrollment:

Schedule of Classes Information
Description:

This course provides an introduction to client-side Web development technology and design. Students learn the basics of current versions of Hypertext Markup Languages (HTML) and Cascading Style Sheets (CSS) which are used to create webpages. Lessons incorporate current industry practices related to user-centered design, including visual and interaction design.

(Grade or P/NP)
Prerequisites:
Recommended:Eligibility for ENGL 1A or equivalent
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:	Transferable	Effective:	Fall 2014	Inactive:
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:

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:

At the conclusion of this course, the student should be able to:

1. Create a simple multi-page Web site.

2. Develop Web pages that utilize HTML elements to address the following: basic document structure, filesystem concepts, links and navigation, structural, text content, semantic, table, form, rich media, and interactive HTML.

3. Develop Web pages that utilize CSS to control the appearance of the site, including: font and text, pseudo-classes, box model, backgrounds, element positioning, responsive layout, and media queries.

4. Develop Web pages that utilize CSS selector and declaration syntax and concepts of the cascade, specificity, and inheritance with user agent, external, embedded and inline style rules.

5. Summarize the following Web site development concepts and knowledge: Hypertext Transfer Protocol (HTTP), rich media preparation, responsive design, interaction design, visual design, accessibility, hosting, domain names, and professional practices.

Topics and Scope

I. Hypertext Markup Language Version 5 (HTML5)

    A. Document Type Declarations and language versions

    B. Elements, opening and closing tags, self-closing tags, attributes, nesting, and syntax

    C. Filesystem concepts: Web root, file paths, absolute, relative, and in-page URLs/URIs

    D. Links and navigation, hyperlink formats, including mailto: pseudo-protocol

    E. HTML structural elements: Main root, document metadata, sectioning root, content sectioning

    F. HTML text content elements, including lists

    G. HTML semantic elements, including inline text semantics

    H. HTML embedded content elements

    I. HTML scripting elements

    J. HTML demarcating edit elements

    K. HTML table content elements, including caption, rows, headers, cells, nesting and spanning

    L. HTML form elements, including server-side data handling, POST/GET methods, required and data validations

    M. HTML interactive elements

    N. HTML Web component elements

    O. HTML character sets, including Unicode, and character entities

 

II. Cascading Style Sheets Version 3 (CSS3)

    A. CSS language standards and versions

    B. Style rule composition and syntax: selectors, declarations, property name and value pairs

    C. Stylesheet options: user agent, external, internal, and inline styles

    D. Cascading and specificity

    E. Style property inheritance

    F. Selector types, including ID- and class-based selectors, descendent selectors, and pseudo-classes

    G. Declaration properties for font and text characteristics

    H. Declaration properties and underlying concepts for box model, including backgrounds

    I. Declaration properties, concepts, and approaches for page layout, including flexbox and CSS grid

    J. Declaration properties, concepts, and approaches for element positioning, including floating, z-index, relative and absolute position

    K. Declaration properties, concepts, and approaches for interactive, behavioral, transformational, and time-based animation of elements

    L. Media types and media queries, including print media

 

III. HTTP

    A. Client-server HTTP communication model, including roles of Web servers and browsers

    B. HTTP request and response formats

    C. Common HTTP status codes

 

IV. Rich Media: Images, Audio, Video

    A. HTML image and multimedia elements and attributes

    B. Image sources, including intellectual property (IP) and copyright considerations

    C. Web-ready image formats, including JPEG, PNG, GIF, SVG, and WebP

    D. Media editing software tools for preparing web-ready rich media, including image, audio, and video

 

V. Visual Design

    A. Color theory fundamentals, history, principles, and practices

    B. Typography fundamentals, history, principles, and practices

    C. Layout fundamentals, history, principles, and practices

    D. User interface design patterns, including references

    E. Design process, including wireframing and comps

 

VI. Interaction Design

    A. User experience (UX) research fundamentals, principles, and practices

    B. User-centered design (UCD) fundamentals, principles, and practices

 

VII. Responsive Web

    A. Responsive Web design (RWD) fundamentals, history, principles, and practices

    B. CSS media queries applied for responsive design solutions

    C. Mobile-first design approach

 

VIII. Accessibility Principles

    A. WCAG and US Section 508 accessibility requirements, and standards

    B. Accessible Rich Internet Applications (ARIA) standard and HTML attributes

    C. Accessibility testing tools and approaches

    D. Accessibility compliance documentation, including VPAT

 

IX. Professional Practices

    A. Code validation practices and tools

    B. Code editors and integrated development environments (IDEs)

    C. Filesystem management approaches for organizing and backing up static site files

    D. Managing files, including server uploads

    E. Separation of concerns, including presentation vs. structure

    F. Continuous learning approach, including professional publications and online learning and reference resources

 

X. Hosting and Domain Names

    A. Common approaches to Web site hosting solutions

    B. Commercial hosting providers

    C. Domain name registration and name resolution services (DNS)

Assignments:

1. Textbook and other assigned reading (25-60 pages per week)

2. Web page assignments (7-15). All HTML and CSS code submitted must be validated.

3. Midterm and final projects (2). Each project must include:

    A. At least four pages

    B. A navigation system

    C. HTML elements

    D. CSS styles

    E. Rich media elements, including images, audio, and video elements

    F. Links using relative and absolute paths

4. Quizzes and exams (2-4)

5. Discussions (5-8). Conducted in-class or online with participation from all students.

6. Project presentations and peer feedback (2). Each student must present their project to classmates, either online or in-class, and provide feedback to at least two peers. May be ungraded.

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%
Project presentations and peer feedback
This is a degree applicable course but assessment tools based on writing are not included because problem solving assessments and skill demonstrations 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 - 60%
Web page assignments
Skill Demonstrations: All skill-based and physical demonstrations used for assessment purposes including skill performance exams.		Skill Demonstrations 10 - 30%
Midterm and final projects
Exams: All forms of formal testing, other than skill performance exams.		Exams 20 - 40%
Quizzes and exams
Other: Includes any assessment tools that do not logically fit into the above categories.		Other Category 10 - 20%
Participation in discussions

Representative Textbooks and Materials:

Learn Enough HTML CSS, and Layout to be Dangerous: An Introduction to Modern Website Creation and Templating Systems. Donahoe, Lee and Hartl, Michael. Addison-Wesley Professional. 2022.

Responsive Web Design with HTML5 and CSS. Frain, Ben. Packt. 2020.

Learning Web Design. 5th ed. Robbins, Jennifer. O'Reilly Media. 2018.

Head First HTML and CSS. 2nd ed. Robson, Elisabeth and Freeman, Eric. O'Reilly Media. 2012 (classic).

Instructor prepared materials

Print PDF