MAT 125: Web Design 1: Fundamentals : EXERCISES

FInal Project: Fictitious Business Web Site Using Simple Responsive Design

Choose a fictitious business you would like to develop a simple responsive website for. Review the research that you did for Project Two into other businesses in the same field. What did their websites look like? Were they responsive - did they adjust to different window sizes from a large window in a normal monitor, down to the size of a tablet and also to a size that would be viewed in a phone? What type of content did they have? How many pages?

Use this web research to develop ideas for page layout and relevant page content.

Project Requirements

  • Choose the business type you will be creating a website for
  • Post the business information on the Discussion Board. Include a business name if possible.
  • Create a simple responsive website with 4-6 pages of content.
  • Ideas for page content:
    • Page One: Index page can explain what the business is - an about us type page.
    • Page Two - Six: Create several pages of relevant content that fits with the type of business you have chosen. Some ideas for pages could include: product or menu pages, a contact us page, history page, etc.
  • Add an Artist Statement page that is linked from the footer on the index page. Explain how you used responsive design in your website.
  • Link all the pages together. Place all links on every page. Use the style of navigation covered in Exercise 7 or 8
  • External links should open in a new window
  • Use a wrapper div to contain your content with a set width
  • Opening page must be named index.html
  • Use page names that match page content
  • Folder name Project3

Page Layout

  • All images must be formatted for web
  • Style images using CSS (padding, margin, borders).
  • Use the p & h tags to format your text.
  • Use CSS to format all text, fonts, colors, sizes, padding, margin, etc.
  • Create a CSS External Style Sheet for main page styles (create consistency)
  • Use CSS Document Styles for specific page styles.
  • Use CSS Inline Styles as needed

Some Suggested Business Choices

Choose one of the following businesses or think of your own.

  • Diner / Restaurant
  • Coffee Shop
  • Floral Shop
  • Bike Shop (motorcycle or bicycle)
  • Graphics Business
  • Artist Portfolio

Project Three Grading Rubric
Item/Points 10-14 15-17 18-20
Function Some Most All correct
Navigation Minimal Basic Above & Beyond
Responsive Design Minimal Basic Above & Beyond
Requirements Some Most All
Coding Accuracy Poor Mostly Correct Accurate
Effort Minimal Basic Above & Beyond
Content Minimal Basic Above & Beyond
Design & Creativity Minimal Basic Above & Beyond


This Project is worth 160 points.
Each criteria is worth from 0 to 20 points.
Doing the minumum will not get you the total amount of points.

  • Functionality
  • Effective Navigation
  • Responsive Design
  • Project Requirements
  • Coding Accuracy - Proof in FireFox
  • Effort/Depth
  • Content
  • Design & Creativity
  • Points will be deducted for late work.

Due Date

See Schedule

Online Demos

Refer to all Demos especially 5-10