Categories
Langara Outlines

WMADD 4835 Outline

 

WMADD 4835 HTML / CSS 2
Credits: 3 Rooms: B014
Contact Info:
Kevin McMillan
Office A247b
604.323.5941		 Days & Times:
Spring 2017
Mondays, Jan 09 – April 03
1:30-230 (A247 lecture)
2:30–4:30 (A247 lecture)
430-630 (A110 lab)
Office hours by appointment

SKIP to Class Content

This class will cover HTML & CSS design and development, continuing on from the HTML / CSS 1 course of last semester.

Like anything in life, this outline is subject to occasional changes.

Throughout the term, I will add links to additional supporting content.

I want to make as much of your learning task-based, so nearly every week there will be problem-solving exercises to be completed in class or in the lab.

Learning Outcomes

Upon successful completion of this course, students will be able to

  • Use efficient HTML & CSS coding methods
  • Use CSS transitions & animations
  • Use JavaScript libraries such as jQuery
  • Use frameworks like Bootstrap
  • Use CSS Preprocessors
  • Rapidly prototype designs and code
  • Critique the code and designs of peers
  • Respond professionally to critiques of their code and designs
  • Use emerging methods of layout and interaction, while ensuring successful fallback for older devices and browsers

Textbook / Reference Material

We will use primarily online sources in the course. Here are a few:

A Good Online Guide To HMTL & CSS:
Shay Howe: Learn to Code HTML & CSS
Shaw Howe: Learn to Code Advanced HTML & CSS

Interactive jQuery Course
try.jquery.com

Lynda.com Videos
HTML5 Structure, Syntax, & Semantics
SASS Essential Training
jQuery for Web Designers
Bootstrap 3 Essential Training
Advanced Responsive Layouts With CSS Flexbox

An Excellent CSS Reference
CSS Reference.io

Another Excellent CSS Reference
Codrops CSS Reference

HTML5 Cheat Sheet
https://websitesetup.org/html5-cheat-sheet/

Course Structure

The class schedule is detailed below.

Techniques learned in one assignment or exercise will always be the starting point for subsequent ones. Be assured, therefore, that no lectures that can be easily missed.

It is your responsibility to make sure that you do not miss any announcements or course materials given in any class. Any additional announcements will be made via email to your mylangara accounts.

Assessments
Main Assignment March 23 20%
Quizzes 20%
Lab Exercises 20%
Midterm 15%
Final 25%

There is one major assignment for the course. It will be completed in stages, with each stage representing part of the total mark for the assignment. Part of it will involve working with classmates, and part will be solo work. More details will come soon.

Note, also, that dates listed are approximate. For example, we are now a week ahead because we took the extra class time that was freed up by the Instructor change in other classes.

Week 1: Jan 09 ( 4815 Review / Advanced Selectors )

  • 4815 Final Assignments & Exam Review
  • Advanced Selectors: Fela Kuti

Lab / Class Files

Week 2: Jan 16 ( CSS Transforms & Transitions )

Lab / Class Files

Links

Week 3: Jan 23 ( CSS Animation )

  • CSS Positioning: Static, Relative, Absolute, Fixed, z-index
  • CSS Transforms
  • CSS Transitions

Links

Lab Exercise

Week 4: Jan 30 ( Transitions & Animation 2)

  • Test Number 1
  • CSS Transitions
  • CSS Animation
  • Changing Classes with JavaScript

Lab Exercise

Homework

  • for the class after reading week, please complete Levels 1-5 of try.jquery.com.

Week 5: Feb 06 (jQuery 1)

  • Test Number 2
  • Selectors
  • Filters
  • Traversal
  • Document Manipulation

References

Class Exercise

Week 6: Feb 13 ( Reading Week )

No class: Reading Week

Week 7: Feb 20 ( jQuery 2 )

  • Events ( Mouse, Keyboard )
  • Conditions
  • Loops
  • jQuery Plugins

Class Exercise

Week 8: Feb 27  ( Forms )

  • Test Number 3
  • Advanced Forms HTML 5
  • WP Post Edit / Dashboard Design
  • Form Validation

Links

Week 9: Mar 06 ( FlexBox )

  • Display: Flex
  • Rows & Columns
  • Wrapping, Aligning, Reversing
  • Exceptions
  • Browser Support

Links

Lab Exercise

Midterm / Midterm Exercise

Course content change: I am dropping SASS & Bootstrap. Mar 16 & 23 will be labs for you to work on the final assignment.

Week 10: Mar 13

  • Schedule Review & Course Change
  • Midterm Discussion & Remedy
  • Modernizr
  • HTML5 Shiv
  • Cross Browser Testing
  • Live Debug in Simulator
  • Final Assignment Discussion

Links

Week 11: Mar 20 ( Work Day )

Week 12: Mar 27 ( Work Day )

Week 13: April 03 Work Day

  • Final Site Due By Midnight