Course Schedule 2020

Required Book: Learning Web Design (5th edition), by Jennifer Niederst Robbins. O’Reilly, 2018 (at Amazon). You must have this book. NOTE that this new edition has MANY changes. DO NOT get the 4th edition.

Nothing completed after the deadline will count.

The videos for this course are on YouTube.

[ Updated May 6, 2020 ]

This is the week-by-week outline for fall 2020. Weekly topics are subject to change.

Quizzes: The readings covered on a quiz are listed under the same week as that quiz.

DEADLINES for all quizzes and assignments are in Canvas.

Week 1

Introduction to the course. Topics: Web design and development. Tools, technologies and outcomes.

Week 2

  • Read Robbins Chapters 1, 2 and 4. These readings are on Quiz 1. (Check in Canvas for pages you can skip.)
  • Readings are to be completed before class meets. Always.
  • Note the quiz and assignment deadlines in Canvas.
  • Videos 2–6
  • Quiz 1
  • Assignment 1

Roles of HTML, CSS, JavaScript. Web browsers, client/server, request/response.

Introduction to HTML: structure, markup, images, links.

Week 3

HTML part 2: Text markup, lists, links, images. Block vs. inline elements.

Week 4

Introduction to CSS: Overview, selectors, colors, backgrounds, DIVs, pseudo-classes.

Introduction to GitHub. This 45-second video is recommended!

Week 5

  • Read Robbins Chapters 14 (all) and 16 (up to page 447).
  • Videos 19–28
  • Quiz 4
  • Assignment 4

CSS part 2: Margins, padding, borders, units of measurement, box model, box-sizing. CSS flexbox.

Week 6

Introduction to CSS grid. Web fonts, including Google fonts. Em, rem and percentages. Handling typography. Introduction to responsive design.

Week 7

  • Read Robbins Chapter 21, pages 593–598 only.
  • JavaScript Beginners videos 1-18 (super short videos)
  • Codecademy: Introduction to JavaScript (interactive lessons): “Introduction to JavaScript”; “Variables”; “Control Flow”; “Arrays”
  • Quiz 6
  • Assignment 6

JavaScript introduction: Variables, numbers and strings, Booleans, basic math, if-statements, arrays.

Introduction to

Week 8

JavaScript part 2: Functions (arguments and returns), scope of variables, for-loops, while-loops and arrays. Defining problems, problem breakdowns, writing pseudo code.

Week 9

Introduction to Highcharts, a JavaScript library for mobile-friendly interactive charts and graphs (see also Highcharts Demo page). You will be embedding two different JavaScript charts in an HTML page for your assignment.

Week 10

HTML forms; design and layout for forms and quizzes; JavaScript and forms. You will make an HTML form for a fun quiz this week, and JavaScript will handle the quiz answers.

Introduction to Bootstrap, a Web framework. Simplifies the whole process of making responsive pages, especially when forms are used. All Bootstrap materials have been updated for Bootstrap 4.

Week 11

  • Read Robbins Chapter 22
  • Codecademy: Learn jQuery (interactive lessons) — 3 modules, “Introduction to jQuery: jQuery Setup”; “Learn jQuery: Effects”; “Event Handlers: Mouse Events”
  • Quiz 10
  • Assignment 10

Set up your domain at Reclaim Hosting (students/individual).

Introduction to the DOM. In addition to setting up your hosted web space this week, you will create a one-page project with images, HTML, CSS and JavaScript and upload it to your new site. The assignment requires you to use JavaScript to manipulate the images on an HTML page.

Week 12

More JavaScript: Adding and removing CSS styes. Traversing the DOM. Interactive image displays, content overlays, accordions and menus.

HTML 5 audio and video embeds, formats. This week’s assignment has you both editing audio AND embedding audio files into an HTML page so that people can play the audio.

Thanksgiving Week

Neither the lecture nor the lab meets Thanksgiving week.

Week 13

Producing interactive maps. In the assignment, you will create an original map and embed it into an HTML page.

Introduction to Leaflet, a JavaScript library for mobile-friendly interactive maps.

* * * Student project presentations during lab.

Week 14

Project work in lab. No quiz.

* * * Student project presentations during lab.

Workshop hours: Last Friday before finals week — from 1 to 4 p.m. in Weimer 3020. This will be your last chance to meet with me about your final project.

Week 15

Project work in lab. No quiz.

NOTE: The last two class days in December are normal class days. If you are not present in your lecture or lab, it will count as an absence. You are expected to attend lab this week at least to listen to the presentations, even if you gave yours already.

* * * Student project presentations during lab.

Workshop hours: Last Friday before finals week — from 1 to 4 p.m. in Weimer 3020. This will be your last chance to meet with me about your final project.

Final Project Due Date

All projects are due on the Monday of finals week, at 11:59 p.m. You will post your project on your own website.

  • Post your project’s URL in Canvas by the deadline.
  • This URL is on your own website.