Course Outline of Record

Item	Value
Curriculum Committee Approval Date	10/19/2021
Top Code	061430 - Website Design and Development
Units	3 Total Units
Hours	90 Total Hours (Lecture Hours 36; Lab Hours 54)
Total Outside of Class Hours	0
Course Credit Status	Credit: Degree Applicable (D)
Material Fee	No
Basic Skills	Not Basic Skills (N)
Repeatable	No
Grading Policy	Standard Letter (S),  Pass/No Pass (B)

Course Description

Formerly: Introduction to Web Page Design. This course provides a basic introduction to designing websites and preparing images and media for Web delivery. The student will learn how to make dynamic websites and Web graphics with popular applications such as Dreamweaver, Photoshop, and WordPress. The student will learn to identify the audience, determine appropriate content, and assemble a functioning website. The class will cover traditional principles of design, how the principles apply to website design, and the issues and constraints of designing complex, multi-layered sites. Transfer Credit: CSU.

Course Level Student Learning Outcome(s)

1. Course outcomes
2. Formulate a Website plan.
3. Apply classic design principles to Website planning and construction.
4. Analyze how to orient and guide Website visitors with clear navigation.
5. Construct a Website based on site plan, wire-frame, and original concepts.

Course Objectives

• 1. Differentiate how various Website markups and languages work together to create graphic and interactive Website page elements.
• 2. Devise multiple solutions to Website development problems and analyze the advantages and disadvantages of each.
• 3. Analyze the differences and similarities between print design and Website design.
• 4. Collaborate in a client/designer relationship to produce a fully functional Website to client needs and specifications.

---

Lecture Content

Philosophy Purpose of the Website Design strategies Interface Design Basic interface for the Web Information access issues Links and navigation Steps in organizing information Chunking information Establishing hierarchy Establishing relationships Site Design Site structure Site elements Internet design factors Page Design Page balance Grid design for pages Choosing font styles Establish consistency Solve cross platform issues Choose editorial style Website Graphics Color display Graphic file formats: GIFS, JPEG, PNG Optimizing graphics Multimedia Audiovisual Elements Digital video Digital audio

Lab Content

Review and analyze various exisiting Website pages Research Websites for case studies Define Web site goal Create graphics for Website using Adobe Photoshop and Adobe Illustrator Develop a site map Design Website pages Create an HTML page that includes all the content in a proper arrangement in preparation for creating a CSS layout. The page should be placed in your webdesign folder and named index.html.  Include on Web page: A title in the title bar One image Your name A navigation scheme for the assignments Create the finished site (from the first project of the semester), with a reasonably complex, “non-Word” layout. Create an assignment page using HTML and CSS. Include a title in the title bar, at least one image, your name (perhaps as a logo), and a navigation scheme for the assignments You also may include basic links to social media and other background information The links should include some sort of rollover effect. Required elements: Presence of a title Correct HTML/CSS.  Validates reasonably well Links with rollovers Aesthetic choices: Legible text Non-clashing colors that ruin legibility Reasonable used of space (including alignment of boxes, etc.) A clear focal point with one image. Creativity Appropriateness to purpose Basic links to social media Other background information Code Web site using HTML and CSS

Method(s) of Instruction

• Lecture (02)
• DE Live Online Lecture (02S)
• DE Online Lecture (02X)
• Lab (04)
• DE Live Online Lab (04S)
• DE Online Lab (04X)

Reading Assignments

Textbook Websites Basic design principles for creating Website Grid design in layout of Website pages Opening and creating HTML files Colors and Website pages

Writing Assignments

Evaluate common errors in Web languages and repair them to meet standards. Distinguish between objective and subjective analysis of a Website and conduct both analyses for Website designs. Distinguish between personalized and dynamic Website pages and how servers and web languages can be used for different Websiteneeds.

Out-of-class Assignments

Research information needed for Website page design Collect assets needed for Website Code Website using HTML and CSS

Demonstration of Critical Thinking

The student will optimize graphics and integrate animation, audio and video into a Website. The student will demonstrate critical thinking by simplifying content information down to the essential elements that best communicate to the targeted audience.

Required Writing, Problem Solving, Skills Demonstration

Demonstate graphic skills using Photoshop, Illustrator, and a scanner by creating graphics to be used in a Website. Demonstrate problem solving and design skills by developing a Website.

Eligible Disciplines

Art: Masters degree in fine arts, art, or art history OR bachelors degree in any of the above AND masters degree in humanities OR the equivalent. Note: “masters degree in fine arts” as used here refers to any masters degree in the subject matter of fine arts, which is defined to include visual studio arts such as drawing, painting, sculpture, printmaking, ceramics, textiles, and metal and jewelry art; and also, art education and art therapy. It does not refer to the “Master of Fine Arts” (MFA) degree when that degree is based on specialization in performing arts or dance, film, video, photography, creative writing, or other non-plastic arts. Masters degree required. Commercial art (sign making, lettering, packaging, rendering): Any bachelors degree and two years of professional experience, or any associate degree and six years of professional experience. Graphic arts (desktop publishing): Any bachelors degree and two years of professional experience, or any associate degree and six years of professional experience. Multimedia: Any bachelors degree and two years of professional experience, or any associate degree and six years of professional experience.

Textbooks Resources

1. Required DuRocher, D.. HTML and CSS QuickStart Guide: The Simplified Beginners Guide to Developing a Strong Coding Foundation, Building Responsive Websites, and Mastering The Fundamentals of Modern Web Design, 1st ed. ClydeBank Media LLC, 2021