Topic	Assignments/Reading:	Due and In Class Work
Tuesday Crit HTML structure review	Masthead Image (Site for all Seasons) - Fireworks: Due Week 5, Tuesday, 3/24 Masthead image is part of Site for All Seasons: Newsletter Project Assignment: Creating Masthead Image in Fireworks or Photoshop. Site for All Seasons: Newsletter Project Entire site due Week 7, Tuesday, 4/7 Continue Working on Site for All Seasons: Newsletter Project Mood Board: Due Thursday, Week5, (3/19). Masthead image: Tuesday, Week 5, (3/24) Completed Botanical Garden Newsletter site: Tuesday, Week 7, (4/7) Project Assignment: newsletter site-for-all-seasons.pdf	Xtreme Resume due Crit & review HTML structure & common problems with resume code. IntroSite for All Seasons: Newsletter Project Be a sponge (pdf) - Jon Hicks, what is a mood board? Begin Positioning: Box model review, normal page flow, float, relative, absolute, and fixed positions. Margin collapse. Clearing floats. positioning.pdf positioning-tutorial.zip
Thursday   Positioning	Assignment: Continue Project (newsletter site-for-all-seasons.pdf) Masthead Image (or full newsletter site comp) Due Tuesday, next week, (3/24) See Projects for details	Due: Mood Boards, birth month "season" colors and feelings for the choosen topic of your newletter. In class: continue work on positioning tutorial: margin collapse, relative and absolute positioning, floats.

Glossary of Terms (from http://www.maxdesign.com.au):

The viewport

The viewport is the window or viewing area that displays web pages. When the viewport is smaller than the web page, scroll bars should be available. Example: viewport

The initial containing block

The initial containing block is the entire width and height of your web page - including parts of the page that are outside the viewport. Example: initial containing block

Containing blocks or containing boxes

A containing block is a box or block that contains other elements (descendant boxes). An element's containing block means "the containing block in which the element lives". Example: several paragraphs within a containing block

Block-level elements and block boxes

Block level elements (or block boxes) are elements that are formatted visually as blocks. For example, a paragraph of text: * Example: block level element

Inline-level elements and inline boxes

Inline elements are elements that do not form new blocks of content; the content is distributed in lines. For example, an emphasized piece of text within a paragraph: Example: inline element

Normal flow

Normal flow is the way a document will display if you had no positioning or floating applied to elements. The content will flow down the page, starting with the first element in your document and finishing with the last element in your document. Example: content in normal flow

Out of normal flow

When a box is taken out of normal flow, all content that is still within normal flow will ignore it completely and not make space for it. Example: content out of normal flow

Static positioning

A statically positioned box is one that is in normal flow (see above).

Float positioning

A floated box is positioned within the normal flow, then taken out of the flow and shifted to the left or right as far as possible. Content may flow along the side of a float. More about floats.

Relative positioning

Relatively positioned elements are positioned within the normal flow and then moved. Elements that come after a relatively-positioned element behave as if the relatively-positioned element was still in its ‘normal flow’ position - leaving a gap for it. Example: relatively positioned content

Absolute positioning

An absolute positioned box is moved out of the normal flow entirely. Example: absolutely positioned content

Fixed positioning

Fixed positioned elements are moved out of the normal flow entirely - relative to the viewport. This means that they don't move if the page is scrolled. Win/IE5 and Win/IE6 do not support this positioning method at all. Example: fixed positioned content