Tuesday, October 1, 2013

Chapter 6: Page Layout

Student Data Files:
http://media.pearsoncmg.com/aw/ecs_felke_webdevdesign_6/Student_Data_Files/felkeStudentDataFiles.zip

Today we're going to be working with Page Layout including the Box Model, Normal Flow, CSS Positioning, CSS Float, Two Column Page Layout, Hyperlinks in an Unordered List, CSS Interactivity with Pseudo-Classes, etc.

We are going to continue building our CSS skills in this chapter, working with page layouts, floating images, etc.

ASSIGNMENTS:
  • Begin reading Chapter 6: Page Layout
  • Work through the Hands-On Practice 6.1 (pp. 222-224)
  • Work through the Hands-On Practice 6.2 (pp. 224-226)
  • Work through the Hands-On Practice 6.3 (pp. 226-230)
  • Check out some of the "CSS Properties" in tables throughout this chapter -- there are some interesting properties that you can experiment with.
  • Work through the Hands-On Practice 6.4 (pp. 230-232) 
  • Work through the Hands-On Practice 6.5 (pp. 232-234) 
  • Work through the Hands-On Practice 6.6 (pp. 235-237) 
  • Work through the Hands-On Practice 6.7 (pp. 237-240)
  • Work through the Hands-On Practice 6.8 (pp. 240-242)
  • Work through the Hands-On Practice 6.9 (pp. 243-245)
  • Work through the Hands-On Practice 6.10 (pp. 246-247)
    • "Commenting out" sections of code is a great tip for finding where errors are happening.
    • Check out the "CSS Web Resources" (p.247)  You might want to add these to your bookmarked resource sites or on your blog.  If you have other suggestions, please share them with your classmates!
  • Work through the Hands-On Practice 6.11 (pp. 248-254)
  • Read the Focus on Web Design task (page 260).  In addition to searching the web for tutorials on CSS page layouts, I would also recommend searching YouTube (or other video sites).  Many people [myself included] are using video sites as a way to share free educational materials. 
  • Now for the Case Study projects... which will become "Two-Column" this week.  :)
    • Update your JavaJam Coffee House (pp. 260-264) site using the text instructions.
    • Update your Fish Creek Animal Hospital (pp. 265-268) site using the text instructions.
    • Update your Pacific Trails Resort (pp. 268-271) site using the text instructions.
    • Update your Prime Properties (pp. 272-276) site using the text instructions.
  • Now to the Final Project:
    • Update your Web Project (p. 276) using the text instructions.
OPTIONAL / RECOMMENDED ASSIGNMENTS:
  • Feel free to try out the HTML5 extensions with your Case Study projects.  They are optional, but HTML5 is definitely the "next big thing".
  • If you are feeling adventuresome, try out some of the Hands-On Exercises (1-10) on page259.  These exercises are meant to reinforce the techniques you have learned.  If you are still feeling a little unsure of yourself, this will probably help you.
  • If you have some "free time" try out the Apply Your Knowledge tasks on pages 256-258.

No comments:

Post a Comment