Interactive Design

Introduction to Front-End Web Design & Development

Calendar

• January 18, First day of class
• Introductions, Hello World. Hello Class. Hello HTML., and Markup & Style, Content & Context
• January 25
• February 01
• February 08
• February 15
• February 22
• March 01
• March 08, No class, Arts and Sciences Spring Break
• March 15
• March 22
• March 29
• April 05
• April 12
• April 19
• April 26, Last day of class

Notes

• 14 weeks
• 12 weeks of web design and development, excluding the first and the last day of class
• 3 projects, 4 weeks for each project
• Every Wednesday, in class; with lecture, demonstration, and work time
• Office hours, 1 hour before class (email or Slack to schedule a 1:1) and throughout the week via Slack
• Slack team: id-sp17-ec

Projects

1. Markup & Style

• Fundamentals of structural (HTML 5.2) and presentational (CSS 2.1/3) semantics
  • Sections, Grouping, and Text; Tables and Forms
  • Type, Color, and Layout
• 3-part introductory project
  1. Context & Content
  2. TBA
  3. TBA

2. TBA
3. TBA

Markup & Style

Content & Context

Brief

Choose a recipe, markup and style the content.

Extra credit (optional) — Bake, cook, or prepare your recipe and photograph the process and/or final result for later use.

Focus

• Sections, Grouping, and Text
• Type, Color, and Layout

Readings & Resources

• HTML Basics
• HTML Content
• CSS Basics
• CSS Text
• CSS Box Model
• HTML5 Element Index

Tools

Text Editors

• Atom
• BBEdit
• JS Bin (online)

Image Optimization

• ImageOptim
• SVGOMG

Code Validation

• HTML Validation
• CSS Validation

Caps, Spelling, and Grammar

• TitleCap (Automatically Capitalize Your Title)
• Polish My Writing

Resources

• W3Fools
• The Mozilla Developer Network
• HTML5 For Web Designers
• CSS & HTML Vocabulary
• HTML5 Doctor
• Learn to Code HTML & CSS
• Marksheet
• Code Guide