IDCC 370: Web Design I   Spring 2008

Check this out:

As a group, you created some wonderful Web sites for Assignment One. Congratulations to you all. Your grade is available online, so you may want to check it out.

In addition, I want to highlight some areas to watch out for when creating a Web site. Here goes:

1. Writing and proofreading: The Web is both a graphic and a written medium. In Web design, you must be very careful on both fronts, as you are publishing to the world. Make sure that your writing is concise and correct. Watch your phrasing (how you say something), punctuation, spelling, and proofreading (shift/F7 in Dreamweaver results in the spellcheck utility, pictured at right). Good writing is critical in the design of Web sites. If your site is riddled with errors, your credibility and professionalism plummet. People will not trust the information you are trying to convey. A site that is untrustworthy is just taking up cyberspace. Don't let that be you.
2. ALT: Be sure that all graphics contain Alternative Text (ALT); remember to end all alts with a period. Do you recall why?
3. Contrast: In Web design, when setting text against a background color or layer, you must be very careful to create high contrast, otherwise the text will not be visible. The extreme, as I’ve mentioned, is black text on a black background or white text on white. It just doesn’t work. In some of your pages, you put dark text against a dark background: no go. Note too that when you use a black page background, your visitors will have a difficult time reading blue and maroon hyperlinks. You need to change the color of the background, hyperlink, or text.
4. Vertical spacing: Some of you have too much space vertically—usually extra enters. Kill them.
5. Meta tags: be sure to place meta tags for key words and page description on all your pages. Make these count, as search engines often use them in their results pages.
6. Click here: Avoid this. Remember, you should always make inline hyperlinks descriptive of their destination. Rather than “William Buchholz resume, click here,” you should set the link descriptively: “William Buchholz resume.”
7. Quoting and paraphrasing: Some of you are still confused about how to handle quotes and paraphrases. The easiest rule of thumb is this: if you use three words or more in a row from your source, be sure to put quotations around this material. You can intersperse your commentary with quotes, but be very careful about this.

If you have questions, just e-mail me at wbuchholz@bentley.edu. Feel free to comment on this announcement, or if you want to e-mail it, click on the little mail icon directly below.

Labels: "click here", alt, Assignment One, background, contrast, meta tags, proofreading, shift f7, spacing, spell-check, writing

Check this out:

In preparation for your second assignment, you should be scouting the Web for sites whose design you admire. Also pick from three to five sites that offer free graphics. The best approach in discovering such sites is to begin with a Google search, using these terms: "web graphics free". You'll get 115,000,000 hits (as of 03/06/07), so start at the top and move down through the sites until you find some interesting material. Bookmark the good sites.

If you start to download free material, create a folder with the name of the site; for example, boogiejack. Then name any file you download into that folder with the name of the site as well; for example, boogiejack-pink-tile.gif. Remember, you need to credit all your graphics sources and provide links to the sites. It is very important that you keep all of these files straight, so take care.

In selecting the graphics sites and downloading your material, you should be thinking of the whole look and feel of your site: colors, graphics, and page design. Do you want your site to be light and airy? Dark and brooding? Serious and professional? Wild and crazy? Subdued and understated? Adventuresome? Cute? Tough? Nationalistic (e.g., Irish, Italian, American)?

Tuesday, March 6, we will begin to design your site graphically, starting with the banner for your template. Here is an interesting site for some very subdued watercolor backgrounds that you might want to use on your own site: http://www.brownielocks.com/backgrounds.html. We'll experiment with some of these in class.

If you have questions, just e-mail me at wbuchholz@bentley.edu. Feel free to comment on this announcement, or if you want to e-mail it, click on the little mail icon directly below.

Labels: boogie-jack, brownielocks, design, free Web graphics, Googling, graphic design, Graphics, layout, optimize graphics, source graphic, Web assets

Check this out:

When your Web site shells are ready, take a deep breath. You've accomplished a great deal so far. But now we are about to embark on the FTP journey.

First, you need to make sure that you have an account on the Bentley student server: create your account. Once you've created your account, you need to hook to the server through Dreamweaver. Dreamweaver's FTP utility can be a little confusing the first or second time through, so I hope this advice will help.

Make sure the latest copy of your Web site is on the c:/ drive (most likely a drag and drop from your m:/ drive) to a subdirectory with your last name. Example: C:\Documents and Settings\wbuchholz\My Documents\My Web Sites\370\.

Once you're sure you have the latest version of your Web on the c:\ drive, invoke the site management wizard to edit your specs. I'll walk you through the steps in the wizard, so don't move too quickly. Wait for the whole class to go through this.

The key screen in the wizard is the one where you actually hook to the server and your folder on the server. Here is a screen shot to use as a model (click to enlarge for easier viewing):

If you need some help with this whole process in class, just raise your hand. If you run into trouble at home, just e-mail me at wbuchholz@bentley.edu for more advice — or wait until the next class, and we'll quickly take it from there.

Please feel free to comment on this post (nothing dirty, though) and I will respond for all to see.

Labels: Bentley, Dreamweaver, FTP, site setup, Web assets, Web site directory, World Wide Web