IDCC 370: Web Design I   Spring 2008

Check this out: The quizzes are graded and will be returned to you Thursday, September 30, at the end of class. Here is a list of the design terms and concepts covered in class, Tuesday, September 28:

1. information above the fold or below the fold
2. top-down design approach to information placement (hierarchy of importance)
3. user-centered design
4. reminder: never work to a distant (ftp) server
5. eye candy is functionally irrelevant (by definition)
6. reuse nav bar or nav bar reusability
7. tag as element
8. attributes as characteristics of tags
9. values are the attribute characteristics enclosed in quotes; e.g., color="red"; this is called a name/value pair
10. anchor tag, name attribute of anchor, href attribute of anchor, fragment, #

Let me know if you don't understand a concept or term in the list. In preparation for the next class, go to http://web.bentley.edu/resources/webpost.html and review the materials there. By the end of class, I want everyone to have published a web. Wish us luck.

Check this out: About half the class was devoted to the quiz, which I will get back to you either Tuesday or Thursday. The remainder of the class was devoted to beginning the design of your "anchored" format page. Here are the terms we covered as we began designing:

1. internal (in-page) nav bar
2. internal (in-page) T of C
3. chunked (short) pp.
4. long (fragments) pp.
5. nav redundancy
6. page owner
7. build the template

E-mail me with any questions about the quiz, these terms, or assignment one.

Check this out: Here is a list of the Web design terms we covered in class on Tuesday, September 21. You should be able to define these terms and offer examples. I'll give you a little written quiz next class that will include the possibility of all the Web design terms we've encountered thus far this semester.

1. assistive technologies and Web accessibility
2. screen readers
3. "work smart, not hard" (relate to power users, keyboard shortcuts, minimum movement, etc.)
4. functional test for ALT
5. functional test for hyperlinked images
6. visual readability of text on screen
7. bold stroke = easy-to-read text (point size?)
8. screen readability
9. document fragment (related to # and href, URL)
10. the anchor tag: single most important HTML tag
11. http
12. relative and absolute URLs
13. HTML element
14. HTML attribute
15. Web portability
16. image tiling
17. layers (1st layer and other possible layers relative to page, table, cell, jpg, and text)

E-mail me if you have any questions, of course--but first try to find out using the Webopedia or Google.

Check this out: Here is a list of the Web design terms we covered in class on Thursday, September 16. You should be able to define these terms and offer examples. I'll give you a little "nonthreatening" oral quiz next class.

1. GUI
2. to pour content
3. content developers or content development
4. workaround
5. padding
6. let the page breathe
7. columnar design; flow the text
8. visual cue
9. matrix table or mother table
10. left align, right align
11. justified
12. ragged right
13. ragged left
14. line wrap
15. caption line
16. tooltip
17. ALT or alt
18. snap the browser

Please let me know if any of these terms is a problem for you. We'll talk about these terms at the beginning of class.

Check this out: Here is a list of the Web design terms we covered in class on Tuesday, September 14. You should be able to define these terms and offer examples. I'll give you a little "nonthreatening" oral quiz next class.

1. site hierarchy (general to specific; root)
2. nested folders
3. SEO
4. site shell
5. container tags
6. placeholder page
7. reverse type
8. layers (layer 1; layer 2)
9. translating blank space
10. contrast
11. legacy Web
12. transitional state of the Web
13. design with tables and layers
14. liquid design
15. ice design
16. jello design
17. horizontal scroll
18. css (cascading style sheets)
19. KWIC (Key Word in Context: Google)
20. WYSIWYG

Get in touch with me if you do not understand any of these terms.

Check this out: Here is a list of the Web design terms we covered in class on Thursday, September 9. You should be able to define these terms and offer examples. I'll give you a little "nonthreatening" oral quiz next class.

1. orphan page
2. source view
3. rendered (client) view
4. elements
5. page components
6. domain (home) server
7. URL
8. banner
9. signature
10. template
11. Web site functionality
12. animated gif
13. nav bar
14. high fidelity (hi fi) prototype
15. hyperlink gray out
16. tool tip
17. IDE
18. metadata
19. liquid design

Be sure to fire up FrontPage prior to class to familiarize yourself with the IDE power, which can be a little daunting, I know. If you are having any trouble with the software, the terms we covered, or the readings, be sure to let me know.

Be sure to work through this tutorial carefully before class. The thumbnail image to the left links directly to the PowerPoint Web tutorial (for your convenience).

The information in this tutorial is vital. Understanding this and undertaking the suggested "best practices" will save you a lot of grief as we proceed through the course. Be sure to ask questions that may occur to you as you study the slides in this tutorial. I have some real horror stories to share with you from students who did not take directory structures and Web backup seriously enough.

You may want to print out the tutorial before class (Web Site Directory PDF). That way you'll have the slides and my discussion notes right in front of you . . . and you can make any additional notes you might need right on the printout.

Once your directories are all put into good shape, here is an example of the kind of functionality your site will exhibit: Webmodel. WJB

Check this out:
A revolutionary development in communication, the World Wide Web offers unprecedented access to mass audiences. This introductory course focuses on the principles and practices necessary to create effective pages for the Web.

You will receive instruction in writing hypertext documents, designing Web pages, authoring well-formed HTML, and meeting a variety of technical challenges. The course focuses on purpose, scope, and audience considerations in page design; writing informative and persuasive on-line documents; designing coherent, portable, navigable, and interactive pages; and employing the fundamental principles of color theory, typography, layout and graphic design for the Web.

Combining lab, lecture, and discussion, you will learn the best practices of electronic design to create your own interactive Web sites. Be sure to check into the class Web site every day for announcements.

During the first class meeting, everyone will be responsible to discuss with the class some part of the course information, syllabus and reading and design assignments. The various areas for presentation to your fellow students will be assigned during class.

Here is a picture of the door to the Smith 110. Wait 'til you see what's behind it. Good luck to you all. I look forward to our journey together into the wonderful world of Web design. WJB

Check this out: Digital Web Magazine - A Recipe for Learning Web Design: "Web design and its related fields are still relatively young in the grand scheme of things and are still developing. One of the questions I'm often asked is, 'how can I become a Web designer?' The answer isn't simple."