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.
[ Updated November 6, 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
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
- Read Robbins Chapters 11 and 13
- Videos 15–18
- Quiz 3
- Assignment 3 (at GitHub)
- Optional read: How GitHub Conquered Google, Microsoft, and Everyone Else (Wired, March 2015)
- Resource (optional): GitHub Guides — Hello World (a clear guide to using GitHub)
Introduction to CSS: Overview, selectors, colors, backgrounds, DIVs, pseudo-classes.
Week 5: Sept. 23–29
CSS part 2: Margins, padding, borders, units of measurement, box model, box-sizing. CSS flexbox.
Week 6: Sept. 30–Oct. 6
- Read Robbins Chapters 16 (pages 447–484), 12 (all) and 17 (all)
- Videos 29–32
- How to choose and use Google fonts (video)
- Quiz 5
- Assignment 5
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.
- Quiz 6
- Assignment 6
Introduction to Repl.it.
Week 8: Oct. 14–20
- No reading from the textbook.
- Read “Algorithmic thinking: The key for understanding computer science”: http://bit.ly/algo_think
- Watch What is an algorithm and why should you care? (Khan Academy video, 5 min. 27 sec.)
- Quiz 7
- Assignment 7
Week 9: Oct. 21–27
- Data Visualization 101: How to Choose the Right Chart or Graph for Your Data — It’s important for your assignment that you understand that certain chart types are entirely inappropriate for some kinds of data. Choosing the wrong chart type will severely impact your grade on Assignment 8.
- Adding Charts to Your Site with Highcharts — This tutorial walks you through how to work with Highcharts.
- Pie Charts: The Worst Chart in the World — This could also impact your Assignment 8 grade.
- JSON: What It Is, How It Works, & How to Use It — Please don’t panic when you see this; it is just an explanation of what you will see already written out for you in the Highcharts code.
- Quiz 8
- Assignment 8
Week 10: Oct. 28–Nov. 3
- Read Robbins Chapter 9 (forms)
- Read my Bootstrap 4 Introduction
- Watch the Bootstrap videos on my 2 Lynda.com playlists (sign in to Lynda.com here), which are linked in my notes about those Lynda.com videos
- Quiz 9
- Assignment 9
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
- 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 jQuery and 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 jQuery and upload it to your new site. The assignment requires you to use jQuery to manipulate the images on an HTML page.
Week 12: Nov. 11–17
- Read Robbins chapter 10, Embedded Media — only the section headed “Video and Audio,” pages 219–228
- Access to music files: How to get free legal music downloads
- Read: Your website, week 2
- Codecademy: Learn jQuery (interactive lessons) — 2 modules, “Learn jQuery: Style Methods” and “Learn jQuery: Traversing the DOM”
- Quiz 11
- Assignment 11
jQuery part 2: 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.
Week 13: Nov.18–24
* * * Project proposals due SUNDAY night.
Thursday is Thanksgiving. Lecture meets Tuesday AS USUAL. Attendance counts.
No quiz. No labs. No Friday workshop hours. All you need to do this week is submit your project proposal ON TIME on Sunday, and come to lecture on Tuesday.
Note, I might have said Monday in class in October, but then I realized I have to read all your proposals between the deadline and our lecture on Tuesday morning. Therefore, the deadline is most definitely Sunday night.
Week 14: Nov. 25–Dec. 1
- Read: Creating an Interactive Map with Leaflet and OpenStreetMap, by Andy Maloney
- Read: Introduction to Leaflet.js
- Quiz 12
- Assignment 12
Producing interactive maps. In the assignment, you will create an original map and embed it into an HTML page.
* * * Student project presentations during lab.
Week 15: Dec. 2–5
Project work in lab. No quiz.
NOTE: Dec. 4 and 5 are normal class days. If you are not present, 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 last week.
* * * Student project presentations during lab.
Workshop hours: Dec. 7 from 1 to 4 p.m. in Weimer 3020. This will be your last chance to meet with me about your final 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.