Link to EngineeringLink to ArchitectureLink to Print MediaLink to Web MediaLink to Audio/Visual DesignGame Development

Unit 1: The Elements and Principles of Good Web Design

Learning Targets

  1. I can implement the essential principles for good web design into an aesthetically pleasing and functional website layout.
    Still Developing Approaching Mastery Mastery Exceeds Mastery
    I can implement a few of the essential principles for good web design into a website layout. I can implement some of the essential principles for good web design into a functional website layout. I can implement the essential principles for good web design into an aesthetically pleasing and functional website layout. I can implement the essential principles for good web design into an aesthetically pleasing and functional website layout that resembles the work of a professionally designed website.

  2. I can use the 960 grid system to create a complex website layout to organize content and allow users to distinguish between different types of information in a clear manner.
    Still Developing Approaching Mastery Mastery Exceeds Mastery
    I can use the 960 grid system to create a simple website layout. I can use the 960 grid system to create a simple website layout to organize content and allow users to distinguish between different types of information. I can use the 960 grid system to create a complex website layout to organize content and allow users to distinguish between different types of information in a clear manner. I can use advanced features of 960 grid system to create a complex website layout to organize content and allow users to distinguish between different types of information in a clear manner. I can adapt my knowledge of the 960 grid system to master other grid systems.

  3. I can add a complex and customized webpage component using widgets to add functionality to a webpage.
    Still Developing Approaching Mastery Mastery Exceeds Mastery
    I can add the lightbox css and javascript to a webpage. I can add and configure the lightbox css and javascript to an image on a webpage. I can add and configure the lightbox css and javascript to an image gallery on a webpage.
    I can add and configure the lightbox css and javascript to more than one image gallery on a webpage and I can include descriptions.

  4. I can design, develop, and test a product that meets a specific list of requirements and demonstrates proficiency in the use of the elements and techniques of the technology.
    Still Developing Approaching Mastery Mastery Exceeds Mastery
    I can design, develop, and test a product that meets some aspects of a specific list of requirements and demonstrates proficiency in the use of some of the elements and techniques of the technology. I can design, develop, and test a product that partially meets a specific list of requirements and demonstrates proficiency in the use of most of the elements and techniques of the technology. I can design, develop, and test a product that meets a specific list of requirements and demonstrates proficiency in the use of the elements and techniques of the technology. I can design, develop, and test a product that meets a specific list of requirements and includes innovative work and demonstrates analysis of the elements and techniques of the technology.

Resources

  1. The 9 Essential Principles for Good Web Design Presentation
  2. The 960 Grid System Presentation
  3. The 960 Grid System
  4. The Box Model
  5. Lightbox
  6. Typetester
  7. CSS Matic

Assessments

  1. 9 Essential Principles Activity
  2. 960 Grid System Activity
    1. Download Files
  3. Lightbox Activity
  4. Challenge: Image Gallery