P2: Business/Service-Oriented Site

Project 2

This project focuses intensely on design, CSS styling methods, and the separation of presentation from content.


  • Date: Please check Blackboard’s “Weekly Schedule!”
  • html and support files uploaded to the server


Create a website for a real or mock business/service-oriented site (this can include a professional portfolio as well). Even if the site is geared towards for-profit business, it should be limited in it services or products offered. This limitation serves a few purposes:

  1. Limit the realistic scope of the production work to make the site “doable” in the given time-frame
  2. Choosing something that offers limited services or products will help you to create a more realistic website. For instance, it is reasonable for an upscale restaurant to offer a limited menu, while it is less realistic (less competitive) for a sporting goods store to show its product line on the web without listing all of its products from a database. It is manageable to make a site with a short list of products/services with what you have learned and within the given time frame; it is unreasonable to try to create a convincing site, though, with 100, 1000, (etc.) product entries.
  3. If you wish to create a site using a “product” that would traditionally need to sell hundreds of items available online, consider marketing to a smaller niche market for a “boutique” version of the product. For instance, if you want to have a footwear site, sell only high-end, designer boots, and limit the merchandise.

Some Ideas

To help you think of types of sites that might be appropriate for this time frame and scope-of-work, read through some possible ideas:

  • Professional Portfolio
  • Upscale restaurant
  • Charity organization
  • Pet adoption
  • Local park or recreation facility
  • After School Program
  • Day Spa
  • Bar or Nightclub
  • Recreational sports club/team
  • Fraternity/ sorority/ honors club
  • Contractor services
  • Dentist/ Physician services
  • Boutique clothing


  1. HTML pages must be written in valid, strict XHTML 1.0 or higher
  2. All styling should be accomplished through external style sheets
  3. You must have a MINIMUM of five separate pages within the site
  4. You must have a global navigation toolbar on each of the pages
  5. You must have the following links available from every page (they do not necessarily have to be in your global nav bar):
    • contact
      • This should have relevant contact info (this can be dummy info if you wish)
    • about us
      • About the site, the organization, or the artist. This is a good place for a mission statement or artist statement. It can also be where you put any credits to resources used for the production of the site.
        links (or sitemap)
    • links
      • This should be a place where you provide links to external resources, OR you can make a sitemap of links to all pages within your own site. You might choose external resources if you are doing a community or charity-based site, providing informational links to other useful community resources. You can also propose an alternative to this link type.

    The remaining minimum two pages/sections are up to you to decide on how to divide them up. For instance, you could have a “products/services” global link that takes you to a page with several local link page choices, like “massage,” “manicures”, “pedicures,” “sauna”, and “facials.” You could also choose to have a products page that simply lists all of the products on that same page if they make sense together, but you then need to also add another link to fulfill the minimum five page requirement (for instance, “package discounts” or “take a tour”).

  6. Use at least ONE of the following:
  • javascript images or image gallery OR
  • other jquery widget

Digital Art, Design, and Communication Education