GID 77: ADVANCED WEBSITE DESIGN & DEVELOPMENT
Foothill College Course Outline of Record
|Hours:||3 lecture, 3 laboratory per week (72 total per quarter)|
|Advisory:||GID 56 and 57.|
|Degree & Credit Status:||Degree-Applicable Credit Course|
|Grade Type:||Letter Grade (Request for Pass/No Pass)|
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
The student will be able to:
A. Develop a sound plan for converting an existing website using xhtml/CSS to HTML5/CSS3, and/or develop a new website using HTML5/CSS3.
B. 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.
C. Demonstrate a working knowledge of the use and advantages of webpage design using CSS3 over CSS, including enhanced layout for both Web designer and programmers, especially formats that allow webpages to look more like traditional print and page layout.
D. 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.
E. Demonstrate basic use of XSLT in rendering XML content.
A. 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
B. HTML5 tags and attributes
1. New symantic/structural elements
2. New media elements
3. New form elements
4. Local Storage
5. Web Socket
6. Drag and drop
7. Geo location
8. Server Sent Events
C. CSS3 Modules
2. Box Model
3. Backgrounds and borders
4. Text Effects and User Interface
5. 2D/3D Transformations
7. Multiple Column Layout
D. 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
E. 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
A. Semantic/structural tags
B. Form and input tags
C. Media tags
D. Drag/Drop, geo location, local storage
E. Server Sent Events and Web Sockets
G. CSS3 selectors and box model, multiple column layout
H. Backgrounds, borders, text effects, and user interface
I. 2D/3D transformations and animation
J. Mobile content and formats
K. XML and xhtml
Special Facilities and/or Equipment
B. When taught via Foothill Global Access: on-going access to computer with java-script enabled Internet browsing software, media plug-ins, and relevant computer applications.
Method(s) of Evaluation
A. Completed student projects
B. Participation in class critiques
C. Classroom discussions
Method(s) of Instruction
A. Lectures on technical and conceptual concepts in advanced website design and development.
B. Discussion and critique of projects and representative media.
C. Group discussions that address the creative problem solving process and technical concepts.
D. Demonstration of advanced website design and development techniques.
Representative Text(s) and Other Materials
Ruvalcaba, Zak. Murach’s HTML5 and CSS3. Murach, 2015.
Types and/or Examples of Required Reading, Writing, and Outside of Class Assignments
A. Example of required reading assignments:
1. Chapter 4, How to work with Cascading Style Sheets
B. Example of required writing assignment:
1. CSS markup for one or more pages including inline comments explaining markup and design