Assignment 2: Chapter 2

Read and work your way through Chapter 2. Do all the examples, bring your questions to class or email me throughout the week. If it has not been mentioned already, the book will walk you through building a basic website which starts in this Chapter. So any exercises regarding the “bubble under website” be sure to complete and I will review BOTH your weekly progress AND the final result of the bubble under website along with your other assignments. We will review Chapter 2 for next class.

Review of Chapter 2

Understand document hierarchy, as in your “heading” tags (<h1>, <h2>, etc.). The book did not mention this, but typically and for reasons related to Search Engine Optimization (S.E.O), you should only have one tag per page.

One way to think of HTML is to think of “putting square pegs into square holes, and round pegs into round holes.” Your content will give you a clue on what an appropriate tag will be. Lists go with the HTML list element. Charts will use HTML tables. And now with HTML 5, footers will use the HTML footer, navigation will use the HTML nav element, and so on. Along with this, be sure to understand block level elements.

• Here is a simple diagram of basic HTML elements, their hierarchy and how they fit into one another  (be sure to hit “next” at the bottom of this page).
• Here is one for HTML 5 with some good explanations of elements.
• Here is an HTML 5 flow chart to help you decide what elements to use.

I want to emphasize no sharing of IDs. IDs indicate a parent element, and classes can be repeated to specify multiple elements. This will become very important for CSS.

Understand the concept of “Nesting.” This gets people every time, so be sure to create closing tags IMMEDIATE after creating the opening tag, indent your code and use comments to define closing tags. This will help a little bit. Beyond, that, just watch what you are doing and take your time. If your tags are out of order, unexpected results can and will happen, especially with CSS. And depending on how long your code is, it could be a real pain to try and fix.

Avoid using too many <div> elements. In fact, challenge yourself to use them as a last resort. HTML comes fairly well equipped. For example, the list element has a <li> tag (the parent element) and then contains <li> elements (child elements). You can style the <ul> element and treat it like a parent element; usually no need for a containing <div> element.

Linking HTML pages is where some people start to fall off the wagon. Make sure you have a grip on this before we move on and work with me if you need it.