Objective

Create a professional personal website. This website should be useful post-course for your career! Your website should be designed based on your current career aspirations. For example, if you aim to be a programmer, you might include Profile, Job Experience, Education details, Code samples, links to projects, blog posts, skill set visualizations, etc. If you aspire to be a photographer, you may wish to include: Photography, Art projects, Collaborations, Education,  Experience, Blog, etc. Topics need not be approved provided they do not violate the student code of conduct.

Part 1: Planning

Include a small writeup of what your goals (500 words maximum). The paragraph should discuss what your website aims to do (e.g., I want to be a programmer, so this website will feature the following…). Submit this document within your zip as a PDF with the title planning.

Part 2: Research

Find three examples of personal websites that you feel a well designed. For each of the site include the following:

1.   URL

2.   Screenshot of the pages you feel present good design.

3.   A writeup of the design features you appreciate and why (500 word maximum)

Submit this document within your zip as a PDF with the title research.

Part 3: Prototype

Create a low-fidelity prototype by creating a wireframe of the website you are going to build. The following parameters should be outlined within the wireframe plan:

-     Website Layout and Structure

o Complete wireframes for each page

-     File Structure

o Outlining where in your child/parent folder hierarchy each asset is located.

-     Navigation diagram (annotations in your wireframe to explain website navigation)

-     List of assets with their locations and types.

Wireframes maybe made in any program of your choosing (e.g., paint, adobe CS, Axure, Figma, PowerPoint, etc.). You may neatly draw your plan on paper, scan and present drawings in a PDF titled prototype. If you choose to do a handwritten/scanned prototype, you must ensure that the PDF is legible or you will not get full marks.

Part 4: Code

The website will then be coded according to your plan. Your website must have:

-     At least three (3) pages

o Homepage must be titled index.html

o Other webpages should be titled based on the webpage’s content

-     A navigation structure (widget, sidebar, menu, etc.)

-     At least three (3) images

o With alt text

o Specific size (width and height)

-     At least five (5) links

o At least one of these links must use a picture

o At least one link should be external

-     At least two (2) videos

o Both with control scheme

o At least one video file should be included (relative path)

o At least one video should be external (e.g., YouTube)

-     At least one (1) audiofile

o With control scheme

-     Head and Fav Icon

-     An ordered list ( 1)

-      Nested list ( 1)

-     Table ( 1)

Part 5: READ ME

In a README file which explains the structure of your code including all relative paths in a text file: README.txt Here is where you will document your code. For each function, include a purpose, and as applicable: input and output, example, dependent code structures. Include any references to materials used (e.g., photos or stock images).

Remember to cite external sources using ACM (Association for Computing Machinery) format. Referencing Format: https://www.acm.org/publications/authors/reference-formatting

Parameters

For full marks, your website must:

•    Be submitted properly in accordance with submission instructions

•    Be complete as specified by the objectives

•   You may only use relative links for content (except for any external links)

•   You may only use HTML (no css, no java, etc.)