MDIA 4207: Web Design Business and Major Project

Transcription

1 MDIA 4207: Web Design Business and Major Project Website Development for Submitted: April 24, 2012

2 Introduction Following several meetings with, I have developed a storyboard for a travel website at the following domain: (not online yet). It will have five pages: index.html (the site s homepage), Accommodation, Transportation/Maps, Things To Do and Blogs. Each of these pages are accessible via a horizontal menu as displayed in Layout Type #1, that is below the storyboard and content tree. Each of these pages will be optimized using SEO (Search Engine Optimization). Any modifications to the site will be made in consultation with me by phone, or in person. This storyboard illustrates that there are 2 4 areas of focus per menu item. As discussed, there will be an area for users to blog their experiences after visiting Vancouver and reviews of restaurants, accommodation and entertainment. Under consideration is the future use of PHP/MySQL to store user data. The blog itself may later be updated to make use of these Web Technologies. Use of a database would help with data entry and storage of information. There are two special features on this website: A weather report and a monthly calendar that is on each page. Underneath this is a section of three internal links. All of these are on the left side of the website. As shown on the content tree below, the content area on the right would contain data associated with different aspects of tourism in Vancouver, as well as day trips to Bellingham and Seattle. Included with this information would be external links to outside sources such as TransLink, restaurants and ski resorts. Listed below is a summary of each page.

3 The Accommodation page will contain a table listing recommended hotels/motels in Vancouver (1a), each with a photo, location, room description and price. The use of JPEG photos will be used for each hotel or motel, as well as links (via the location text) to the accommodation for further reference. This table will contain features for those with vision problems, as well as a reference to the last price update for the accommodation. The hostels section (1b) will contain the same type of formatting, but will also include a link to Hosteling International Canada. The content of the Transportation/Maps page will contain a map showing YVR Airport gate terminals (JPEG), as well as a link to their website. Each of the remaining sections of the page will contain photos and descriptive text similar to Layout Type #2 (see below) of each area of interest (2a) or form of transportation (2c, 2d). All of these will be accessible via a Google Map that is at the bottom of the page (not shown). Listed on this page will be information about car rentals (2b), as well as taxis available from YVR. All of these entries will have external links. The Things To Do page will consist of photos and descriptions as well as reviews by different users: food/entertainment (3a), recreation (3b) and day trips (3c), with any references to blogs in the text itself (internal links). There will be links to Grouse, Seymour, transportation services and car rental agencies. Each time a new entry is made, there will be an update to the calendar using JavaScript that provides a link back to the entry on the page. On the index page, there will be links to two entries on this page as well as to Accommodation (1a, 1b). On the Blog page, there will be an area for display/user entry (4a, 4b) as determined by a toggle (i.e. a button). A grouped form entry field will be used, and upon submit, the contents of the entry form will be sent to an external e mail address. This is to eventually be replaced by a PHP/MySQL record data system. In both cases, the entry data will be validated with JavaScript. For each blog, an entry will be made in the Calendar (use of JavaScript), with the possibility of an entry being made to Things To Do. Some information will be put in both pages.

4

5 Layout Type #1

6 Layout Type #2

7