Web Dev – Design a Car Dealership Web Site
Your Mission:
The owner of a local car company, “Roswell Rides,” has hired you to create a web site. The owner, Robby Roberts, has requested that the site include at least the following;
- Home Page
- An original banner including the car company name created in photoshop
- A compelling bi-line advertising Roswell Rides and why you should look at their cars first!
- A navigation bar or left-hand navigation linked to all other pages. (Note that the company banner and navigation should be repeated on all pages for consistency!!!)
- The navigation buttons should include “Home”, “Show Room”, and “Contact Us”
- A brief bio on the history of the car company and then an invitation to view their recent models (hint: the invitation should include links to the car model or showroom page.)
- Show Room Page
- Description and pictures of 3 cars contained in one HTML table
- HTML table (adhere to proper code style techniques) listing each car’s, color options, horsepower, mpg city/hwy, automatic or stick shift, price, etc.
- Contact Us Page
- Pick an address of a real car dealership in Roswell and include it here.
- Show a small screen capture of a google map to the location
- Fictitious phone number
- Email address that goes to your email account asking the reader to contact us for more information!
______
Get Started:
Create the following folders;
//WebDev/roswell_rides/
//WebDev/roswell_rides/assets/
//WebDev/roswell_rides/assets_build/
Now go out onto the Internet and use Google Search Images to find appropriate images to enhance your web site. Save them into your /assets_build/ folder so that you can edit them with PhotoShop.
______
Step Two:
Create a prototype of what the main page will look like in PhotoShop paying close attention to the banner and navigation. Be sure to build all of your button rollovers! (eg. homeOff.jpg and homeOn.jpg
Step Three:
Create your web pages using DreamWeaver. You should have three pages with file names as follows;
- default.htm
- showroom.htm
- contactus.htm
Each page should have proper coding AND includeunique head tag info;
- <title>
- <meta description=””>
- <meta keywords=””>
Remember that style and creativity are both a big part of this presentation.
Note that you will present your web site to the class on the overhead projector for peer review and grading!
See Rubric for specific instructions!
Make sure that you follow the Rubric VERY closely!
Rubric to follow shortly…
Web Dev Rubric for Roswell Rides, Water Rights, and Georgia Dogs web sites:
Expectations:- Good use of classroom time to do the assignment.
(On task working only on this assignment during class.)
- Creative banner with compelling bi-line and correct title.
- All 3 navigation buttons present and operational
- Banner and nav buttons create an interface that is consistently used on all 3 web pages. (hint: create your _template.htm page with interface and navigation without adding the page content then “save as” the other HTML pages and you will have the same code for each page)
- Elegance of code
- HTML, HEAD, BODY open and close tags all present and properly positioned
- Any / all <TABLE> tags properly written and nicely indented.
- Comments used when applicable
- Image code includes use of the ALT tag!!!Code:
- All <head> data is present including;
- <title</title>
- <meta name="keywords" content=""
- <meta name="description" content=""
- Content for each page meets standards of the rubric instructions (see above directions)
- Homepage
- 2nd page
- Contact us page
- Design and Creativity
- Banner is artistic and relevant to web site theme
- Buttons are “cool” and consistently designed so the look professional.
- All navigation appears “above the fold.”
- Class Presentation
- Clear explanation of web site
- Entertaining
- Good eye contact with audience!
- Final Project due end of class ___/___/___.
- Submit Project on Overhead Projector for Peer and Teacher Grading
- Presentations begin at random on ____/___/___!
______
Total points available: / ______
100