Academic Catalog

GID 77: ADVANCED WEBSITE DESIGN & DEVELOPMENT

Foothill College Course Outline of Record

Foothill College Course Outline of Record
Heading Value
Effective Term: Summer 2022
Units: 4
Hours: 3 lecture, 3 laboratory per week (72 total per quarter)
Degree & Credit Status: Degree-Applicable Credit Course
Foothill GE: Non-GE
Transferable: CSU
Grade Type: Letter Grade (Request for Pass/No Pass)
Repeatability: Not Repeatable

Student Learning Outcomes

  • Demonstrate HTML5 and CSS3 functionality in web pages for class critique and portfolio presentation.
  • Apply HTML5 and CSS3 in a mobile simulation environment, and/or on a mobile device (smart phone) etc
  • Create web pages that effectively demonstrate proficiency with HTML5/xHTML and CSS3 and validate according to current standards webpage usability and accessibility, and browser compatibility

Description

Introduction to HTML5 and CSS3 for advanced web development and design. Prepares students and working professionals to use advanced tags and layout. Emphasis on writing well-formed markup using current web standards and coding technology, design concepts, usability, accessibility, and browser compatibility. Includes minor elements of JavaScript. Intended for students with a basic working knowledge of HTML/CSS and web design.

Course Objectives

The student will be able to:

  1. Develop a sound plan for converting an existing website using XHTML/CSS to HTML5/CSS3, and/or develop a new website using HTML5/CSS3.
  2. Demonstrate a working knowledge of the use and advantages of HTML5 including tags for accessibility and semantics, including audio and video, and new formatting tags for enhanced rendering of HTML documents.
  3. Demonstrate a working knowledge of the use and advantages of webpage design using CSS3 over CSS, including enhanced layout for both web designers and programmers, especially formats that allow webpages to look more like traditional print and page layout.
  4. Create webpages that effectively demonstrate proficiency with HTML5 and CSS3, especially for enhanced presentation and mobile format, and validate according to current standards for class critique and portfolio presentation.
  5. Demonstrate basic use of XSLT in rendering XML content.

Course Content

  1. Website development overview
    1. Conceptual thinking, storyboard, website navigation
    2. Theory and application of web development technologies
    3. Analysis of XHTML/CSS and application of HTML5/CSS3
    4. Apply and use current web development standards for HTML5 and and CSS3
  2. HTML5 tags and attributes
    1. New semantic/structural elements
    2. New media elements
    3. New form elements
    4. Local storage
    5. WebSocket
    6. Drag and drop
    7. Geolocation
    8. Server-Sent Events
    9. Canvas, SVG, basic JavaScript
  3. CSS3 modules
    1. Selectors
    2. Box model
    3. Backgrounds and borders
    4. Text effects and user interface
    5. 2-D/3-D transformations
    6. Animations
    7. Multiple column layout
  4. Mobile formats using HTML5/CSS3
    1. HTML5/CSS3 formats for mobile browsers
    2. Rich media formats for mobile browsers
    3. Designing mobile apps using HTML5/CSS3
  5. XML XPATH and XSLT
    1. Basic XML content contrast with XHTML
    2. XPATH and tree navigation and selection
    3. XSLT for rendering basic XML documents

Lab Content

  1. Semantic/structural tags
  2. Form and input tags
  3. Media tags
  4. Drag/drop, geolocation, local storage
  5. Server-Sent Events and WebSockets
  6. Canvas, SVG, basic JavaScript
  7. CSS3 selectors and box model, multiple column layout
  8. Backgrounds, borders, text effects, and user interface
  9. 2-D/3-D transformations and animation
  10. Mobile content and formats
  11. XML and XHTML

Special Facilities and/or Equipment

1. A lecture room equipped with instructional computer, high resolution color monitor, software; projection system, and lighting suitable for displaying projected media. An integrated or separate facility with student workstation configurations to include hard drives, color monitors, mice, keyboards, and software.
2. When taught via Foothill Global Access: ongoing access to computer with JavaScript-enabled internet browsing software, media plug-ins, and relevant computer applications.

Method(s) of Evaluation

Methods of Evaluation may include but are not limited to the following:

Completed student projects
Participation in class critiques
Classroom discussions

Method(s) of Instruction

Methods of Instruction may include but are not limited to the following:

Lectures on technical and conceptual concepts in advanced website design and development
Discussion and critique of projects and representative media
Group discussions that address the creative problem solving process and technical concepts
Demonstration of advanced website design and development techniques

Representative Text(s) and Other Materials

Dean, John. Web Programming with HTML5, CSS, and JavaScript. 2019.

Types and/or Examples of Required Reading, Writing, and Outside of Class Assignments

  1. Example reading assignment: Chapter 4, How to work with Cascading Style Sheets
  2. Example writing assignment: CSS markup for one or more pages including inline comments explaining markup and design

Discipline(s)

Computer Information Systems or Graphic Arts