Midterm Project - Small Business Website
(due 3/25)
In a five step process, you will create a website for the fictional company, iPoint Advisors, using this textual content. You will begin by creating graphics and image-based rollover buttons for the navigational menu (Part 1); you will then layout your pages using HTML Tables (Part 2); style and format the text and other elements using Cascading Style Sheets or CSS (Part 3); refine your deisgn and define a template for the site (Part 4), and finally you will populate the site with all content, refine your page designs, debug problems, and upload the site to the MAT servers via FTP (Part 5).
You will have the opportunity to ask the "client" (me) questions about the project to guide your creative development and understand the communication goals and objectives for the site. This client survey may be useful to that end.
The website should have the following sections/pages: profile, services, staff bios, client list, and contact (you are free to change the names/labels for these pages if you wish).
Design the NaV menu & gRAPHICS (Part 1)
You are required to create the following imagery in Photoshop, Illustrator, or Fireworks: a simple text-based logo/banner for the company that will serve as the site identifier; page titles/headers (page identifiers) for each site section; and image-based rollover buttons for the navigational menu buttons that link to each page.
Create a root folder with the following naming convention: your last name + p1. My folder would be called "clevelandp1" for example. Save all of your work (including your imagery) in this folder. Inside of your root folder, you may wish to create an "images" folder for your optimized files (gifs and jpgs) and a "source" folder for your source files (psd's, fla's, etc.).
Page Layout USiNG Tables (Part 2)
In the second part of the iPoint exercises (see above for general info and info on part 1), you will layout your pages using HTML tables. Decide whether you want your pages to expand and contract to fit varying screen sizes or whether you want to use a fixed size table. It is likely that you will need to create separate cells for your logo/site identifier, navigational menu, page titles, and body copy, but you should strive to have the simplest table-based layout possible that meets your needs. Once you setup the table layout, insert all of your images and content and enable your links for each of your pages.
iPoint Formatting Using CSS (PART 3)
In the third part of the iPoint exercises (see above for general info and info on parts 1 and 2), you are required to style and format the text for iPoint Advisors using an external Cascading Style Sheet (CSS). Create differing styles to format, design, and differentiate body text, headers, sub heads, etc.
define and use a template for the site (PART 4)
In the fourth part of the iPoint exercises, you are required to refine and finalize your page design (including adding all links, alt tags, etc.) and then save it as a template. Define the appropriate editable regions of your template. Create your content pages based on the template (using "New Page from Template"). Insert the content appropriate for each page and format the text using your external Cascading Style Sheet (CSS).
Refine, DEBUG, and UPLOAD VIA FTP (PART 5)
In the last part of the iPoint exercises (see above for general info and info on parts 1- 4), you simply need to put on the finishing touches, testing your site for consistency and proper functionality, correcting any errors that you spot, and ultimately uploading the site to the MAT servers via FTP.