Week 6: 10/4 + 10/6

This week is much like last week: we will be doing more work on the Portfolios, writing the HTML and CSS to turn your wireframes into actual web pages. We will also talk about design and work on color and typography for the sites. Along the way you will learn some Git basics and work with GitHub.

The difference is that hopefully you are a bit further along with your projects and have specific questions for me.

Before Class: LEARN


  • Fill out the Project Status Form
  • Work on your project. Roughly in this order
    1. wireframes complete
    2. create HTML for each page of your site. Focus on elmeents for the major sections of your page. It’s OK if you don’t get all of the paragraphs, lists etc.
    3. Make sure to determine your sitewide header and footer. You can put off the navigation for now, but leave at least a <nav> element.
    4. write the CSS for the small (mobile) layout from you wireframes
    5. use media queries to create the other layouts
    6. Complete the content for each page.

In case you need it, here are videos I put up from last week:

  1. Installing VS Code and Git [5m 40s]
    1. If you already have them installed you don’t have to watch this one
  2. Creating a Repository on GitHub and cloning it in VS Code [4m 25s]
  3. Adding basic files and folders [3m 32s]
    1. this shows how to do what’s in the bullet points above.
  4. Starting to convert wireframes to HTML and CSS [11m 49s]
    1. This is optional. We’ll be working on this on Monday, but you can get started ahead of time.



The Join link is the same for all live sessions. There is a registration form and a waiting room to help avoid bombing. View Live Sessions below for more info

Live Sessions

Session 1: CSS-Ready Project

Monday, October 4 at 7:30p–9:10p

In this class I want you all to get your projects ready for CSS. This means writing HTML for all of the pages for your site. Some of you are part of the way there but I think everyone could do with some more attention to their HTML.

Topics for Class Session

Session 2: Responsive Design

Wednesday, October 6 at 7:30p–9:10p

Based on how we progress on Monday, I’ll update this page.

Topics for Class Session

After Class:

After Monday

  • Complete the the Project Status Form. You must do this if you haven’t yet. You can do it again if things have changed a lot.
  • Push your changes to GitHub.

After Wednesday

Reminder that there will be no class on Monday, October 11.

Leave a comment