Governor's Career & Technical Academy Arlington

Web Design & Development: Week 3

WebDev


Overview

Now that we have our development environments set up and have practiced our web development workflow, this week we dive into learning HTML.

For the next few weeks, we will use Head First HTML and CSS, 2nd Edition as our resource, which is available to you as an NVCC student. Log in to MyNOVA and look for the application name Quick Search Library Catalog - NOVA. Search for Head First HTML and CSS, and the first link that appears is the book we want.

Resources to accompany the book are available here.

Friday, September 15th

Classwork

We will spend the class period completing Chapter 2: Meeting the HT in HTML.

Please finish this work by the end of the class period so that I can begin evaluating your websites at the end of the day.

Homework

Study chapters 1 and 2, with a particular focus on the vocabulary I listed, to prepare yourself for a quiz in class on Tuesday. You can bring one sheet of 8 1/2 by 11 inch paper with notes on the front and back, to use during the quiz.

Evaluation

Your evaluation for week three will be based on the Head First Lounge and Starbuzz Coffee websites along with a commit history showing your development process.

Wednesday, September 13th

Classwork

During class, add another directory in your git repository named StarbuzzCoffee, and create a homepage for it as presented at the end of Chapter 1: The Language of the Web.

We will also begin adding validation links in a footer element at the bottom of our pages.

Homework

Start reading Chapter 2: Meeting the HT in HTML, completing the projects presented as you go. Come to class Friday with any questions you have on what is presented in the chapter.

By the time you finish this chapter, you should be familiar with the following vocabulary:

  • web server
  • web browser
  • HTML
  • HTML comment
  • HTML element
  • HTML tag
  • HTML content
  • HTML style element
  • style element
  • CSS
  • Color hex codes
  • hypertext
  • link element
  • attribute
  • attribute-value pair
  • href attribute
  • directory and subdirectory (a.k.a. folder)
  • path

Monday, September 11th

Classwork

Read Chapter 1: The Language of the Web from Head First HTML and CSS, 2nd Ed.. We will talk in class about how to read a book like this - but in short, you should read everything, and think about all the questions asked, and try out the examples. This isn't a novel, it is a technical book containing information on how to use the languages of the web.

Homework

Create a subdirectory in your git repo named HeadFirstLounge and put the page introduced in the chapter under the top level heading Welcome to the Head First Lounge into a file named index.html.

You will need the image file, drinks.gif, which you can get here. Put this image in a subdirectory named images inside the HeadFirstLounge directory.

Shout Outs

Shout outs to Alex E., Chase, Johan, William, Henry, Marin, Kate, Grant, Jake, Anupama, Mia, Olive, Blu, and Lary for making a solid start on building their websites.