#Demo

TODO

  • create grid framework
  • lay out visual aid for the grid
  • make framework responsive
    • make desktop, tablet, mobile sizes
    • take into account orientation
  • find website to update
  • create updated website

For some reason I was not hit with inspiration for this project; I enjoyed making the grid but the refactor wasn't enjoyable and I did not do a very good job with it. Maybe later I will come back to it.

CSCI115_ResponsiveWebDesignProject

In this assignment, you are to find a web site of one of your favorite restaurants that needs improvements. A good example would be http://www.senortequilacharleston.com/index.html (note: this is NOT one of my favorite restaurants!). Your job is to refactor the site into a modern, responsive web site. The first step is to create a grid-based layout framework. This will be used to layout content on each page. This file will be called framework.css. You also must use @media queries or tags to compensate for various screen sizes. You can determine what size screens you support, but you must at least have three sizes, one for widescreen desktops, one for tablet-sized screens, and one for smartphone-sized screens (Pro-tip: You may want to also consider when tablets and smartphones are rotated to be viewed in Landscape mode).

Feel free to use images from their Foursquare & Yelp photo galleries to use on your website (or any ones that you used for your photography website that apply). You are free to use any website design you want (get ideas from restaurants that have well laid out sites). I am looking for an interesting navigation bar, logo/banner in top-left corner, and good use of a color scheme.

This assignment is part of your major Semester project. There are two (2) deliverables for this assignment.

  1. A framework for the grid-based layout, framework.css (Due. 14 Nov)
  2. Project files (all html,css, and image files) (Due. 23 Nov)

Misc requirements:

  1. Your Restaurant website must render properly in the Firefox web browser.
  2. Comment on line 2 of all files that contains your name.
  3. Be contained in a folder structure that is zipped up.

This assignment has 5 purposes.

  1. Reinforce your knowledge of responsive web design.
  2. Allow me to see some of your creative style.
  3. Reinforce your knowledge of a well-formed HTML file.
  4. Continue to build a basic structure for a website.
  5. Continue to build your external CSS file. Due: 22 Nov 2016 @ 11:59 pm