IDCC 370: Web Design I   Spring 2008

Check this out:
The latest grades are posted in the grade gallery, sorted from high to low. Remember to find your grades using the ID key I explained in class on Monday.

Here are the Web design terms and concepts for Monday, March 28:

1. eye candy (not concerned with functionality only with aesthetics)
2. aesthetics
3. dingbat
4. glyph
5. icon
6. iconography
7. iconic system
8. DHTML = HTML + JavaScript + Cascading Style Sheet (CSS) rules
9. global navigation text (page bottom)
10. redundant navigation systems
11. affordance (low, medium, and high)
12. visual cues
13. Fitts' law
14. breadcrumb trail, AKA path analysis
15. horizontal hierarchy or page/folder nesting
16. shallow versus deep site information architecture

These terms, remember, arose in our discussion of the tutorial Navigating the WWW. Be sure to master all the terms and concepts in that tutorial as well as those listed here. E-mail me if you have any questions: wbuchholz@bentley.edu.

You should start making your corrections now on Assignment One. Continue working on Assignment Two as well. Remember, the assignment is due Wednesday, April 6 at classtime.

Check this out:
Here is a list of the Web design terms and concepts we covered in class on Wednesday, March 23:

1. recursive hyperlinking (recursion) with thumbnail call
2. roundtripping
3. hyperlinking visual cues (image border, hand, tooltip, blue underline (link), maroon underline (visited link), red underline (active link), and image swap)
4. browser chrome

You should be comfortable with all the tools in FrontPage that help you to create a thumbnail and optimize a "called" JPEG that sits on a page containing analytical commentary, evaluation, and discussion. Remember to review this example of hyperlinking recursion.

Questions? E-mail me at wbuchholz@bentley.edu.

Check this out:
Here is a list of the Web design terms and concepts we covered in class on Monday, March 21, while examining the tutorial on Tables: Key to Design Control. Note that many terms and concepts appearing in the tutorial are not in this list. You should be able to define and offer examples of all the terms and concepts covered during the entire class period.

1. page openness, white space, allowing the page to breathe
2. information overload, crowded elements
3. site map
4. navigation (nav) menu
5. upper-level navigation categories
6. upper-level navigation labels
7. 2nd-tier navigation
8. architecture of the page (page architecture)
9. "the way the page is built"
10. left-leaning symmetry (elements: color, graphics, text, hypertext, and the like)
11. right-leaning symmetry (elements: color, graphics, text, hypertext, and the like)
12. high scannability (heads (H1), subheads (H2, H3), graphics placement, listed items (ordered and unordered), color (light, medium, dark, balance), page layout)

Remember, with the terms and concepts covered thus far in class, you are well on your way to being equipped for assignment 2. If you do not understand any of these terms, need more information about them, or are unsure about how to proceed with assignment 2, be sure to email me at wbuchholz@bentley.edu

Check this out:
Here is a list of the Web design terms and concepts we covered in class on Wednesday, March 9. You should be able to define these terms and offer examples.

1. image map
2. landscape orientation
3. portrait orientation
4. image splicing
5. overlaid hotspots with tooltips
6. page created on the fly
7. vector graphics
8. raster, bitmap graphics

If you do not understand any of these terms, or need more information about them, be sure to email me at wbuchholz@bentley.edu

Check this out:
Here is a list of the Web design terms and concepts we covered in class on Monday, March 7. You should be able to define these terms and offer examples.

1. Web optimization; optimizing for the Web; optimization process
2. jpeg (or jpg) compression; quality = high; information loss; lossy format
3. KB = KiloByte = 2 to the 10th (2 x 2 x 2 x 2 x 2 x 2 x 2 x 2 x 2 x 2) = 1024 bytes
4. 2 x 2 = 4 x 2 = 8 x 2 = 16 x 2 = 32 x 2 = 64 x 2 = 128 x 2 = 256 x 2 = 512 x 2 = 1024
5. .bmt (11MG, 1 megabyte = 1,048,576 -- 2 to the 20th-- bytes) is over 58 times larger than an 18KB .jpg (Winston)
6. GIF (Graphics Interchange Format): 8-bit color = 256 colors (2 to the 8th)
7. page size rule of thumb: 50KB page size; maximum of 8-10 seconds download time
8. q&d= quick and dirty
9. gradient fill
10. effective tiling
11. 'tweening (dark to light color)
12. grayscale
13. washout
14. Low resolution = 640 X 480 pixels (VGA = Video Graphics Array) 4:3 aspect ratio
15. Medium resolution = 800 X 600 pixels (SVGA = Super Video Graphics Array) 4:3 aspect ratio
16. High screen resolution = 1024 X 768 pixels (XGA = Extended Graphics Array) 4:3 aspect ratio
17. Wide high screen resolution = 1366 X 768 pixels (WXGA = Wide Extended Graphics Array) 5.34:3 aspect ratio
18. Ultra High screen resolution = 1600 X 1200 (UXGA = Ultra Extended Graphics Array) 4:3 aspect ratio
19. Quantum screen resolution = 2048 X 1536 (QXGA = Quantum Extended Graphics Array) 4:3 aspect ratio

Let me know if there are any terms or concepts here that you do not understand; e-mail me at wbuchholz@bentley.edu

Check this out:
Here is a list of the Web design terms and concepts we covered in class on Wednesday, March 2. You should be able to define these terms and offer examples.

1. IDE
2. DHTML
3. layer, div
4. CSS2 Specification (Cascading Style Sheets, Level 2)
5. JavaScript
6. pixel
7. pixelation
8. resample
9. image file properties (why important)
10. JPEG (Joint Photographic Experts Group)
11. .jpg, .jpeg
12. .bmt, .tiff, .tif, .png
13. RGB
14. 16,777,216 (24-bit RGB color possibilities. R=256 X G=256 X B=256= 16,777,216)
15. .gif (256 possibilities, from 0-255)
16. Explain this style rule: "position: absolute; top: 123px; left: 45px; width: 700px; height: 523px;"
17. JPEG compression eliminates color information
18. crop
19. crosshairs
20. two-headed arrow, four-headed arrow

If any of these terms or concepts seem unfamiliar to you, be sure to e-mail me at wbuchholz@bentley.edu