Course Schedule 2018

Required Book for 2018: 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.

Nothing completed after the deadline will count.

The videos for this course are on YouTube.

[ Updated October 12, 2018 ]

This is the week-by-week outline for fall 2018. 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: Aug. 22–31

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

  • Text editors: Use Atom.
  • Web browser: Use Chrome. Always.
  • DO NOT USE Windows Notepad or Mac TextEdit. DO NOT even think about using a WYSIWYG application such as Dreamweaver. Here is why.

Week 2: Sept. 2–8

  • 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: Sept. 9–15

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

Week 4: Sept. 16–22

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

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

Week 5: Sept. 23–29

  • 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: Sept. 30–Oct. 6

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

This is a big week.

Week 7: Oct. 7–13

  • 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: Oct. 14–20

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: Oct. 21–27

Introduction to Highcharts, a JavaScript library for mobile-friendly interactive charts and graphs (see also Highcharts Demo page).

Week 10: Oct. 28–Nov. 3

HTML forms. Design and layout for forms and quizzes. JavaScript and forms.

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 (2018).

Week 11: Nov. 4–10

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

Introduction to jQuery and the DOM.

Week 12: Nov. 11–17

jQuery part 2: Interactive image displays, content overlays, accordions and menus.

HTML 5 audio and video embeds, formats.

Week 13: Nov.18–24

Thursday is Thanksgiving. Lecture meets Tuesday AS USUAL. Attendance counts.

No quiz. No labs. No Friday workshop hours.

Week 14: Nov. 25–Dec. 1

Producing interactive maps.

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

Week 15: Dec. 2–5

Project work in lab. No quiz. No Friday workshop hours.

NOTE: Dec. 4 and 5 are normal class days. If you are not present, it will count as an absence.

Workshop hours: Dec. 7 from 1 to 4 p.m. in Weimer 3020. This will be your last chance to meet with me about the project.

Project Due Date

All projects are due on Monday, Dec. 10, at 11:59 p.m. That is the Monday of finals week. You will post your project on your own website—NOT in GitHub.

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