GRDSN 112: Design Technology II

Project : Online Portfolio

Terminology: Screen Capture, Navigation, Web Safe Colors, Run Length Encoding, 
Resources: HTML 4: Visual Quickstart
Exercises: FTP, Creating Buttons with Tables, Seamless Background Images, Coloring Table Cells


Performance Objectives: (Things you will be able to learn...) and Criteria (This is how well it has to be done...)


Instructions: Select a score for each outcome below based on the following scale..

0= No exposure, experience or knowledge in this area. Cannot perform any part of the task at a level sufficient for participation.
1= Can do most parts of the task. Demonstrates partial understanding of the competency. Need instruction and/or supervision.
2= Can complete the task with limited supervision. Demonstrates a very good understanding of the competency.
3= Demonstrates excellent understanding of the competency. Can work independently without supervision.
4= Can teach the competency / skill to others.

  1. Create a screen capture of the browser window to use when creating your rough designs and navigation structure
    1. Capture the browser window using Mac OS screen capture

      0 1 2 3 4

  2. Create tables for use as grid structures by:
    1. creating a table by writing html
    2. creating a table using Dreamweaver
    3. creating a table using ImageReady slicing

      0 1 2 3 4

  1. Demonstrate appropriate software techniques for developing web pages by...
    1. Creating a rough layout using Photoshop/ImageReady
    2. Composing the web page using ImageReady/Dreamweaver

      0 1 2 3 4

  2. Create web pages that will display page width
    1. on an 1024 x 768 pixel monitor
    2. within the live area of both  Explorer and Firefox browser windows
    3. on both MAC and PC platforms
    4. work with your monitor set at 1024 x 768 pixels and colors set to "thousands"
    5. Design images  using web safe colors whenever possible. Images will use web safe colors whenever a choice is available; some continuous tone images may use adaptive color palettes.

      0 1 2 3 4
  3. Design images to take advantage of Run Length Encoding / Compression by...
    1. creating artwork that has horizontal changes in color. This will create a more compressed image (small file size). 
    2. creating artwork that has large areas of flat color
    3. creating non-complicated line art and non-dithered images

      0 1 2 3 4

  4. Organize files and use correct web file formats / extensions by...
    1. avoiding complex naming conventions
    2. saving graphic files in gif and/or jpeg formats
    3. using .gif, .jpg or .htm extensions
    4. avoiding the use of capitals, punctuation marks and spaces in filenames (use underscore (shift +dash) to separate words

      0 1 2 3 4

  5. Create small file sizes so web pages load quickly by...
    1. using hexadecimal colors in tables and backgrounds
    2. reducing the number of colors when possible (using the web, adaptive or exact palettes when saving gif files)
    3. using compression / quality controls to improve file size reduction when saving jpeg files

      0 1 2 3 4
  6. Produce colored text and table cells to...
    1. add interest 
    2. specify colors for body text, visited links, active links
    3. to create navigation buttons using tables

      0 1 2 3 4

  7. Use ALT, WIDTH and HEIGHT attributes in the IMG tags to make the images load faster and to alert a person that has turned off images what the image is

    0 1 2 3 4

  8. Create background tiles, patterns and/or full screen backgrounds that add interest and load quickly

    0 1 2 3 4

  9. Create indexed color images and transparent artwork by...
    1. using the appropriate dithering options
    2. selecting a single color level to be transparent
    3. saving the file in the gif file format

      0 1 2 3 4

  10. Create links, rules, buttons and bullets using html to organize information and aid in readability / navigation

    0 1 2 3 4

  11. Create web pages that load in 15 seconds or less on a 28.8 bps modem by checking download time using a website service or computer software

    0 1 2 3 4 |

  12. Create and incorporate rollovers within your site to help users navigate:
    standard rollovers, pointer rollovers or multiple event rollovers

  13. Be productive and use studio (class) time effectively by...
    1. showing up to all class meetings
    2. determining when the project is due
    3. using a calendar to set specific goals
    4. use time wisely to get the job done

      0 1 2 3 4


 

 

 

 


 

Suggestions for improvement:

Last Updated: 3/05/04