Web Design Considerations:

Computer & Software: Students will need access to a Mac (PowerPC 604e or G3) or PC (Pentium-200 or faster) with a current web browser and web design software (see examples below). Also, a graphic editing program to optimize/edit images can be very helpful.

Let’s get started: Determine web site theme/topic. What makes the web site special? The site should create and provide value/information to the viewer.

Content (wording) for site – objective/factual information, have adequate substance vs. all flash, purpose of site (does it achieve its purpose), stable content needed along with correct spelling/grammar. Remember 1,200 student-composed word limit. What about non-student written content that might be used (diaries, letters... other primary source material)? See NHD website Rule #1 for list and Rule #5 for bibliographic source citation/style information. Entire web site cannot exceed 100MB of file space.

Designing the Page Layout: Students might find it helpful to make a written outline beforehand of their site. How many pages will there be? Relevance of page titles? How will images, text or other elements be placed? Page one is the Index/home page and needs to include names of participants, entry title, division, and a main menu. A wide page of small body text can be taxing for reader - text margins and white space, space on the web page not covered with text or graphics, can be your friend. While site design can be subjective, the following should be considered:

Colors: Colors can enhance and set the tone of a site, but can also detract from the theme and legibility. Choose carefully. Fonts and page layout should not compete with color choices (a dark background with colored &/or small text can be very hard to read). Remember, colors should compliment the page and not be harsh on the viewer nor forget the purpose and reason of the web site.

Fonts: Appropriate sizes for main text headers, body text, and image captions. Itty bitty type sizes are hard to read, while excessively large fonts can overwhelm a page. Remember, not everyone’s computer has all the same font styles that may be chosen by the student on his/her computer - hence making special fonts end up being viewed with a default font and not as intended. One NHD participant project solved this problem by including the special font used as a download attachment on the submitted project cd. Another way to use a special font for a title or header is to save the text as an image.

Navigation: Critical to the layout of web site. Navigational bars/buttons or text links to the site's pages should be easy to use and have consistent

linking (don’t frustrate your viewer with confusing navigation). Remember when the student’s web site is published as a stand-alone website all links must access the intended element (new page, image, multimedia content.... and not have the clicked-on link looking for something on the student’s hard drive or outside internet site, but on the submitted project cd. If frames are used, each frame should be titled to assist with frame identification and navigation.

Images: Images help convey your message, enhance, inform, and engage the viewer. They can also break up text elements and create a more pleasant and interesting web site. The theme and content of the site should connect with the images chosen. Images via a digital camera, 35mm prints scanned/processed (.gif or .jpg image file format) or professional images/graphics/clipart can make for an engaging web project. Students should follow and use appropriate line credit as requested from the image source (along with National History Day Rule #4). Images should load correctly, consistently and be integrated within the site.

Multimedia/plug-ins/applets/scripts: if used, ensure that each is embedded/linked/integrated in the student’s published web site on the submitted project cd (the student’s site should function properly as a stand-alone website when viewed on any computer – please refer to NHD Rule #3 for further information).

Site Testing/Viewing Files: Test, test & re-test your web site. Does the site work well – site navigation easy to use, links check out (links on web site contained on the submitted project cd and not on the student’s c: drive). The site should work as a stand-alone site. Do text and images align where you intended (margins, white space...)? Any special plug-ins required for multimedia or other page elements? Is the site virus-free? Is the site affected by browser pop-up blockers? Is the site viewable overall on the student’s computer and most importantly on someone else’s (potential NHD judges) through internet browsers such as:

Microsoft Internet Explorer (for Windows www.microsoft.com/downloads) Firefox (for Windows www.mozilla.com/en-US/firefox) Safari (for Mac & PC www.apple.com/safari)

If your site is online you can view it in multiple browsers on browsershots.org

Web Design Software, a sampler of costs (some free):

Fusion Essentials, free web design software with many of the features of NetObjects Fusion 11 (requires 133 - Mhz or faster Pentium-based PC Windows 95/98/NT/2000/Me/XP, 100 MB of hard drive space, 64 MB of Ram recommended). NetObjects Fusion 11 - Retail: $199.95 (requires PC w/Windows 2000 or Windows XP (660MHz Intel Pentium III processor or AMD equivalent, 250 MB of available hard disk space, 256 MB RAM - 512 MB recommended if running multiple applications simultaneously) • “Fusion allows you to layout your page how you want, and generates the code for you. Plus it has additional powerful features like Flash photo galleries, e-commerce stores, data storing forms, news components, and database wizards that help you connect to your server with ease” (www.netobjects.com).

Nvu 1.0, free web design software (requires Linux, Mac OS X, or Microsoft Windows). “A complete Web Authoring System for Linux desktop users as well as Microsoft Windows and Macintosh users to rival programs like FrontPage and Dreamweaver. Nvu (which stands for "new view") makes managing a web site a snap. Now anyone can create web pages and manage a website with no technical expertise or knowledge of HTML” (http://nvu.com).

For other free web page creation software check out www.download.com

Microsoft FrontPage 2003 - Retail: approx $95-130 (available at a substantial discount to qualifying nonprofits from TechSoup.org). Requires: PC w/ Windows 2000 SP3 or Windows XP. “Microsoft's Web publisher is popular with small businesses and many schools. Its interface will feel familiar to Microsoft Office users. Some advanced features require Microsoft SharePoint or extensions on your ISP's side” (techsoup.org). Discontinued by Microsoft and replaced with Microsoft Expression Web 2, but is still available through various online sources.

Adobe Dreamweaver - Retail approx. $399 (available at a substantial discount to qualifying nonprofits from TechSoup.org). Requires PC Windows or Mac OS X • “The package is crammed with features for professional Web designers and developers. It may be overkill for users with simple needs and Web newbies” (techsoup.org). www.adobe.com/products/dreamweaver

For helpful web building articles: www.techsoup.org/learningcenter/webbuilding/index.cfm

tlparker08