Assignment Three
Due Date and Readings
Assignment three is due no later than 4:30 p.m., December 14 (day) and December 16 (eve). Assignments should be posted on the Web by this time for access during class that day. All readings listed as preparation for this assignment are linked via icons, created by, and property of, the destination sponsor.
Review Marshal Brain's "How Web Servers and the Internet Work." |
 |
Trellix: "A Web-site that discusses how to create good business documents in the linked, on-screen environment of Intranets and the Internet." Explore "Techniques, Samples," and "Related Sites." |
 |
Review Dmitry Kirsanov's "Modular Web Design," January 1998, and "The World of Fonts," December 1998. |
 |
Review "Site Covers," "Basic Tables," "Frames," "Typography I," "Typography II," "Typefaces," "Consistency," "Page Length," "Graphic Design 100," "Balanced Pages," "Basic Tables," "Frames," and "Design Grids for Pages" in Patrick Lynch's Yale Web Style Guide. |
|
Review Joe Gillespie's ideas on "typography." |
 |
Explore Vincent Flanders' Web Pages that
Suck.com, "where you learn good Web design by looking at bad Web
design." |
 |
Read "Writing for the Web" by Jakob Nielsen |
 |
Use the HTML Code Tutorial when you need to check out a detail or two. |
|
The W3 Schools tutorials on Cascading Style Sheets (CSS) will give you a leg up on creating interesting styles for the Web. |
|
Continue Steve Mulder's "Stylesheets Tutorial" at Web Monkey. |
 |
Continue to explore this amazing graphics and typography resource as you design your own Web pages. If you use this material, be sure to link to and credit Boogie Jack. |
 |
Assignment Purpose: to Complete the Styling of Your Essay and Create the Interactive Survey
- To complete the functional and stylistic aspects of your essay.
- To create a feedback analysis form for readers to react to your essay and respond to you.
- To update all exercises on the exercise gateway page, making sure that all work is fit for public display.
- To finalize all aspects of your Web site to ensure functional and design excellence.
Minimum Tasks to Accomplish
- Correct your last assignment, and post the corrected pages to the Web. Failure to perform this step completely will result in a possible 50-point deduction from the grade on this assignment. Be sure to hand in the instructor-annotated copy of your first assignment. Do not print out the corrected pages.
- Review all pertinent readings and tutorials.
- Essay: Lay out this page using your site template and any additional CSS necessary. Note also that you must
- Title page <title> and graphics for browser readability (meta and alt tags as well as "title" attributes). Provide a meta Description line in the XHTML head and supply 5-10 key words. All of this is for search engine optimization.
- In your introduction, be sure to explain the context for your essay; that is, assignment description, teacher, class, date completed, and the like.
- Use headings (H1, H2) at appropriate places in the text. H1 must be used for the title and H2 must be used for internal headings.
- Place the text for this page in your content layer with a left margin of 5 em set for the p tag, thereby achieving a hanging indent look for your headings.
- Chunk the paragraphs so they can be read easily on the screen. Use ordered and unordered lists where possible. Your graphics will also help to chunk the text.
- Supply two or three text callouts that tastefully represent the gist of an important point or two in the text.
- Use three or four relevant and tasteful graphics, sized appropriately, in your essay (float at least once left, and at least once right). Be sure to provide alternative (alt) text for all graphics and credit the source of your images.
- Provide internal navigation of your essay with at least five anchors to
headings within the text.
- Place the anchor names (at least five of these linked to headings within the essay) at the top of the article text within a contents class ul floated left or right inside your wrapper div, as we did in class. Don't forget the "Return to contents" hyperlink at the end of each section of your essay.
- Make sure that the background color of the contents links is very light and the text is very dark, or vice versa (contrast is critical). The text must be easily readable.
- Survey overview: So that your readers can respond to your essay, create an interactive questionnaire form. Explain why you are soliciting reader reaction to your paper. Be sure to apply all the questionnaire and form principles discussed in class and posted on the Web. Provide access to this form from your essay page and your global navigation bars. Likewise, supply a link from the survey to the essay. Why is this linking back and forth necessary?
- Survey construction: Pay close attention to structuring your questions for ease of understanding. Be sure to use
- Simple one-line text boxes for the respondent's e-mail address, street address, city, state, and country. Also supply boxes for a telephone number and a mobile phone number. If you would like any other demographic information, go for it.
- At least four questions that supply options (using radio buttons) and "label."
- At least four questions that supply options (using checked boxes) and "label."
- A minimum of three drop-down menus with at least five options.
- A minimum of three textarea boxes for lengthy responses.
- Fieldset and label functions in appropriate places.
- A redirect value that e-mails results to yourname@bentley.edu.
- Two or three graphics related to the topic of your survey.
- Brief closing statement.
- Design a unique "thank you" or confirmation page, tailored to your survey, that appears upon submission; this page should be designed in your regular site template. Be creative and interesting. Use graphics, and be sure to tell your respondent what to do next. Title page <title> and graphics for browser readability (meta tags and alt text). Provide a meta Description line in the XHTML head and supply 5-10 key words. All of this is for search engine optimization.
- Ensure that all pages are well-written and error-free. Should you need help with your writing, schedule some one-on-one time with a peer tutor in the Writing Center or at the ESOL Center in the Library.
- Update your exercises.htm gateway page and all exercises completed since assignment 2.
- Browser test your assignment to make sure that all elements function correctly. Make your assignment printer-safe from the browser; that is, make sure that the entire page will print (no chopping off the right side).
- Validate all site pages in Dreamweaver and at W3C.org's HTML Validator
. - FTP all your files to the server. Save your complete Web to an external medium (disk, flash drive, CD or DVD).
- At class time, hand in a printed copy of the entire
assignment as it appears rendered in the browser on the Internet (not out of Dreamweaver on your C: or M: drive). Also hand in a copy of the XHTML source,
printed from the browser (on the Internet, view source, and print from Notepad). Make sure to place the rendered printout on top of the XHMTL printout for each page of your site and staple them together. Be sure to
include a title page with your full name in the upper right
corner. Remember to hand in your instructor-annotated copies of
assignments one and two (the copies with my evaluation and comments on your
printout).
Do not reprint your entire site. I want only your assignment three materials newly printed. Here is exactly what you should print and hand in (this exact order):- screenshot from Dreamweaver of the files and folders view of your entire site to date
- 370.css
- essay.htm
- survey.htm
- thanks.htm (all tailored thank you pages from all exercises as well)
- e-mail reports from all surveys (from Outlook)
- exercises.htm
- All exercises since assignment 2
- To conclude the assignment, please fill out the interactive response form for assignment three.