AAD 0085. Introduction to Web Design

Units: 3
Advisory: Completion of AAD 70 or 75 with grade of "C" or better
Hours: 90 (36 lecture, 36 laboratory, 18 activity)
An introduction to web design, covering topics and strategies necessary for the creation and design of websites. Topics include semantic markup using HyperText Markup Language (HTML); design through the use of Cascading Style Sheets (CSS); human-centered design problems specific to web delivery; the creation and optimization of graphics and images for the web; accessibility; search engine optimization, and current industry standards. (CSU)

AAD 0085 - Introduction to Web Design

http://catalog.sierracollege.edu/course-outlines/aad-0085/

Catalog Description Advisory: Completion of AAD 70 or 75 with grade of "C" or better Hours: 90 (36 lecture, 36 laboratory, 18 activity) Description: An introduction to web design, covering topics and strategies necessary for the creation and design of websites. Topics include semantic markup using HyperText Markup Language (HTML); design through the use of Cascading Style Sheets (CSS); human-centered design problems specific to web delivery; the creation and optimization of graphics and images for the web; accessibility; search engine optimization, and current industry standards. (CSU) Course Student Learning Outcomes CSLO #1: Apply correct web design and development terminology. CSLO #2: Demonstrate proper file management techniques for creating websites. CSLO #3: Distinguish between the process of applying structure (HTML) and design (CSS) in the creation of finished websites. CSLO #4: Develop web products that promote human-centered design and accessibility for a broad population through the use of design considerations as well as semantic coding practices. CSLO #5: Critique the effectiveness of completed websites as related to structure, interface design, and usability. Effective Term Fall 2025 Course Type Credit - Degree-applicable Contact Hours 90 Outside of Class Hours 81 Total Student Learning Hours 171 Course Objectives Lecture Objectives: Utilize web design terms including those relating to HTML, CSS, web standards, site management practices, as well as other related tools and technologies. Describe the usage of semantic elements as a way to enhance the meaning of web content; Identify methods for improving accessibility using HTML and CSS Differentiate between the uses of graphic and image file formats for the web Evaluate the success of websites in terms of user interface (UI) design, user experience (UX), and technical proficiency. Laboratory/Activity Objectives: Create the proper folder and file structure to establish strong site management; Build a simple web page using HTML for content and CSS for design; Differentiate between the purposes of content (HTML) and design (CSS) as they relate to structure and presentation in a website; Manipulate HTML and CSS to create multiple layout options for improved user interface (UI) and user experience (UX) design.  Enhance the visual presentation of web content using CSS for design outcomes; Design and optimize images, graphics, and visual media for the web; Utilize graphics and images to enhance user interface (UI) and user experience (UX) design and engagement Distinguish between the purposes of foreground and background images and graphics in a website; Apply techniques to aid in accessibility and search engine optimization when creating web pages; Demonstrate an understanding of various types of links in a website including the use of named anchors, navigation bars, email links and image links; Validate, upload, and test websites for browser compatibility General Education Information Approved College Associate Degree GE Applicability CSU GE Applicability (Recommended-requires CSU approval) Cal-GETC Applicability (Recommended - Requires External Approval) IGETC Applicability (Recommended-requires CSU/UC approval) Articulation Information CSU Transferable Methods of Evaluation Classroom Discussions Example: After reviewing lessons, lectures, and related resources on the topics of user-centered design and accessibility, the class will discuss the impacts of visual design (UI), information architecture/content structure, and interaction affect the user experience (UX). Students will be evaluated on their clear understanding of the terminology, concepts, and their relationships. Objective Examinations Example: Define web terminology correctly in a quiz or exam, including terms such as semantics, syntax, structure, HTML, CSS, UI, UX, accessibility, FTP client, root relative, attributes, selectors, properties, values, and others. Projects Example: Students are assigned a Website project in which they are responsible for creating the desired design elements, including sourcing and optimizing graphics and images, constructing the layout, adding relevant and optimized content, controlling the design for consistent presentation using CSS, and applying methods for increasing Accessibility, usability, and Search Engine Optimization. The final sites will be uploaded via FTP to a Remote Server for online access. Skill Demonstrations Example: The student will successfully differentiate between the uses of graphic and image file formats for the web, including the application of foreground and background assets. Students will then prepare and optimize image and graphic files to prioritize the quick loading of quality assets in the proper format. Repeatable No Methods of Instruction Activity Laboratory Lecture/Discussion Distance Learning Activity: The instructor will introduce online tools for the selection of web-ready fonts for website design, including how to integrate the font files into the coding environment. Students will then be asked to style a webpage using multiple fonts selected from an online service, then applied to the content via integration with the HTML and CSS. Lab: The instructor will provide a demonstration on the construction of a basic HTML document to create a semantic outline of the content. After creating the HTML document, the instructor will then demonstrate how to apply an external CSS stylesheet to house CSS rules used to modify the appearance of the HTML elements. The students will then apply this process to a new HTML file where they will add HTML elements to structure their content. Students will then apply an external CSS stylesheet and utilize CSS rules to uniquely style their content. Lecture: The instructor will give a lecture on best practices for creating accessible content in web projects, including how to apply alternative text equivalents for visual media, applying tab index and ARIA roles, and structuring content appropriately using semantic HTML. Students will be asked to respond to the lecture content in a class discussion where specific prompts are outlined. Distance Learning The instructor will provide a lecture and presentation on Cascading Style Sheets (CSS) and CSS Rules, including the anatomy of a CSS Rule and CSS selectors. Students will then be asked to follow the tutorial handout and create an External CSS file with specified CSS Rules as a way to control the presentation of the content on the webpage. Students will update their website with the modifications completed and provide a link to access the site. Peers will be assigned to review the work and give feedback on where they see any errors or inconsistencies in the design. The instructor will also provide feedback and any necessary corrections. Typical Out of Class Assignments Reading Assignments Read Chapter 3 "Getting Around: Navigation, Signposts and Wayfinding" from the textbook Designing Interfaces by Tidwell and Brewer. Pay particular attention to the section titled The Patterns, and prepare to discuss the benefits and drawbacks of at least two to three models presented in the text. Writing, Problem Solving or Performance Critique three existing websites based on the lesson and lecture materials covering design considerations for the web and screen media. Identify the impact of the design decisions you observe, pointing out where you see strengths and how to address the weaknesses.Present one site critique to the class. Other (Term projects, research papers, portfolios, etc.) Prepare a planning guide for a new website. Start by addressing the site's purpose and goals, identifying the target audience and understanding their needs and expectations, then select design elements such as a color scheme, visual media, typefaces and graphic elements to support the content and audience. Next, define a layout model to indicate where the relevant content will sit on the page. Required Materials Adobe Dreamweaver CC Classroom in a Book (2017 release) Author: Jim Malvaid Publisher: Adobe Press Publication Date: 2017 Text Edition: 1st Classic Textbook?: No OER Link: OER: Learning Web Design: A Beginner's Guide to HTML, CSS, JavaScript, and Web Graphics Author: Robbins, Jennifer Publisher: O'Reilly Media Publication Date: 2018 Text Edition: 5th Classic Textbook?: No OER Link: OER: Designing Interfaces: Patterns for Effective Interaction Design Author: Tidwell, Jennifer and Charles Brewer Publisher: O'Reilly Publication Date: 2020 Text Edition: 3rd Classic Textbook?: No OER Link: OER: Other materials and-or supplies required of students that contribute to the cost of the course.

Applied Art and Design

http://catalog.sierracollege.edu/departments/applied-art-design/

Applied Art and Design is an academic discipline which focuses on the principles and practical applications of art, design, photography, computer graphics, imaging and animation. Study of the foundations of design, creative problem solving, portfolio development and internship experiences, all prepare students for transfer programs and career opportunities. Within the AA/AS degree or certificate options, students may concentrate in Graphic Design, Illustration, or Multimedia. Students who successfully complete the Applied Art and Design major can expect to find entry level employment in such areas as digital illustration, graphic design for print and internet, multimedia, animation, photographic retouching and pre-press operation.