Calendar - Responsive Web Design

Week 1: Introduction and RWD Principles

Brief history of web design video, web standards and why responsive design is important, technology review, Introductory Class Survey.

Week 2: HTML Basics 1

HTML Basic Elements, CodePen Setup, Whiteboard exercise, Work on HTML Basics 1 Challenge

Week 3: HTML Basics 2

HTML Lists, Links, Images, Tables, Forms and Extra Markup

Week 4: CSS Part 1

Introduction to CSS, Work on CSS Basics 1

Week 5: CSS Part 2

CSS Basics 2, Line length and font size, Layout, CSS Box Model Video, Work on CSS Example In Class

// In Class Exercise Instructions

Week 6: Layout

Flexbox and floats, work on more CSS structures, start assignment in class

Week 7: Responsive Markup and Images

HTML 5 Markup, Web fonts, flexible images, responsive design using media queries, work on Fonts & Media Queries assignment

// In Class Exercise Instructions

Week 8: Mini Midterm Exam, Introduction to Project and Research

HTML & CSS Comprehension Quiz, Project Introduction and Groups, Research Basics, Work on Research Assignment, CSS Grid + Boxes & Layout Assignment

Week 9: Content Strategy & Sketching

Content strategy, sketching, information architecture, mobile-first design, work on content and sketching in class.

Week 10: Design Patterns and Style Prototyping

Design patterns, style tiles, style prototypes, work on style prototypes and static mockups in class

Spring Break

Relax!

Week 11: HTML Wireframing + Atomic Design Process

In-class style critiques from peers. HTML Wireframing, Atomic Design, responsive deliverables, identify components, work on wireframe structure in class

Week 12: Performance, Responsive Images and JavaScript

Advanced techniques including SVG, responsive images, performance testing and JavaScript

Week 13: Usability and Accessibility

Usability testing, device testing and accessibility considerations for web design.

Week 14: Pattern Libraries and Style Guides

Documenting styles using pattern libraries and style guides. If time, briefly discuss content management systems, print stylesheets, CSS preprocessors, reset stylesheets and responsive email.

Week 15: In-Class Usability Testing + Group Work Session

Finishing assignments in class and conducting testing.

Final Exam: Class Review Session

You will not have a formal final exam. Your final prototype and pattern library will act as your final. We'll do our presentations and critiques during the final exam period. Groups will complete mock client feedback sessions with the class, and the class will evaluate the sessions based on the project goals and usability testing results.