Individual Project

Due Saturday 12/07/2018 23:59:59

This assignment is intended to demonstrate your level of mastery of the course material. You will have a total of 12 weeks to complete the project with deliverables that are due almost every week. Refer to the Meetings section for details.

What is the individual project?

Your goal is to design and develop a website on a topic that interests you. The website needs to have a minimum of 3 pages with unique layouts. An ideal topic will have the following qualities

• Content on the topic is readily available
• Easy to find images, video and other multimedia resources
• Something that you can showcase during an internship or job interview

How to submit website & other deliverables?

Similar to you weekly assignments, the project and all deliberables must be submitted via Blackboard. Project documents that are emailed or submitted outside Blackboard will receive 0 points. You'll also upload your project files to your personal GitHub repository to allow them to display on the web.

Grading rubrik and Project Milestones

This project has a total point value of 50. This is divided as follows

More information on each of the above criteria is below.

Project Idea

Submit a half page proposal (50 - 100 words) describing the main idea behind your project. You should also include some information about what you intend to have in the different pages.

Project Media + Sitemap

In your project folder create a separate sub-folder to collect the media you intend to include in your website. Media can be images, links to videos, audio files and content. You can paste the links in a MS-Word document or a regular text file. Some of the content that you find on the internet can be copyrighted so make sure you also save the source information.

Submit a Sitemap for your project. Even though you only need 3 unique pages you can list more sub-pages as needed.

Wireframes

These are the project blue prints. You will use these as guides to implement the web pages. There are vast number of tools you can use to create wireframes. We will talk more about wireframes during class starting around Week 4. If you need inspiration try the following sites

• dribbble.com
• awwwards

v1 with Semantic Markup

Semantic markup ensure search engines and bots can parse through your site content and identify imporant block. In this phase you are required to

• Create skeleton html pages with proper file names (1 point)
• Include content in pages and markup using appropriate tags (3 points)
• Verify the validity of HTML using W3C Validator (1 point)

v2 using Basic CSS

You can now start thinking about adding CSS to implement the wireframes. You will most likely be adding and/or removing HTML markup that you submitted previously. That is totally fine. Before you start including CSS it is recommended that you have

An idea of the color scheme you intend on using in the site. By the end of this phase your site should include:

• All pages should have valid HTML markup
• At least one of the pages should be responsive.
• At least one of the pages should pass the accessibility test (Use the free WAVE Chrome Extension)

v3 using Bootstrap

In this phase you are required to enchance your website by using a CSS framework like Bootstrap. By the end of the this phase your site should be

• Responsive. You can check for validity at W3C Mobile Checker
• All pages should have valid HTML markup
• Run through WAVE tool and should have 0 errors
• You should research and use advanced Bootstrap componenents or JS plugins
• Apply your own customizations to site