 Understanding
Web Genres
Assignment: (Do before Class):
Web Page Design pp. 20-38;
The
Site Development Process
Assignment for Friday: come to class
with a list of three or four links to websites
you want to use as models for your
Webgenre websites. See Professor Lewis's
model web genre websites.
Assignment: (Do
after Class)
1. See if you can't fix some of the problems
with your Design Portfolio site based on what you learned in
class today.
2. Go to Sewall
Class Designs and look at other Students' Portfolio
pages. What lessons can you learn about web design
from your fellow students?
3. Go to C-Net
Download.com. Look under the categories--Internet,
Utilities, Multimedia Design, and Web Authoring. What
are some of the tools you can download to help you make
better web pages?
4. Install Fireworks 8 trial (PC)
Install Firewoworks 8 trial (Mac)


"People take their personal sites very,
very seriously....
but don't you dare tell tell them their personal Web
page is ugly."
Flanders & Willis (p. 7)
"Flanders: There are certain sites, such as movie, band,
and Web design company sites, that have the right to be inherently
stupid. It's by their very nature."
"A
Discussion with Jakob Nielsen and Vincent Flanders" (new window)
1. Student work
- See Criteria for Design Portfolio webpages
- Make your homepage file name "index.htm"
- Make sure your homepage comes up
when you go to your Design class account:
for example:
http://www.sewallprogram.com/~lewis/
- Make sure you have two webpages: 1) a homepage
and a 2) Web Design Portfolio page. Make sure you
can get to these pages using links on your Design
class account. I will look for these working web links
on Saturday when I start grading your pages.
- By Friday, test and make sure that I have the
correct e-mail address for you by going to the
class website and sending yourself an e-mail
message using your e-mail address on this site:
www.colorado.edu/AmStudies/lewis/Design/email.htm
- Bring a copy of the successful or unsuccessful
e-mail message that you sent yourself to class
on Friday. I will give you "20 points" for
running this e-mail address for me.
- Revise your homepage and portfolio webpages
so that all the images work, there are "Alt"
tags for each major image, and all links work.
- I will grade your homepage and web design
portfolio page beginning Saturday morning.
See Criteria for Design Portfolio webpages .
- If you have not completed the above work by
Saturday, I will take points off your homepage
and web design portfolio page for being late.
2. Install Fireworks 8 trial (PC)
Install Firewoworks 8 trial (Mac)
2. Changing Link Properties
- See genres2.htm
- In Dreamweaver, go to "Modify" and
select "Page Properties." Here you can
change the link colors and other page
properties
3. Understanding Web Genres
4. Snowboarding and Skiing Websites
5. Building a Snowboarding site
6. Controlling Screen size of your Webpage
- 640 x 480
- 800 X 600 (Default size for current websites)
- 1024 x 768
- 1280 x 1024
7. Using Fireworks
- Install Fireworks 8 trial (PC)
Install Firewoworks 8 trial (Mac)
- Always use "jpg" or "gif" file
formats for the web.
Don't put "png" image files on the web.
- Digital Camera Picures ( DSC02659)
--See Edited Picture on webpage
- Pictures
of Sewall Hall and Sewall Students
- If you copy a "bmp" image off the web, make
sure you convert it to a "jpeg" or "gif" file format.
- Start by using Fireworks to reduce or increase
the size of the images you have on your websites.
- Don't put "png" file format images on the
web.
Fireworks will automatically save your initial
work as a "png" image.
- Use Fireworks to adjust the quality, contrast,
and brightness of your images.
- Always save your original "png" versions
of
the images you put on the web. It is easier
to edit and change "png" files than "jpeg"
or "gif" files
8. Understanding the HTML Source Code for a webpage
1. Reading and Copying
HTML Source Code
2.. Practice calling up
the three class examples I
created of a Design Portfolio Page:
2. Practice calling up and looking at the HTML source
code for these three model pages.
3. Can
you think of ways to copy some of my HTML
source code in order to make it easier for you to
create your own Web Design Portfolio websites?
9. Dreamweaver Lesson 2
- Adding images to a webpage. See
Chris Lewis Design
Portfolio, model 4
- Did you notice that I used "layers"
as layout grids to control where my images
are placed on this webpage.
- Alligning graphics and adding "Alt tags."
- Wrapping text around an image
- Adding borders to images.
- If you use borders, make sure they are invisible.
Black borders are not really necessary for good design.
- Go to "Modify" on the menu bar and select,
"Page Properties."
- You can use "Page Properties" to modify
the properties of your entire webpage.
- Use "Page Properties" to add background
images to your webpage.
10. Basic Questions to ask about the Websites you
Design.
1. Does
your Website Design work with your "targeted audience"?
2. How
does the Design of your Website portray your
Image and Style?
3. What does your Website say about who you are
and the Work you do?
4. Can, or should, your design lie about who you are?
Companies often pay advertisers to create ad copy
that misrepresent or even lies about their reputation. What
should a designer's professional ethics be?
11. Lessons in learning Web Design
-
The first step is learning to use the tools
-
The next step is understanding the limits of your
tools.
-
The next step is learning to lay out a web page.
-
The next step is to learn basic design.
-
The next step is learning how to trouble-shoot your
web pages.
-
The final step is revision, revision, and more revision.
12. Learning Design from other Web Designers.
- Lynda.com
- David Siegel
Design Home Page
- Dmitry Kirsanov
Design Studio
- Dmitry
Kirsanov Web Portfolio
- Circle.Com--Roger Black
Web Designer
- Best of the Web--Web Design and Development
- New Media
Design Web Portfolio
- The Internet
Design Firm
13. How should an Apprentice Designer advertise their
skills?
14. The Importance of a Design Portfolios for Web
Designers.





|