<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/TR/REC-html40"> <head> <meta http-equiv="Content-Type" content="text/html; charset=unicode" /> <title>Web Site Design Specifications</title> <link rel="dataStoreItem" href="DMS_web_site_specifications_files/item0006.xml" target="DMS_web_site_specifications_files/props0007.xml" /> <style type="text/css"> <!-- .style2 { font-size: small } a:link { color: #0000FF; text-decoration: none; } a:visited { text-decoration: none; color: #990000; } a:hover { text-decoration: underline; color: #990000; } a:active { text-decoration: none; color: #0000FF; } a { font-weight: bold; } --> </style> </head> <body > <h1 align="center" >Web Site Design Specifications</span></h1> <p align="center"><a href="index.htm" class="style2">HOME</a></p> <p><strong>Directions:</strong> Copy and paste this into your word processor and complete it. There are a couple of steps where you are asked to draw. Here you may freehand it, or you may use a computer image that you have created (this must use colored ink, or you can color it in after you print this assignment.</p> <p>The following design specifications include everything you should know prior to beginning development and implement of your new Web site. </p> <p align="center" ><strong>***** Copy and paste below this point *****</strong></p> <p ><strong>Name of Project: </strong>______________________________________________<br /> <br /> <strong>Contact Person:</strong> _______________________________________</p> <h3>Purpose of Site</span></h3> <p>___ Informational<br /> ___ Marketing Products<br /> ___ Advertising Services<br /> ___ Personal<br /> ___ Other</span> (describe)</p> <p>Overall impression you want to convey </span> ___ </span>Strictly Business<br /> ___ Friendly, Light<br /> ___ Humorous<br /> ___ Other (describe)</span></span></p> <p>What color scheme (<a href="DMS_Desicgn_Cycle_Design_Specification.htm" target="_blank">Kuler Color Schemes</a>) do you want to use? List the following colors by hexadecimal and name:</span></p> <ol> <li><strong> Text:</span> </strong></li> <li><strong> Background:</span> </strong></li> <li><strong> Link hover:</span> </strong></li> <li><strong> Link visited:</span> </strong></li> <li><strong> Link over:</span> </strong></li> <li><strong> Link active:</span> </strong></li> <li> If a <a href="http://kuler.adobe.com/">Kuler</a> color scheme is used then list name:<br /> </li> </ol> <h3><strong>Titles of Pages in Site</span></strong></h3> <p>Note: #1 is the Home Page. Its title will show on search engines. You also need a <strong>Site Map</strong>, and an <strong>About</strong> page.</p> <ol> <li>______________________________</span></li> <li>______________________________</span></li> <li>______________________________</span></li> <li>______________________________</span></li> <li>______________________________</span></li> <li>______________________________</span></li> <li>______________________________</span></li> <li>______________________________</span></li> <li>______________________________</span></li> <li>______________________________</span></li> </ol> <p>Total number of pages in the site: _______<br /> If</span> you need more room, attach a separate piece of paper and continue numbering.</p> <h3>Text</span></h3> <p>You may have up to 200 words of text on each page. A page is defined as all text and graphics that will fit on an ordinary letter size (8 1/2 by 11) piece of paper. When transferring text you should save the file as a *.txt (text) or *.rtf (Rich Text Format.) When you use either .*.tx or *.rtf, then you are guaranteed that the file will open in any OS (Mac or Wind or Linux) or word processor. in either plain text or ASCII format, but if you cannot provide a diskette, have all text neatly typed or printed by your computer on plain white 8 1/2 by 11 inch paper. Handwritten text is not acceptable. Text will be used exactly as submitted. Formatting will be followed as closely as possible within web programming constraints. Text pages that are to include graphics must allow space for those graphics and indicate where they are to be placed... use a tag like &lt;INSERT NAME_OF_IMAGE.png HERE&gt;. Below you are to list the text files that you will be bringing in for content and the font types/size (where applicable) below. </p> <p><strong>Text Files</strong> You should use descriptive file names and proper <a href="DMS_File_Names.htm">naming protocol</a> when you create your files:</p> <ol> <li>.</li> <li>.</li> <li>.</li> <li>.</li> </ol> <p><strong>Font Type</strong> (List the name and size of each applicable font...if using the default size then just leave it blank. Refresher <a href="WebDesign_Anatomy_Web_Fonts.htm">The Anatomy of Web Fonts</a>):</p> <ol> <li><strong>Text Body:</strong></li> <li><strong>Title</strong> if different from body:</li> <li><strong>Links: </strong> <ol> <li>what type of over effect (ie., hide underline on rollover):</li> </ol> </li> <li><strong>Heading </strong> <ol> <li>H1:</li> <li>H2:</li> <li>H3:</li> <li>H4:</li> <li>H5:</li> </ol> </li> </ol> <h3> Multimedia </h3> <p>All graphics are to be formatted in the .jpg, .gif, .pict, png.or PhotoShop</span> formats. Resolution need be no more than 72 DPI if image size is larger or the same as the size to be used on the web page. We recommend using PhotoShop</span> files so that we can perform the necessary compression routines with our software. JPG files will be used  as sent and must be at the correct size and compression when received. You should resize all of your images, and set the size to 72 DPI before you insert them on your pages. If you are working with video, then do not bring in a DVD movie and expect to convert to a useable file. You should try to convert your movie to a .mov or universally compatible file. Note: Microsoft files are preparatory and difficult to use on different systems or without MS software. MP3 or MP4 files are easy to work with, so very little preparation is needed here.</p> <p>Describe what you need to do for your media below. Do you have the images already and just need to edit them? Do you need to scan your images? Do you need to import a movie? Do you want to run a Flash movie? Do you need to download and insert a mp4 file?<br /> </p> <blockquote> <p><strong>Type of Media I:</strong></p> <ol> <li>File Name(s):</li> <li>Importing, editing, converting needed:</li> </ol> <p><strong>Type of Media II:</strong></p> <ol> <li>File Name(s):</li> <li>Importing, editing, converting needed:</li> </ol> <p><strong>Type of Media III:</strong></p> <ol> <li>File Name(s):</li> <li>Importing, editing, converting needed:</li> </ol> <p><strong>Type of Media IV:</strong></p> <ol> <li>File Name(s):</li> <li>Importing, editing, converting needed:</li> </ol> <p><strong>Type of Media V:</strong></p> <ol> <li>File Name(s):</li> <li>Importing, editing, converting needed:</li> </ol> </blockquote> <h3>Project Branding</h3> <p>Your logo will identify your project/company. Create a large original, and then you may resize it to insert on your homepage, and content pages. It must be on your home page. Make sure your logo is compatible with your color scheme.</p> <p><strong>Logo</strong> Draw or paste (color) your logo below:</p> <p>&nbsp;</p> <p>&nbsp;</p> <p>&nbsp;</p> <p>&nbsp;</p> <p>&nbsp;</p> <p><strong>Banner</strong> Draw or paste (color) your logo below:</p> <p>&nbsp;</p> <p>&nbsp;</p> <p>&nbsp;</p> <p>&nbsp;</p> <p>&nbsp;</p> <p>Each page will have a graphic (smaller than the Company Title) at the top of the page which will include a description of the page and provide for navigation back to the homepage. The colors and text typeface will be similar to those in the masthead. Choose what you want in your top-of-page graphics (you may have multiple entries)<span class="GramE">:</span><br /> ___ Company logo<br /> ___ Product drawing or photo (send as described for logo)<br /> ___ Text (links such as: Home | Site Map | About | Contact)<br /> ___ Other ideas (describe)</p> <strong>Background</span></strong> <p>Backgrounds lend a distinct  look to your pages. They should be understated and simple otherwise they may render your page difficult to read or be distracting. A Background can be a texture, solid color, or a graphic which is screened back to give a  watermark look. Describe the background texture or color you want for your pages. For textures, just describe the texture (material, wood grain, clouds, marble, etc. For solid color backgrounds or texture, you can pick from all of the standard web colors. You may submit a texture graphic to be used.</p> <p> Describe your background below:</p> <blockquote> <p><strong>Texture</strong><br /> <br /> <strong>Color</strong><br /> <br /> <strong>Graphic</strong><br /> </p> </blockquote> <strong>Links</span></strong> <p>You must provide the full URL address (http//:www.address.com) for any sites you wish to link to, the number of the page on which it should appear, and the text or graphic to be used to identify the link. If you need more room, attach a separate piece of paper and continue the numbering scheme.</p> List the name and URL of each site you link to:</span> <blockquote> <p> Link 1:<br /> </p> <p> Link 2: <br /> <br /> Link 3:<br /> <br /> Link 4:<br /> <br /> Link 5:<br /> <br /> Link 6: </p> </blockquote> <p>Anchors:</p> <p><strong>Search Engine Specifications</span></strong></p> <p >Web search engines require descriptions and key words for your site. A 25-word (200 character</span> maximum) sentence describing the site and any number of keywords viewers might use to find the site will help potential visitors find you.<br /> </p> <blockquote> <p><strong>Description</strong> (min 2 sentences):</p> <p><br /> <br /> <strong>Keywords</strong> (min 5):<br /> </p> </blockquote> <p>&nbsp;</p> <h3>Storyboards</h3> <p><a href="http://en.wikipedia.org/wiki/Story_board">Storyboards</a> are graphic organizers such as a series of illustrations or images displayed in sequence for the purpose of pre-visualizing a motion picture, animation, motion graphic or interactive media sequence, including website interactivity. There are several different storyboard templates that you could use, but since you are building a web page then you can use 1 piece of paper to represent each page of your site that will use the storyboard. In your case you only need 2 story boards...one for your home page, and one for your template.</p> <p><strong>Using 2 pieces of paper construct a storyboard for your homepage and one for your template.</strong> Put your name and project name on the back. Each storyboard should include all links, graphics, background (you could just use a small window to represent your background), video, etc. If possible use some colors. Attach your storyboards to this specification.<br /> </p> <p align="center" ><a href="index.htm" class="style2">HOME</a></p> </div> </body> </html>